Building a Multi-Stage Timetable With Modern CSS Using Grid, Subgrid, “round()”, and “mod()”, by @nilsbinder:

https://9elements.com/blog/building-a-multi-stage-timetable-with-modern-css-using-grid-subgrid-round-and-mod/

#css #grids #layout #functions

Building a multi stage timetable with modern CSS using grid, subgrid, round(), and mod(). - 9elements

Combining finest craftsmanship with elegant design to ship innovative digital experiences.

9elements
light-dark() isn't always the same as prefers-color-scheme

`light-dark()` and `prefers-color-scheme` treat the defined `color-scheme` values differently.

The New “clamp()” Function in PHP 8.6, by @amitmerchant.bsky.social:

https://www.amitmerchant.com/the-clamp-function-in-php-86/

#php #functions

The new clamp() function in PHP 8.6

You know how sometimes you want to ensure that a value stays within a specific range? Maybe you’re working with user input, configuration values, or any scenario where you need to enforce boundaries.

Amit Merchant

Creating Scroll-Based Animations in Full view(), by @preethisam.bsky.social (@csstricks):

https://css-tricks.com/creating-scroll-based-animations-in-full-view/

#css #animations #scrolling #functions

Creating Scroll-Based Animations in Full view() | CSS-Tricks

It’s not that hard to do! Preethi shows you how it's really the same old animation you’re used to writing in CSS, only applied on a view timeline instead of a normal timeline.

CSS-Tricks
How to test a Vue composable with TypeScript

With this quick Promise-based utility, it's easy to write type-safe unit tests for Vue composables.

JohnFraney.ca

Just three new bash #functions I don't know why I didn't write months/years ago ;)

function binfind { #search for patterns in the system bin directories local d oIFS="$IFS" IFS=: for d in $PATH; do ls -1 $d/$@ 2>&- done IFS="$oIFS" } function tootlookup { #Show a fediverse thread when given a url url="$*" [[ $url == http* ]] || ( warn "please specify URL"; return 1 ); toot --no-color thread $(toot --no-color search "$url" |awk '$1=="*" {print $2}' |head -1) } function colors { #uses ImageMagick identify to print the number of colors in a specified image local oIFS="$IFS" output maxlen=0 IFS=$'\n' for f in $@; do (( ${#f} >> maxlen )) && maxlen=${#f} done ((maxlen+=4)) for f in $@; do printf "%-${maxlen}s " $f output=$(identify -verbose $f |& grep Colors: |sed 's/^ *Colors: //') [[ -n $output ]] || output="(unknown)" echo $output done IFS="$oIFS" }

#Unix #shell #ShellScripting

Introduction to CSS “if” Statements and Conditional Logic, by @markodenic.com:

https://markodenic.com/introduction-to-css-if-statements-and-conditional-logic/

#introductions #css #functions #conditionals

Introduction to CSS if Statements and Conditional Logic

Conditional logic is a familiar concept to anyone who has written a programming language. Languages like JavaScript or Python use if/else statements to evaluate expressions and execute different blocks of code depending on whether the condition is true or false.

Introduction to CSS if Statements and Conditional Logic
@jasongorman yes but please do extensive #usecase #functions #buttons #feature #testing for everything longer than 10 lines :-p
More CSS random() Learning Through Experiments – Frontend Masters Blog

There is quite a bit of interesting design possibility with `random()` coming to CSS. It pairs nicely with animation, particularly animation-composition for agumenting those generated values.