WingNews logo WingNews
top | item 47028274

(no title)

luckylion | 14 days ago

this is grey text from tailwindcss.com, I wouldn't call it easy and readable.

<div class="relative before:absolute before:top-0 before:h-px before:w-[200vw] before:bg-gray-950/5 dark:before:bg-white/10 before:-left-[100vw] after:absolute after:bottom-0 after:h-px after:w-[200vw] after:bg-gray-950/5 dark:after:bg-white/10 after:-left-[100vw]"><p class="max-w-(--breakpoint-md) px-2 text-base/7 text-gray-600 max-sm:px-4 dark:text-gray-400">Because Tailwind is so low-level, it never encourages you to design the same site twice. Some of your favorite sites are built with Tailwind, and you probably had no idea.</p></div>

discuss

order

halfcat|14 days ago

In my editor this looks like this, with an extension like Tailwind Fold or Inline Fold:

    <div class="...">
      <p class="...">
        Because Tailwind is so low-level, it never encourages you to design the same site twice. Some of your favorite sites are built with Tailwind, and you probably had no idea.
      </p>
    </div>

dwb|14 days ago

Ok, and how does it look when you want to read or edit the “classes”?