I fixed lists in my blog
========================

A small improvement to my blog today. I was checking out my now post and noticed that lists have left padding but no discs or numbers. I popped open my added...

Date: January 21, 2025

A small improvement to my blog today. I was checking out my /now post and
noticed that lists have left padding but no discs or numbers. I popped open my
`tailwind/app.css` added these lines and rebuilt.

``` css
#post-body li {
 @apply list-disc;
}
#post-body ol {
 @apply list-decimal;
}
```

And rebuild, which I actually do with ⭐ casey just [1], but showing the
command here for clarity.

``` bash
npx tailwindcss --input tailwind/app.css --output static/app-39.css
```

## WHY the applies

{.bg-blue-900 .border-r-8 .border-black .rounded-xl .max-w-xl .p-6 .font-bold}
Dude, you know that @apply is an anti-pattern in tailwind right?

{.bg-green-900 .border-l-8 .border-black .rounded-xl .max-w-xl .p-6 .ml-auto .mr-0 .font-bold}
Ya

{.bg-blue-900 .border-r-8 .border-black .rounded-xl .max-w-xl .p-6 .font-bold}
WTF are you doing? this is all wrong.

{.bg-green-900 .border-l-8 .border-black .rounded-xl .max-w-xl .p-6 .ml-auto .mr-0 .font-bold}
I use @apply in my blog because the html is generated by a markdown library,
and changing the html at this low level would be quite difficult, this is easy.

## Before

![image](https://dropper.waylonwalker.com/api/file/5c48f763-5ef6-49b0-9e8f-5167ab046f05.webp)

## After

![image](https://dropper.waylonwalker.com/api/file/0cf1c5d9-0948-444f-9a6c-387d22b9db43.webp)

References:
[1]: /casey-just/