cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: refactor nav

Browse source
This commit is contained in:
Cory Dransfeldt 2023-08-13 18:05:58 -07:00
parent 5428e3f563
commit 9ddd1459d3
No known key found for this signature in database
11 changed files with 47 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/_includes/icons/coffee.liquid
View file

@ -1,5 +1,5 @@
<a
class="link--icon icon--24"
class="link--icon icon--24"
href="https://www.buymeacoffee.com/cory"
rel="me"
title="Buy Me a Coffee">

3
src/_includes/icons/rss.liquid
View file

@ -1,3 +0,0 @@
<a href="/feeds" title="RSS" class="link--icon icon--24{% if page.url == '/feeds/' %} active{% endif %}">
{% tablericon "rss" "RSS" %}
</a>

3
src/_includes/icons/search.liquid
View file

@ -1,3 +0,0 @@
<a href="/search" title="Search posts" class="link--icon icon--24{% if page.url == '/search/' %} active{% endif %}">
{% tablericon "search" "Search posts" %}
</a>

3
src/_includes/icons/tags.liquid
View file

@ -1,3 +0,0 @@
<a href="/tags" title="Post tags" class="link--icon icon--24{% if page.url == '/tags/' %} active{% endif %}">
{% tablericon "tag" "Post tags" %}
</a>

3
src/_includes/icons/webrings.liquid
View file

@ -1,3 +0,0 @@
<a href="/webrings" title="RSS" class="link--icon icon--24{% if page.url == '/webrings/' %} active{% endif %}">
{% tablericon "heart-handshake" "Webrings" %}
</a>

4
src/_includes/partials/footer.liquid
View file

@ -11,7 +11,7 @@
{% render "icons/coffee.liquid" %}
</div>
<div class="text-sm text-gray-500 dark:text-gray-100 pb-8 text-center">
<a class="text-gray-700 dark:text-gray-200{% if page.url == '/uses/' %} active{% endif %}" href="/uses">Uses</a> •
<a class="text-gray-700 dark:text-gray-200{% if page.url == '/referrals/' %} active{% endif %}" href="/referrals">Referrals</a>
{% render "partials/nav/link.liquid", page: page, link: "Uses" %} •
{% render "partials/nav/link.liquid", page: page, link: "Referrals" %}
</div>
</footer>

2
src/_includes/partials/header.liquid
View file

@ -2,5 +2,5 @@
<h1 class="text-2xl md:text-3xl font-black leading-tight pb-5 md:pb-0">
<a class="text-gray-700 dark:text-gray-200" href="/">{{ site.title }}</a>
</h1>
{% render "partials/nav.liquid", page: page %}
{% render "partials/nav/menu.liquid", page: page %}
</div>

22
src/_includes/partials/nav.liquid
View file

@ -1,22 +0,0 @@
<nav>
<ul class="flex">
<li class="mr-6">
<a class="text-gray-700 hover:text-pink-500 dark:text-gray-200 dark:hover:text-pink-500 !no-underline{% if page.url == '/now/' %} active{% endif %}" href="/now">Now</a>
</li>
<li class="mr-6">
<a class="text-gray-700 hover:text-pink-500 dark:text-gray-200 dark:hover:text-pink-500 !no-underline{% if page.url == '/about/' %} active{% endif %}" href="/about">About</a>
</li>
<li class="mr-6">
{% render "icons/tags.liquid", page: page %}
</li>
<li class="mr-6 client-side">
{% render "icons/search.liquid", page: page %}
</li>
<li class="mr-6">
{% render "icons/rss.liquid", page: page %}
</li>
<li>
{% render "icons/webrings.liquid", page: page %}
</li>
</ul>
</nav>

19
src/_includes/partials/nav/link.liquid Normal file
View file

@ -0,0 +1,19 @@
{%- capture pageUrl %}/{{ link | downcase }}/{% endcapture -%}
{% if page.url != pageUrl %}
<a class="text-gray-700 hover:text-pink-500 dark:text-gray-200 dark:hover:text-pink-500 !no-underline" href="/{{ link | downcase }}">
{% if icon %}
{% tablericon icon link %}
{% else %}
{{ link }}
{% endif %}
</a>
{% endif %}
{% if page.url == pageUrl %}
<span class="cursor-not-allowed active">
{% if icon %}
{% tablericon icon link %}
{% else %}
{{ link }}
{% endif %}
</span>
{% endif %}

22
src/_includes/partials/nav/menu.liquid Normal file
View file

@ -0,0 +1,22 @@
<nav>
<ul class="flex">
<li class="mr-6">
{% render "partials/nav/link.liquid", page: page, link: "Now" %}
</li>
<li class="mr-6">
{% render "partials/nav/link.liquid", page: page, link: "About" %}
</li>
<li class="mr-6">
{% render "partials/nav/link.liquid", page: page, link: "Tags", icon: "tag" %}
</li>
<li class="mr-6 client-side">
{% render "partials/nav/link.liquid", page: page, link: "Search", icon: "search" %}
</li>
<li class="mr-6">
{% render "partials/nav/link.liquid", page: page, link: "Feeds", icon: "rss" %}
</li>
<li>
{% render "partials/nav/link.liquid", page: page, link: "Webrings", icon: "heart-handshake" %}
</li>
</ul>
</nav>

10
tailwind.css
View file

@ -18,13 +18,7 @@
.active,
.active svg {
color: theme(colors.purple.600) !important;
}
.active:hover,
.active:active,
.active:focus {
color: theme(colors.purple.500) !important;
color: theme(colors.pink.500) !important;
}
.header-anchor {
@ -156,7 +150,7 @@ code[class*=language-], pre[class*=language-] {
@media (prefers-color-scheme: dark) {
.active,
.active svg {
color: theme(colors.purple.400) !important;
color: theme(colors.pink.500) !important;
}
a,