5 ms·

My favorite "no JS, we have CSS" stuff are side bar (drawer) and carousel. DaisyUI (a TailwindCSS components library) has components readily available too :) 1

My favorite "no JS, we have CSS" stuff are side bar (drawer) and carousel. DaisyUI (a TailwindCSS components library) has components readily available too :) 1. https://daisyui.com/components/drawer/ https://daisyui.com/components/drawer/ 2. https://daisyui.com/components/carousel/ https://daisyui.com/components/carousel/

egeozcan 3y ago
How do you announce the drawer to the screen readers? For the people down voting: Drawers and other content that appear on the page needs to be announced and needs to have a state aria-expanded next to the controlledby. This is still a genuine question. Maybe there is a way, or maybe developers collectively think that's not important (our auditors would disagree but, anyway).
- withinboredom 3y ago
  I believe it is announced as soon as you add it to the DOM and make it visible. I don’t have a computer near me to test it, but that’s what I remember when testing this stuff out a few years ago.
  - dawnerd 3y ago
    I’ve had to add a bunch of js to support this in the past when accessibility reports come back saying there’s no announce, mainly around css only dropdown navs.
    - withinboredom 3y ago
      Do you remember which reader software it was?
      - egeozcan 3y ago
        I'm not the person you're replying to but we test with NVDA, and we did have problems with some CSS-only solutions.
      - dawnerd 3y ago
        I don’t, it was a while ago and we just use js now for that sorta stuff even if it’s only for toggling aria attributes.
- simonw 3y ago
  Every single time I go looking for JavaScript components like this I find myself asking the same question. I really wish component providers would start explicitly documenting this. My dream is to find a component library where each component is accompanied by videos showing how each thing behaves in different accessibility tools.
continuational 3y ago
I'm always initially excited about these frameworks, but like all other frameworks I've tested, DaisyUI has a number of issues in iOS Safari and other browsers. It's as if authors of these frameworks severely underestimate the amount of testing required to make these things actually work across browsers. Once you have that many (themeable, no less!) components, all bets are off you'll still able to fix it without breaking existing themes and applications.
- tln 3y ago
  What framework is the best in your testing?
  - recursivegirth 3y ago
    Not OP, but which framework is the best is a very subjective question. Frameworks in general make what you want to do easier to do, at least from a developer experience perspective. Generally this meets the mark for most use-cases, but has proven to be a problem (especially in ORMs) if you want to go outside of the box. They seek to abstract complex or cumbersome logic into more consumable APIs, and in most cases this ends up being a footgun. Point I am trying to make is: learn all the nitty gritty about CSS (specificity, box layout, selectors, etc...) and really understand how the base language works. Then go play with frameworks, figure out which ones fixes the parts you don't like, and makes the parts you do like better.
  - continuational 3y ago
    Usually these frameworks don't survive a "try to click on each element in their official demo" test in iOS Safari without glaring, visual issues, so I don't see much reason to rank them.
- arcanemachiner 3y ago
  Was this recent? I'm not 100% on the version numbers and dates, but I believe iOS support got better on daisyUI v3 within the last year or so. I remember that dropdowns work a lot better now. Do you remember which components you had issues with?
yetanother12345 3y ago
> link: components/carousel/ >> "Snap to " [start|center|end] This is new to me: What on earth is "snap" and how is it done? My screen certainly does not react to finger clicks. (Btw, I don't think that unknown methods for interaction is an especially good recommendation of an user interface element library)

egeozcan 3y ago

How do you announce the drawer to the screen readers? For the people down voting: Drawers and other content that appear on the page needs to be announced and needs to have a state aria-expanded next to the controlledby. This is still a genuine question. Maybe there is a way, or maybe developers collectively think that's not important (our auditors would disagree but, anyway).

withinboredom 3y ago
I believe it is announced as soon as you add it to the DOM and make it visible. I don’t have a computer near me to test it, but that’s what I remember when testing this stuff out a few years ago.
- dawnerd 3y ago
  I’ve had to add a bunch of js to support this in the past when accessibility reports come back saying there’s no announce, mainly around css only dropdown navs.
  - withinboredom 3y ago
    Do you remember which reader software it was?
    - egeozcan 3y ago
      I'm not the person you're replying to but we test with NVDA, and we did have problems with some CSS-only solutions.
    - dawnerd 3y ago
      I don’t, it was a while ago and we just use js now for that sorta stuff even if it’s only for toggling aria attributes.
simonw 3y ago
Every single time I go looking for JavaScript components like this I find myself asking the same question. I really wish component providers would start explicitly documenting this. My dream is to find a component library where each component is accompanied by videos showing how each thing behaves in different accessibility tools.

continuational 3y ago

I'm always initially excited about these frameworks, but like all other frameworks I've tested, DaisyUI has a number of issues in iOS Safari and other browsers. It's as if authors of these frameworks severely underestimate the amount of testing required to make these things actually work across browsers. Once you have that many (themeable, no less!) components, all bets are off you'll still able to fix it without breaking existing themes and applications.

tln 3y ago
What framework is the best in your testing?
- recursivegirth 3y ago
  Not OP, but which framework is the best is a very subjective question. Frameworks in general make what you want to do easier to do, at least from a developer experience perspective. Generally this meets the mark for most use-cases, but has proven to be a problem (especially in ORMs) if you want to go outside of the box. They seek to abstract complex or cumbersome logic into more consumable APIs, and in most cases this ends up being a footgun. Point I am trying to make is: learn all the nitty gritty about CSS (specificity, box layout, selectors, etc...) and really understand how the base language works. Then go play with frameworks, figure out which ones fixes the parts you don't like, and makes the parts you do like better.
- continuational 3y ago
  Usually these frameworks don't survive a "try to click on each element in their official demo" test in iOS Safari without glaring, visual issues, so I don't see much reason to rank them.
arcanemachiner 3y ago
Was this recent? I'm not 100% on the version numbers and dates, but I believe iOS support got better on daisyUI v3 within the last year or so. I remember that dropdowns work a lot better now. Do you remember which components you had issues with?

yetanother12345 3y ago

> link: components/carousel/ >> "Snap to " [start|center|end] This is new to me: What on earth is "snap" and how is it done? My screen certainly does not react to finger clicks. (Btw, I don't think that unknown methods for interaction is an especially good recommendation of an user interface element library)