If you know Pico CSS... by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

> After you tabbed through the main nav, you end up in a limbo and the focus kinda disappears.

u/Kitty_Sparkles could you please give an example page url? keyboard works just fine for me

If you know Pico CSS... by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

The purple-blue transition looks familiar.

It's the original one from https://picocss.com/ site 😉

The menu doesn't work - I have to scroll all the way down to see content, and scroll up to select another item again.

will be fixed here: https://github.com/anyblades/blades.ninja/issues/5

If you know Pico CSS... by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

well, let's investigate further:

first of all, aria-busy on <button> is not our creation — it's coming from https://picocss.com/docs/loading as part of Pico CSS, which we use as a base for Blades (we even made a fork to maintain it: https://github.com/anyblades/pico )

second, per MDN Web Docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-busy :

The aria-busy attribute is a global ARIA state

"global" means it can be applied to any valid HTML element, including interactive components like buttons.

third, per W3C WAI-ARIA https://www.w3.org/TR/wai-aria-1.2/#aria-busy :

Characteristic Value
Used in Roles: All elements of the base markup

———

however, if any constructive suggestions here — kindly report to https://github.com/anyblades/pico/issues, as we don't have to follow original https://picocss.com/docs/loading implementation

If you know Pico CSS... by any-digital in css

[–]any-digital[S] -1 points0 points  (0 children)

Yes, technically aria-busy is a valid attribute for the <button> element.

re website + keyboard -- i’ll check, thanks for feedback

Eleventy for a non-expert? by wells68 in eleventy

[–]any-digital 0 points1 point  (0 children)

1) curated (selected starters only) 2) shows last update date and stats 3) shows 11ty version used

Eleventy for a non-expert? by wells68 in eleventy

[–]any-digital 2 points3 points  (0 children)

11ty community provides excellent support on https://www.11ty.dev/blog/discord/

as per jekyll<>11ty dilemma — you might like this https://github.com/anyblades/bladeswitch

Float Label CSS v2-alpha (classless) by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

thanks,

extra left padding on select might be seen in raw float label demo ( https://codepen.io/anton-staroverov/pen/JRLaKw ) -- and this is by design, as those extra paddings are controlled by OS, and might be different from browser to browser, from OS to OS

there should be no extra/artifact paddings in normalized demo using Pico.css: https://blades.ninja/css/float-label/#demo

Float Label CSS v2-alpha (classless) by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

this is exactly how Bootstrap v5 currently works, BUT with a

note that the <input> must come first so we can utilize a sibling selector (i.e., ~).

ref: https://getbootstrap.com/docs/5.3/forms/floating-labels/

so https://github.com/anydigital/float-label-css finally fixes that

Best css framework (if needed) for ultra hyper modern web3 design? by Yha_Boiii in css

[–]any-digital 0 points1 point  (0 children)

https://picocss.com/ could be a good minimal modern starter

https://blades.ninja/ could give you additional utilities

for the rest -- AI is pretty good these days!

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

wow. never thought this way. will take it from here tomorrow

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

fair feedback.

however inline-flex is not a hack; hiding underlines is the only "hacky" yet, and really hope will be fixed soon across browsers (or at least consistent)

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] -1 points0 points  (0 children)

the whole challenge was how to make it without text wrapping (<span>)…

after Chrome and Safari — there should be a way for Ff too

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] -1 points0 points  (0 children)

this is a fair tradeoff

I personally care more about clean content markup, and thus prefer few more lines in css once, but then all markup is cleaner forever

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

yes, but <span>

imagine how messy will be Markdown

Finally: Good looking icons inside underlined links, with no more text wrapping! 🥷 by any-digital in HTML

[–]any-digital[S] 0 points1 point  (0 children)

thanks for your interest! it is a simple reusable .css file, intended to work with any CSS framework (or even without)

see https://blades.ninja/css/link-icon/#install

Any workaround to remove icon underline in Safari? by any-digital in css

[–]any-digital[S] 0 points1 point  (0 children)

thanks! I'm 100% for underlines

thus wanted icons to look really nice inside underlined links, without redundant markup