Daily Shaarli

All links of one day in a single page.

November 13, 2021

CSS { In Real Life } | Finding an Element’s Nearest Relative Positioned Ancestor

In the console: $0.offsetParent$0 is the currently set element.

Then we can use the offsetParent object property to find the closest ancestor to that element that has its position set to something other than static.

CSS { In Real Life } | Why I Don’t Have Time For Your Coding Challenge

I share this point of view

Can anybody explain to me, why ublockorigin works so much better than pihole does? : uBlockOrigin

uBlockOrigin has more power than pihole that only blocks network requests. A comment explains some points about it.

CSS { In Real Life } | Accessibly Hiding Focus Outlines

Solutions:

  1. styling it manually through CSS :

    input:focus {
    outline: 2px solid deeppink;
    }
  2. A keyup tab event listener. Think about adding the class through JS, that way the focus will still be accessible if JS fails to load.

  3. the property ::focus-visible

Simplifying Form Styles With accent-color — Smashing Magazine

The background color of checkboxes will be the one determined by accent-color. Nice !

And the surrounding stays accessible whatever this color is as the webbrowsers have their own implementation of this.

The Lotus Blossom method: ideation on steroids | by Phil Delalande | UX Collective

A great introduction to the lotus blossom.
I use it to get some ideas for the User-centered design methods class