fix: 💄 increase breakpoint for biggest font-size

This commit is contained in:
Sebin Nyshkim 2024-10-20 23:40:31 +02:00
parent 20e3d71b2a
commit 4f766fca0f
4 changed files with 6 additions and 6 deletions

View file

@ -9,7 +9,7 @@ layout: base.njk
{% endif %}
class="relative mb-8 grid h-96 grid-flow-row grid-rows-article-header place-items-center space-y-6 bg-cover bg-center pb-8 pt-20 px-safe-offset-4 *:z-10 before:absolute before:inset-0 before:bg-slate-300 before:bg-opacity-65 sm:h-128 sm:pt-28 md:pt-32 md:px-safe-offset-6 lg:mb-12 lg:h-160 lg:pb-12 2xl:h-192 before:dark:bg-slate-900 before:dark:bg-opacity-65"
>
<div class="prose prose-slate mx-auto md:prose-lg lg:prose-xl xl:prose-2xl dark:prose-invert prose-headings:font-normal">
<div class="prose prose-slate mx-auto md:prose-lg lg:prose-xl 2xl:prose-2xl dark:prose-invert prose-headings:font-normal">
<h1 class="text-balance text-center">{{ title }}</h1>
</div>
<div class="not-prose space-y-6 self-end text-sm md:text-base xl:text-lg 2xl:text-xl">
@ -28,7 +28,7 @@ layout: base.njk
</div>
</header>
<section class="prose prose-slate mx-auto px-safe-offset-4 md:prose-lg lg:prose-xl xl:prose-2xl dark:prose-invert prose-headings:font-normal prose-strong:font-bold prose-strong:text-inherit prose-li:marker:!text-inherit prose-th:font-bold prose-img:rounded-3xl md:px-safe-offset-6">
<section class="prose prose-slate mx-auto px-safe-offset-4 md:prose-lg lg:prose-xl 2xl:prose-2xl dark:prose-invert prose-headings:font-normal prose-strong:font-bold prose-strong:text-inherit prose-li:marker:!text-inherit prose-th:font-bold prose-img:rounded-3xl md:px-safe-offset-6">
{{ content | safe }}
</section>
</article>

View file

@ -2,6 +2,6 @@
layout: base.njk
---
<section class="prose prose-slate mx-auto pt-28 px-safe-offset-4 md:prose-lg lg:prose-xl xl: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">
{{ content | safe }}
</section>

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 xl: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>

View file

@ -12,7 +12,7 @@ pagination:
---
{% for post in blogposts %}
<article class="prose prose-slate mx-auto px-safe-offset-4 md:prose-lg lg:prose-xl xl: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 md:px-safe-offset-6">
<article class="prose prose-slate mx-auto 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 md:px-safe-offset-6">
<h1>{{ post.data.title }}</h1>
<div class="not-prose">
{%- from 'postmeta.macro.njk' import postmeta %}
@ -25,7 +25,7 @@ pagination:
<p>{{ post.data.description }}</p>
<a href="{{ post.url }}" class="button inline-flex items-center gap-2 rounded-xl bg-sky-600 px-5 py-2 font-bold text-white no-underline transition-colors duration-300 *:stroke-[2.5] hover:bg-sky-700 xl:rounded-2xl xl:px-6 xl:py-3">
<a href="{{ post.url }}" class="button inline-flex items-center gap-2 rounded-xl bg-sky-600 px-5 py-2 font-bold text-white no-underline transition-colors duration-300 *:stroke-[2.5] hover:bg-sky-700 2xl:rounded-2xl 2xl:px-6 2xl:py-3">
Read on {% lucide "chevron-right", { "class": "size-6 md:size-7 xl:size-8" } %}
</a>
</article>