making this 'theme' actually a modular theme, not just a template

This commit is contained in:
Aleksa Siriški 2023-06-08 00:44:49 +02:00
parent 18c62fcda1
commit 98acdbe381
No known key found for this signature in database
6 changed files with 128 additions and 184 deletions

View File

@ -10,22 +10,99 @@ paginate: 9
darkmode_js: darkmode_js:
- assets/js/darkmode.js - assets/js/darkmode.js
enableInlineShortcodes: true enableInlineShortcodes: true
params: params:
author: Nusser Studios author: Nusser Studios
authorimage: ../assets/images/global/author.webp authorimage: ../assets/images/global/author.webp
github: 'https://github.com/nusserstudios'
facebook: 'https://facebook.com/nusserstudios'
og_image: /images/tailbliss-cover.png og_image: /images/tailbliss-cover.png
sitename: TailBliss moto: "Super Fast, and Flexible"
twitter: '@nusserstudios' description: "A Hugo theme built with love, using TailwindCSS 3, Alpine.JS, and Hugo Pipes. Images are optimized for use with Hugo Pipes for WebP format."
description: TailBliss is Hugo Starter disable_theme_toggle: false
disable_stay_uptodate: false
p1:
heading: "Our mission"
content:
- text: "Sagittis scelerisque nulla cursus in enim consectetur quam. Dictum urna sed consectetur neque tristique pellentesque. Blandit amet, sed aenean erat arcu morbi. Cursus faucibus nunc nisl netus morbi vel porttitor vitae ut. Amet vitae fames senectus vitae."
- text: "Sollicitudin tristique eros erat odio sed vitae, consequat turpis elementum. Lorem nibh vel, eget pretium arcu vitae. Eros eu viverra donec ut volutpat donec laoreet quam urna. Sollicitudin tristique eroserat odio sed vitae, consequat turpis elementum. Lorem nibh vel, eget pretium arcu vitae. Eros eu viverra donec ut volutpat donec laoreet quam urna."
- text: "Rhoncus nisl, libero egestas diam fermentum dui. At quis tincidunt vel ultricies. Vulputate aliquet velit faucibus semper. Pellentesque in venenatis vestibulum consectetur nibh id. In id ut tempus egestas. Enim sit aliquam nec, a. Morbi enim fermentum lacus in. Viverra."
p2:
heading: "Just in time for Hacktoberfest with JIT Tailwind."
content:
- text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur at purus non enim commodo tincidunt vel in nulla. Aenean pretium dolor non ultricies bibendum. Etiam quis blandit enim. Nunc condimentum ut lorem in faucibus. Phasellus varius ligula et commodo tristique. Nunc sodales nisl nec laoreet vehicula. Donec velit nibh, sollicitudin at nulla a, egestas dignissim eros. Sed lacinia hendrerit interdum. Vestibulum pellentesque sem venenatis nisl tempor accumsan sit amet tempus felis. Mauris leo diam, porttitor nec bibendum id, tempus ac nulla. Etiam congue ornare erat at convallis. Donec in nisi dapibus, mattis risus vel, imperdiet enim. Donec fermentum sit amet tortor nec tincidunt. Nam nec lectus tortor. Nunc sit amet laoreet orci, porta ornare massa. Phasellus eget lorem mi. Nam eleifend ultricies sapien, quis mollis leo bibendum at. Quisque viverra lorem sit amet magna aliquet, et dignissim arcu eleifend."
social_media:
github:
enabled: true
url: 'https://github.com/nusserstudios'
facebook:
enabled: true
url: 'https://facebook.com/nusserstudios'
instagram:
enabled: true
url: 'https://instagram.com/nusserstudios'
twitter:
enabled: true
url: '@nusserstudios'
menu:
main:
- identifier: prose
name: Prose
url: /prose/
weight: 10
- identifier: about
name: About
url: /about/
weight: 20
- identifier: dropdown_categories
name: Categories
weight: 30
- identifier: contact
name: Contact
url: /contact/
weight: 40
dropdown_categories:
- identifier: prose
name: Prose
url: /prose/
weight: 10
- identifier: about
name: About
url: /about/
weight: 20
footer:
- identifier: about
name: About
url: /about/
weight: 10
- identifier: blog
name: Blog
url: /categories/blog/
weight: 20
- identifier: news
name: News
url: /categories/news/
weight: 30
- identifier: prose
name: Prose
url: /prose/
weight: 40
- identifier: contact
name: Contact
url: /contact/
weight: 50
markup: markup:
goldmark: goldmark:
renderer: renderer:
unsafe: true unsafe: true
taxonomies: taxonomies:
category: Categories category: Categories
tag: Tags tag: Tags
privacy: privacy:
disqus: disqus:
disable: false disable: false
@ -48,6 +125,7 @@ privacy:
youtube: youtube:
disable: false disable: false
privacyEnhanced: true privacyEnhanced: true
module: module:
hugoVersion: hugoVersion:
extended: true extended: true

View File

@ -6,32 +6,13 @@
<div class="col-span-6 px-4 text-center sm:mb-6 lg:text-left lg:mb-0"> <div class="col-span-6 px-4 text-center sm:mb-6 lg:text-left lg:mb-0">
<h1 <h1
class="mb-2 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-5xl xl:text-6xl dark:text-white"> class="mb-2 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-5xl xl:text-6xl dark:text-white">
TailBliss</h1> {{ .Site.Title }}</h1>
<h2 class="pb-2 text-3xl font-light text-gray-800 dark:text-gray-300 md:text-4xl"> <h2 class="pb-2 text-3xl font-light text-gray-800 dark:text-gray-300 md:text-4xl">
Super Fast, and Flexible {{ .Site.Params.Moto }}
</h2> </h2>
<a href="https://github.com/nusserstudios/tailbliss"
class="block py-4 mx-auto space-x-4 sm:inline-flex md:inline-flex sm:text-center sm:block">
<span
class="rounded bg-gray-50 px-2.5 py-1 text-sm font-bold text-gray-900 block max-w-fit mx-auto md:min-w-fit mb-2">
What's new
</span>
<span
class="inline-flex items-center mb-2 space-x-1 text-sm font-medium text-gray-800 dark:text-white md:min-w-fit">
<span>Just shipped version 0.1.0</span>
<!-- Heroicon name: mini/chevron-right -->
<svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z"
clip-rule="evenodd" />
</svg>
</span>
</a>
<p <p
class="max-w-xl mx-auto mb-6 font-normal text-gray-900 lg:mx-0 xl:mb-2 md:text-lg xl:text-xl dark:text-gray-50"> class="max-w-xl mx-auto mb-6 font-normal text-gray-900 lg:mx-0 xl:mb-2 md:text-lg xl:text-xl dark:text-gray-50">
A Hugo theme built with love, using TailwindCSS 3, Alpine.JS, and Hugo {{ .Site.Params.Description}}</p>
Pipes. Images are optimized for use with Hugo Pipes for WebP format.</p>
</div> </div>
<div class="col-span-6"> <div class="col-span-6">
{{ $hero := resources.GetMatch "images/pages/tailbliss-rocket-indigo.png" }} {{ $hero := resources.GetMatch "images/pages/tailbliss-rocket-indigo.png" }}
@ -116,26 +97,15 @@
<div class="relative max-w-md px-4 mx-auto sm:max-w-3xl sm:px-6 lg:px-0"> <div class="relative max-w-md px-4 mx-auto sm:max-w-3xl sm:px-6 lg:px-0">
<!-- Content area --> <!-- Content area -->
<div class="md:pt-12 sm:pt-6 lg:pt-20"> <div class="md:pt-12 sm:pt-6 lg:pt-20">
<h2 <h2 class="text-3xl font-bold tracking-tight text-gray-900 capitalize dark:text-gray-50 sm:text-4xl">
class="text-3xl font-bold tracking-tight text-gray-900 capitalize dark:text-gray-50 sm:text-4xl"> {{ .Site.Params.P1.Heading }}
Our mission</h2> </h2>
<div class="mt-6 space-y-6 text-gray-900 dark:text-white"> <div class="mt-6 space-y-6 text-gray-900 dark:text-white">
<p class="text-lg leading-7">Sagittis scelerisque nulla cursus in enim consectetur {{ range .Site.Params.P1.Content }}
quam. Dictum urna sed consectetur neque tristique pellentesque. Blandit <p class="pb-6 mt-6 text-lg text-gray-900 dark:text-white">
amet, sed aenean erat arcu morbi. Cursus faucibus nunc nisl netus morbi {{ .text }}
vel porttitor vitae ut. Amet vitae fames senectus vitae.
</p>
<p class="text-lg leading-7">Sollicitudin tristique eros erat odio sed
vitae, consequat turpis elementum. Lorem nibh vel, eget pretium arcu
vitae. Eros eu viverra donec ut volutpat donec laoreet quam urna.
Sollicitudin tristique eroserat odio sed vitae, consequat turpis elementum. Lorem nibh vel,
eget pretium arcu vitae. Eros eu viverra donec ut volutpat donec laoreet quam urna.
</p>
<p class="text-lg leading-7">Rhoncus nisl, libero egestas diam fermentum
dui. At quis tincidunt vel ultricies. Vulputate aliquet velit faucibus semper.
Pellentesque in venenatis vestibulum consectetur nibh id. In id ut tempus egestas. Enim sit
aliquam nec, a. Morbi enim fermentum lacus in. Viverra.
</p> </p>
{{ end }}
</div> </div>
</div> </div>
</div> </div>
@ -149,24 +119,13 @@
<div class="md:mt-8"> <div class="md:mt-8">
<div class="mt-6 sm:max-w-xl"> <div class="mt-6 sm:max-w-xl">
<h1 class="text-4xl font-bold tracking-tight text-gray-900 dark:text-white sm:text-5xl"> <h1 class="text-4xl font-bold tracking-tight text-gray-900 dark:text-white sm:text-5xl">
Just in time for Hacktoberfest with JIT Tailwind. {{ .Site.Params.P2.Heading }}
</h1> </h1>
<p class="pb-12 mt-6 text-lg text-gray-900 dark:text-white"> {{ range .Site.Params.P2.Content }}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur at purus non enim commodo <p class="pb-6 mt-6 text-lg text-gray-900 dark:text-white">
tincidunt vel in nulla. Aenean pretium dolor non ultricies bibendum. Etiam quis blandit {{ .text }}
enim. Nunc condimentum ut lorem in faucibus. Phasellus varius ligula et commodo tristique.
Nunc sodales nisl nec
laoreet vehicula. Donec velit nibh, sollicitudin at nulla a, egestas dignissim eros. Sed
lacinia hendrerit interdum.
Vestibulum pellentesque sem venenatis nisl tempor accumsan sit amet tempus felis. Mauris leo
diam, porttitor nec
bibendum id, tempus ac nulla. Etiam congue ornare erat at convallis. Donec in nisi dapibus,
mattis risus vel, imperdiet enim. Donec
fermentum sit amet tortor nec tincidunt. Nam nec lectus tortor. Nunc sit amet laoreet orci,
porta ornare massa. Phasellus
eget lorem mi. Nam eleifend ultricies sapien, quis mollis leo bibendum at. Quisque viverra
lorem sit amet magna aliquet, et dignissim arcu eleifend.
</p> </p>
{{ end }}
</div> </div>
</div> </div>
</div> </div>
@ -551,6 +510,7 @@
</div> </div>
</div> </div>
{{ if not .Site.Params.Disable_stay_uptodate}}
<!-- CTA section --> <!-- CTA section -->
<div class="relative pb-16 mt-6"> <div class="relative pb-16 mt-6">
<div aria-hidden="true" class="hidden sm:block"> <div aria-hidden="true" class="hidden sm:block">
@ -604,6 +564,7 @@
</div> </div>
</div> </div>
</div> </div>
{{ end }}
</main> </main>
{{ end }} {{ end }}

View File

@ -6,27 +6,14 @@
<footer class="bg-gray-900"> <footer class="bg-gray-900">
<div class="max-w-md px-4 py-12 mx-auto overflow-hidden sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8"> <div class="max-w-md px-4 py-12 mx-auto overflow-hidden sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8">
<nav class="flex flex-wrap justify-center -mx-5 -my-2" aria-label="Footer"> <nav class="flex flex-wrap justify-center -mx-5 -my-2" aria-label="Footer">
{{ range site.Menus.footer }}
<div class="px-5 py-2"> <div class="px-5 py-2">
<a href="/about" class="text-base text-gray-400 hover:text-gray-300">About</a> <a href="{{ .URL | absLangURL }}" class="text-base text-gray-400 hover:text-gray-300">{{ .Name }}</a>
</div>
<div class="px-5 py-2">
<a href="/categories/blog/" class="text-base text-gray-400 hover:text-gray-300">Blog</a>
</div>
<div class="px-5 py-2">
<a href="/categories/news/" class="text-base text-gray-400 hover:text-gray-300">News</a>
</div>
<div class="px-5 py-2">
<a href="/prose/" class="text-base text-gray-400 hover:text-gray-300">Prose</a>
</div>
<div class="px-5 py-2">
<a href="/contact/" class="text-base text-gray-400 hover:text-gray-300">Contact</a>
</div> </div>
{{ end }}
</nav> </nav>
<div class="flex justify-center mt-8 space-x-6"> <div class="flex justify-center mt-8 space-x-6">
{{ if .Site.Params.Social_media.Facebook.Enabled }}
<a href="#" class="text-gray-400 hover:text-gray-300"> <a href="#" class="text-gray-400 hover:text-gray-300">
<span class="sr-only">Facebook</span> <span class="sr-only">Facebook</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
@ -35,7 +22,8 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
{{ end }}
{{ if .Site.Params.Social_media.Instagram.Enabled }}
<a href="#" class="text-gray-400 hover:text-gray-300"> <a href="#" class="text-gray-400 hover:text-gray-300">
<span class="sr-only">Instagram</span> <span class="sr-only">Instagram</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
@ -44,7 +32,8 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
{{ end }}
{{ if .Site.Params.Social_media.Twitter.Enabled }}
<a href="#" class="text-gray-400 hover:text-gray-300"> <a href="#" class="text-gray-400 hover:text-gray-300">
<span class="sr-only">Twitter</span> <span class="sr-only">Twitter</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
@ -52,7 +41,8 @@
d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" /> d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" />
</svg> </svg>
</a> </a>
{{ end }}
{{ if .Site.Params.Social_media.Github.Enabled }}
<a href="#" class="text-gray-400 hover:text-gray-300"> <a href="#" class="text-gray-400 hover:text-gray-300">
<span class="sr-only">GitHub</span> <span class="sr-only">GitHub</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
@ -61,15 +51,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
{{ end }}
<a href="#" class="text-gray-400 hover:text-gray-300">
<span class="sr-only">Dribbble</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd"
d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z"
clip-rule="evenodd" />
</svg>
</a>
</div> </div>
<p class="mt-8 text-base text-center text-gray-400">&copy; {{ now.Format "2006" }} <p class="mt-8 text-base text-center text-gray-400">&copy; {{ now.Format "2006" }}
{{ .Site.Title }}. All rights {{ .Site.Title }}. All rights

View File

@ -6,7 +6,6 @@
<meta name="twitter:title" content="{{ .Title }} | {{ .Site.Title }}" /> <meta name="twitter:title" content="{{ .Title }} | {{ .Site.Title }}" />
<meta itemprop="name" content="{{ .Title }} | {{ .Site.Title }}" /> <meta itemprop="name" content="{{ .Title }} | {{ .Site.Title }}" />
<meta name="application-name" content="{{ .Title }} | {{ .Site.Title }}" /> <meta name="application-name" content="{{ .Title }} | {{ .Site.Title }}" />
<meta property="og:site_name" content="{{ .Site.Params.sitename }}" />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta property="og:title" content="{{ .Site.Title }}" /> <meta property="og:title" content="{{ .Site.Title }}" />
<meta property="og:description" <meta property="og:description"
@ -14,11 +13,6 @@
<meta property="og:site_name" content="{{ .Site.Title }}" /> <meta property="og:site_name" content="{{ .Site.Title }}" />
<meta property="og:url" content="{{ .Permalink }}" /> <meta property="og:url" content="{{ .Permalink }}" />
<meta property="og:locale" content="en"> <meta property="og:locale" content="en">
{{ if .Params.og_image }}
<meta property="og:image" content="{{ .Params.Site.BaseURL }}{{ .Params.og_image | relURL }}" />
<meta property="og:image:secure_url" content="{{ .Params.og_image | absURL }}" />
{{ else }}
<meta property="og:image" content="{{ .Params.Site.BaseURL }}{{ .Site.Params.og_image | relURL }}" /> <meta property="og:image" content="{{ .Params.Site.BaseURL }}{{ .Site.Params.og_image | relURL }}" />
<meta property="og:image:secure_url" content="{{ .Site.Params.og_image | absURL }}" /> <meta property="og:image:secure_url" content="{{ .Site.Params.og_image | absURL }}" />
{{ end }}
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />

View File

@ -23,14 +23,12 @@
</div> </div>
<nav :class="{'flex': open, 'hidden': !open}" <nav :class="{'flex': open, 'hidden': !open}"
class="flex-col flex-grow hidden pb-4 md:pb-0 md:flex md:justify-end md:flex-row"> class="flex-col flex-grow hidden pb-4 md:pb-0 md:flex md:justify-end md:flex-row">
<a class="px-4 py-2 mt-2 text-sm font-semibold rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline" {{ range site.Menus.main }}
href="/about/">About</a> {{ if (findRE "dropdown_" .Identifier) }}
<a class="px-4 py-2 mt-2 text-sm font-semibold rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="/prose/">Prose</a>
<div @click.away="open = false" class="relative" x-data="{ open: false }"> <div @click.away="open = false" class="relative" x-data="{ open: false }">
<button @click="open = !open" <button @click="open = !open"
class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg md:w-auto md:inline md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline"> class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg md:w-auto md:inline md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline">
<span>Categories</span> <span>{{ .Name }}</span>
<svg fill="currentColor" viewBox="0 0 20 20" :class="{'rotate-180': open, 'rotate-0': !open}" <svg fill="currentColor" viewBox="0 0 20 20" :class="{'rotate-180': open, 'rotate-0': !open}"
class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1"> class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1">
<path fill-rule="evenodd" <path fill-rule="evenodd"
@ -46,94 +44,21 @@
x-transition:leave-end="transform opacity-0 scale-95" x-transition:leave-end="transform opacity-0 scale-95"
class="absolute right-0 z-30 w-full mt-2 origin-top-right rounded-md shadow-lg md:w-48"> class="absolute right-0 z-30 w-full mt-2 origin-top-right rounded-md shadow-lg md:w-48">
<div class="px-2 py-2 text-primary-900 bg-white rounded-md shadow"> <div class="px-2 py-2 text-primary-900 bg-white rounded-md shadow">
{{ range (index site.Menus .Identifier) }}
<a class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline" <a class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline"
href="/posts/">Posts</a> href="{{ .URL | absLangURL }}">{{- .Name -}}</a>
<a class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline" {{ end }}
href="/categories/news/">News</a>
<a class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="/categories/blog/">Blog</a>
</div> </div>
</div> </div>
</div> </div>
<div @click.away="open = false" class="relative" x-data="{ open: false }"> {{ else }}
<button @click="open = !open" <a class="px-4 py-2 mt-2 text-sm font-semibold rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:focus:bg-gray-600 dark-mode:hover:bg-gray-600 md:w-auto md:inline md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-600 focus:outline-none focus:shadow-outline"> href="{{ .URL | absLangURL }}" title="{{ .Title | default .Name }}">
<span>Dropdown</span> {{ .Name }}
<svg fill="currentColor" viewBox="0 0 20 20" :class="{'rotate-180': open, 'rotate-0': !open}"
class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1">
<path fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
<div x-show="open" x-transition:enter="transition ease-out duration-100"
x-transition:enter-start="transform opacity-0 scale-95"
x-transition:enter-end="transform opacity-100 scale-100"
x-transition:leave="transition ease-in duration-75"
x-transition:leave-start="transform opacity-100 scale-100"
x-transition:leave-end="transform opacity-0 scale-95"
class="absolute right-0 z-30 w-full mt-2 origin-top-right md:max-w-sm md:w-screen">
<div class="px-2 pt-2 pb-4 bg-white rounded-md shadow-lg text-zinc-900">
<div class="grid grid-cols-1 gap-4">
<a class="flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="#">
<div class="p-3 text-white bg-primary-600 rounded-lg group-hover:bg-gray-900">
<svg fill="none" stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
<path
d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z">
</path>
</svg>
</div>
<div class="ml-3">
<p class="font-semibold">Appearance</p>
<p class="text-sm">Easy customization</p>
</div>
</a>
<a class="flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="#">
<div class="p-3 text-white bg-primary-600 rounded-lg group-hover:bg-gray-900">
<svg fill="none" stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
<path
d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z">
</path>
</svg>
</div>
<div class="ml-3">
<p class="font-semibold">Comments</p>
<p class="text-sm">Check your latest comments</p>
</div>
</a>
<a class="flex items-start p-2 bg-transparent rounded-lg group row hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="#">
<div class="p-3 text-white bg-primary-600 rounded-lg group-hover:bg-gray-900">
<svg fill="none" stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"
class="w-4 h-4 md:h-6 md:w-6">
<path d="M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z">
</path>
<path d="M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z">
</path>
</svg>
</div>
<div class="ml-3">
<p class="font-semibold">Analytics</p>
<p class="text-sm">Take a look at your statistics</p>
</div>
</a>
</div>
</div>
</div>
</div>
<a class="px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg md:mt-0 md:ml-4 hover:text-white focus:text-white hover:bg-primary-600 focus:bg-primary-700 focus:outline-none focus:shadow-outline"
href="/contact">
Contact
</a> </a>
{{ end }}
{{ end }}
{{ if not .Site.Params.Disable_theme_toggle }}
<button id="theme-toggle" type="button" <button id="theme-toggle" type="button"
class="p-2 text-sm text-gray-500 rounded-lg md: dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 md:ml-2 max-w-5 xs:hidden"> class="p-2 text-sm text-gray-500 rounded-lg md: dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 md:ml-2 max-w-5 xs:hidden">
<svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" <svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20"
@ -147,6 +72,7 @@
fill-rule="evenodd" clip-rule="evenodd"></path> fill-rule="evenodd" clip-rule="evenodd"></path>
</svg> </svg>
</button> </button>
{{ end }}
</nav> </nav>
</div> </div>
</div> </div>

View File

@ -12,6 +12,8 @@ demosite = "https://tailbliss.netlify.app/"
tags = ["blog", "tailwind", "tailwindcss", "dark", "light", "responsive", "minimal", "portfolio", "company", "gallery", "personal" ] tags = ["blog", "tailwind", "tailwindcss", "dark", "light", "responsive", "minimal", "portfolio", "company", "gallery", "personal" ]
features = ["blog", "categories", "webp", "tailwind3", "alpinejs"] features = ["blog", "categories", "webp", "tailwind3", "alpinejs"]
min_version = "0.104.0"
# If the theme has a single author # If the theme has a single author
[author] [author]
name = "Jeremy Nusser" name = "Jeremy Nusser"
@ -20,5 +22,6 @@ features = ["blog", "categories", "webp", "tailwind3", "alpinejs"]
# If porting an existing theme # If porting an existing theme
[original] [original]
name = "Hugo-Tailwind-3.1" name = "Hugo-Tailwind-3.1"
author = "4044ever"
homepage = "https://github.com/4044ever" homepage = "https://github.com/4044ever"
repo = "https://github.com/4044ever/Hugo-Tailwind-3.1" repo = "https://github.com/4044ever/Hugo-Tailwind-3.1"