5 ms·

Either Google has shifted _so much_ focus to getting an LLM to tell you about very real Encanto 2 spoilers that its search capabilities have atrophied, or my su

by insin 2y ago

Either Google has shifted _so much_ focus to getting an LLM to tell you about very real Encanto 2 spoilers that its search capabilities have atrophied, or my surprise at there not already being a Tailwind plugin for this is justified: const plugin = require('tailwindcss/plugin') const aliasFlexboxAlignment = plugin(function({ addUtilities }) { addUtilities({ '.cross-axis-baseline': { 'align-items': 'baseline' }, '.cross-axis-center': { 'align-items': 'center' }, '.cross-axis-end': { 'align-items': 'flex-end' }, '.cross-axis-start': { 'align-items': 'flex-start' }, '.cross-axis-stretch': { 'align-items': 'stretch' }, '.main-axis-around': { 'justify-content': 'space-around' }, '.main-axis-between': { 'justify-content': 'space-between' }, '.main-axis-center': { 'justify-content': 'center' }, '.main-axis-end': { 'justify-content': 'flex-end' }, '.main-axis-evenly': { 'justify-content': 'space-evenly' }, '.main-axis-normal': { 'justify-content': 'normal' }, '.main-axis-start': { 'justify-content': 'flex-start' }, }) })

deleted 2y ago
[deleted]
cluckindan 2y ago
Tailwind sure is a blight upon frontend maintainability.
- 9dev 2y ago
  Is it, though? How much easier to refactor it in the future can it be, other than being able to search-replace Tailwind classes when the need arises to?
  - tracker1 2y ago
    ... except for where you aren't wanting to replace.
    - 9dev 2y ago
      Well, what is it then that is so complex about Tailwind? I’ve been hearing that for so long, but nobody was ever able to explain succinctly what Tailwind made so awfully complicated.
- gjsman-1000 2y ago
  I strongly disagree; any large project using CSS tended to have arcane names for everything and turned into a Tailwind of its own, but worse. I also like Tailwind because it’s so self-documenting. Even if Tailwind’s development were to stop, tomorrow, and all of the style sheets were lost globally, I would know what everything is meant to be.
  - cluckindan 2y ago
    There is no semantic connection between design and code.
    - gjsman-1000 2y ago
      I don’t even know what this means, but it sounds either stupid, or a theory that only works in a clean room laboratory.
      - cluckindan 2y ago
        Maybe you need to figure it out before jumping to conclusions like that. I think it’s much easier to understand what <input class=”input input--email input--valid”> is supposed to be compared to <input class=”bg-white focus:outline-none focus:shadow-outline border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal”>
        gjsman-1000 2y ago
        Bull. I have no clue at this glance what .input specifies, or what I can override without a conflict. Heck, .input might not even exist, resulting in only stock browser styles. The bottom one, I can fully picture while it isn’t much longer, the above is opaque and gives me no information at all about the look. Secondly though, and why this opinion is frankly stupid, is that I can just put this in my CSS code before it’s built through Vite: input { @apply bg-white focus:outline-none focus:shadow-outline border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal; } And then lo and behold, I’ll do you one better: <input type=“text”> </input> is now fully styled, with Tailwind only.

by insin 2y ago

deleted 2y ago

[deleted]

cluckindan 2y ago

Tailwind sure is a blight upon frontend maintainability.

9dev 2y ago
Is it, though? How much easier to refactor it in the future can it be, other than being able to search-replace Tailwind classes when the need arises to?
- tracker1 2y ago
  ... except for where you aren't wanting to replace.
  - 9dev 2y ago
    Well, what is it then that is so complex about Tailwind? I’ve been hearing that for so long, but nobody was ever able to explain succinctly what Tailwind made so awfully complicated.
gjsman-1000 2y ago
I strongly disagree; any large project using CSS tended to have arcane names for everything and turned into a Tailwind of its own, but worse. I also like Tailwind because it’s so self-documenting. Even if Tailwind’s development were to stop, tomorrow, and all of the style sheets were lost globally, I would know what everything is meant to be.
- cluckindan 2y ago
  There is no semantic connection between design and code.
  - gjsman-1000 2y ago
    I don’t even know what this means, but it sounds either stupid, or a theory that only works in a clean room laboratory.
    - cluckindan 2y ago
      Maybe you need to figure it out before jumping to conclusions like that. I think it’s much easier to understand what <input class=”input input--email input--valid”> is supposed to be compared to <input class=”bg-white focus:outline-none focus:shadow-outline border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal”>
      - gjsman-1000 2y ago
        Bull. I have no clue at this glance what .input specifies, or what I can override without a conflict. Heck, .input might not even exist, resulting in only stock browser styles. The bottom one, I can fully picture while it isn’t much longer, the above is opaque and gives me no information at all about the look. Secondly though, and why this opinion is frankly stupid, is that I can just put this in my CSS code before it’s built through Vite: input { @apply bg-white focus:outline-none focus:shadow-outline border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal; } And then lo and behold, I’ll do you one better: <input type=“text”> </input> is now fully styled, with Tailwind only.