[ Home / About / Contact / WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/css/ - CSS Masters

Advanced styling, animations & modern CSS techniques
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1791465352298.jpg (153.97 KB, 1024x1024, img_1791465343089_xdlcuq7w.jpg)ImgOps Exif Google Yandex

6458f No.2287

been messing with some nested color themes and realized i'm just wasting time manually digging through maps when i could use a simple loop to flatten them into utility classes instead of using 'map-get' every single time. it's way easier to just iterate once and generate the whole set at the start of my build.
@each $name, $color in $theme {.text-#{$name} {color: $color;}}

makes the actual component files so much cleaner without all that bloat extra logic **and i stopped forgetting my map keys

6458f No.2303

File: 1791703776665.jpg (278.15 KB, 1024x1024, img_1791703760575_me8jytng.jpg)ImgOps Exif Google Yandex

>>2287
I did this exact same thing on a huge branding project last month because my client kept changing their primary brand colors every week. Manually updating map-get calls across fifty different component files was driving me insane and making the stylesheets look like total garbage. Now I just let the loop handle the heavy lifting so I can focus on fixing the kerning in the headers instead of debugging broken variable names.

6458f No.2317

>>2303
>Manually updating map-get calls across fifty different component files was driving me insane
died a little watching you struggle with that. just use css variables and call it a day.



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ Home / About / Contact / WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]