SebinNyshkim/blog
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: ✨ upgrade to tailwind v4

Browse source
This commit is contained in:
Sebin Nyshkim 2025-01-30 18:27:37 +01:00
parent 6bacdd4a1c
commit 4a444614bc
8 changed files with 30 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/layouts/postlist.njk
View file

@ -2,7 +2,7 @@
layout: base.njk
---
<section class="prose prose-slate mx-auto pt-28 px-safe-offset-4 md:prose-lg lg:prose-xl 2xl:prose-2xl dark:prose-invert prose-headings:font-normal prose-strong:text-inherit prose-li:marker:!text-inherit prose-th:font-bold prose-img:rounded-3xl sm:pt-52 md:px-safe-offset-6">
<section class="prose prose-slate mx-auto pt-28 px-safe-offset-4 md:prose-lg lg:prose-xl 2xl:prose-2xl dark:prose-invert prose-headings:font-normal prose-strong:text-inherit prose-li:marker:text-inherit! prose-th:font-bold prose-img:rounded-3xl sm:pt-52 md:px-safe-offset-6">
<h1>{{ title }}</h1>
<p>Everything I have written, from newest to oldest.</p>
@ -15,21 +15,21 @@ layout: base.njk
<ol class="flex justify-center gap-2">
<li>
{% if page.url != pagination.href.first %}
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 hover:dark:bg-slate-700" href="{{ pagination.href.first }}">{% lucide "chevron-first" %}</a>
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700" href="{{ pagination.href.first }}">{% lucide "chevron-first" %}</a>
{% else %}
<span class="flex size-10 cursor-not-allowed items-center justify-center rounded-full bg-slate-400 text-slate-300 dark:bg-slate-950 dark:text-slate-700" aria-disabled="true">{% lucide "chevron-first" %}</span>
{% endif %}
</li>
<li>
{% if pagination.href.previous %}
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 hover:dark:bg-slate-700" href="{{ pagination.href.previous }}">{% lucide "chevron-left" %}</a>
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700" href="{{ pagination.href.previous }}">{% lucide "chevron-left" %}</a>
{% else %}
<span class="flex size-10 cursor-not-allowed items-center justify-center rounded-full bg-slate-400 text-slate-300 dark:bg-slate-950 dark:text-slate-700" aria-disabled="true">{% lucide "chevron-left" %}</span>
{% endif %}
</li>
{%- for pageEntry in pagination.pages %}
<li>
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 aria-[current]:bg-sky-600 aria-[current]:text-slate-300 dark:bg-slate-800 hover:dark:bg-slate-700 aria-[current]:dark:bg-slate-700"
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 aria-[current]:bg-sky-600 aria-[current]:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 dark:aria-[current]:bg-slate-700"
href="{{ pagination.hrefs[ loop.index0 ] }}"
{% if page.url == pagination.hrefs[ loop.index0 ] %}
aria-current="page"
@ -41,14 +41,14 @@ layout: base.njk
{%- endfor %}
<li>
{% if pagination.href.next %}
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 hover:dark:bg-slate-700" href="{{ pagination.href.next }}">{% lucide "chevron-right" %}</a>
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700" href="{{ pagination.href.next }}">{% lucide "chevron-right" %}</a>
{% else %}
<span class="flex size-10 cursor-not-allowed items-center justify-center rounded-full bg-slate-400 text-slate-300 dark:bg-slate-950 dark:text-slate-700" aria-disabled="true">{% lucide "chevron-right" %}</span>
{% endif %}
</li>
<li>
{% if page.url != pagination.href.last %}
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 hover:dark:bg-slate-700" href="{{ pagination.href.last }}">{% lucide "chevron-last" %}</a>
<a class="flex size-10 items-center justify-center rounded-full bg-slate-100 hover:bg-sky-600 hover:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700" href="{{ pagination.href.last }}">{% lucide "chevron-last" %}</a>
{% else %}
<span class="flex size-10 cursor-not-allowed items-center justify-center rounded-full bg-slate-400 text-slate-300 dark:bg-slate-950 dark:text-slate-700" aria-disabled="true">{% lucide "chevron-last" %}</span>
{% endif %}