@cirrus@mstdn.social
@cirrus@mstdn.social avatar

cirrus

@cirrus@mstdn.social

#DesignSystems aficionado. Classically trained #webmaster. Slayer of pixels. DTCG spec editor.

This profile is from a federated server and may be incomplete. Browse more on the original instance.

aral, to SmallWeb
@aral@mastodon.ar.al avatar

So given it’s Saturday night, I thought I’d have a little fun with Kitten and make a tiny collaborative drawing toy.

You have a 20×20 grid and only black and white to draw with and everyone shares the same canvas.

https://draw-together.small-web.org

Have fun + looking forward to seeing what we all, umm, draw together.

:kitten:💕

PS. It took about 60 lines of code.

View source: https://codeberg.org/aral/draw-together

#Kitten #SmallWeb #DrawTogether #toy #game #web #dev

cirrus,
@cirrus@mstdn.social avatar

@DrVeronikaCH @aral Hah! So you must have been one of the collaborators to make this... 🙌

cirrus, to Samsung
@cirrus@mstdn.social avatar

For a laugh, I decided to compare my current smartphone with the very first #smartphone I ever owned 20 years ago...

https://cirrus.twiddles.com/blog/2024/03/06/nokia-6600-vs-samsung-s24-ultra/

#nokia #samsung #tech #gadgets

Edent, to random
@Edent@mastodon.social avatar
cirrus,
@cirrus@mstdn.social avatar

@Edent if you know, you know 😄

davidbisset, to CSS
@davidbisset@phpc.social avatar

#CSS has an infinity constant.

Playing with Infinity in CSS: https://codersblock.com/blog/playing-with-infinity-in-css/

#frontend

cirrus,
@cirrus@mstdn.social avatar

@davidbisset TIL z-index: calc(infinity); is a thing!

davatron5000, to random
@davatron5000@mastodon.social avatar

📝 It's often said, "UI is a function of state" and I pulled on that thread and listed every possible piece of state that can impact the UI that I could think of.

https://daverupert.com/2024/02/ui-states/

cirrus,
@cirrus@mstdn.social avatar

@davatron5000 This! So much this!

cirrus, to random
@cirrus@mstdn.social avatar

$ sudo dry hair

JoshHarwood, to random

Finally hit the designsystems.media backlog, sitting at 538 videos now. Let me know if there are any other videos to include 🤙

#designsystems

cirrus,
@cirrus@mstdn.social avatar

@JoshHarwood Wow! Very cool resource!

Quite chuffed to see one with me is on there too. 🙏

If you're interested, there are videos of other talks I've (co-)presented about design system things

cirrus,
@cirrus@mstdn.social avatar

@JoshHarwood
Intro to DTCG format: https://youtu.be/ssOdzxZdg58?si=msPfuR_jTdDXWZM6
Future of Design Tokens: https://youtu.be/Ots630OxRwE?si=eNNu3_WBSNMcxuDY
Design Tokens Panel: https://youtu.be/b0UK-j9YXxE?si=lzRWuwAyshgiGjSp
WTF is Atomic Design: https://vimeo.com/157213875

cirrus, to random
@cirrus@mstdn.social avatar

Current status:
git commit -m "make CI pipeline work... maybe? hopefully? for real this time, honest guv"
git push
🤞

cirrus,
@cirrus@mstdn.social avatar

dons ceremonial robe
steps into middle of flaming pentagram
scatters small animal bones on floor
chants sacred YAML incantations

...

git commit -m "fix pipeline issue"
git push

cirrus,
@cirrus@mstdn.social avatar

sacrifices firstborn on altar of the DevOps gods

...

git commit -m "FFS! Work already"
git push

cirrus,
@cirrus@mstdn.social avatar

@johnny_reilly git reset --soft HEAD~37472 && git commit -m "setup flawless CI pipeline in one go. Bow before me, for I am the DevOps master!"

vasilis, to random
@vasilis@social.vasilis.nl avatar

This week I'm going to give a presentation at my kid’s high school about my job. The idea is to inspire them so that they might choose a career similar to what I do. Let’s say my job is "making things with web technology."
Now my question to you is: why are you (still) excited about making stuff with web technology? (RT is appreciated)

cirrus,
@cirrus@mstdn.social avatar

@vasilis The longevity of it. A site built decades ago will still work in modern browsers. As long as I keep the server running, I'm willing to bet that a site I build today will still work decades from now.

I don't think the same is true of any other platform. Do you think all the iOS and Android apps of today will still work years from now? I doubt it.

cirrus,
@cirrus@mstdn.social avatar

@vasilis Fair play. Not going to argue with that. :-)

But, as far as digital media goes, I still think the web's more robust than others.

cirrus, to Figma
@cirrus@mstdn.social avatar

Once again facing that classic conundrum: Theme and/or customize a 3rd party component library, or build one from scratch.

Actually, we need two component libs: A one for web products and a one for iOS & Android apps. We already have designs in and want to have parity in terms of design & naming across Figma, web & RN.

My gut and past experiences make me lean towards building from scratch.

What would you do and why?

cirrus,
@cirrus@mstdn.social avatar

@cliftonlabrum I wasn't aware of Expo. Looks interesting, but not sure it would work for us.

We have many existing websites/-apps built with a variety of frameworks. My aim is therefore to produce UI components that they can all consume at their own pace, to gradually migrate their UI code. Hence why web components was chosen.

I presume (maybe incorrectly?) that a library of Expo components would not be consumable in non-Expo apps. Right?

cirrus,
@cirrus@mstdn.social avatar

@texcut Interesting. Maybe I should give MUI another look. I've worked with an old version (v4) of their React lib in the past, but I guess a lot has changed since then.

Good shout on using their Figma lib too, though. I do believe if you're going to use a 3rd party lib, you should go all in. Trying to bend them to designs that were made independently can be the source of much pain IMHO

jensimmons, to random
@jensimmons@front-end.social avatar

Interop 2024 is here!!

https://webkit.org/blog/14955/the-web-just-gets-better-with-interop/

cirrus,
@cirrus@mstdn.social avatar

@jensimmons 👏👏👏Awesome! Big thanks for all the hard work of everyone involved!

cirrus, to random
@cirrus@mstdn.social avatar

Quite pleased with the #DesignToken pipeline I've just cobbled together:

Figma vars ➡️ Tokens Brücke ➡️ DTCG file in a git repo ➡️ Cobalt UI (configured to output CSS vars) ➡️ PostCSS (with CSSNano) ➡️ CSS file

The hard part was that our source Figma lib has multiple modes AND I wanted the final output to only include semantic tier tokens (so all the brand-specific color ramps and whatnot are just internal implementation details of our theme). Had to make a custom Cobalt plugin for that.

cirrus, to Figma
@cirrus@mstdn.social avatar

Current status: Trying to figure out how best to convert #Figma vars with multiple modes into #CSS custom properties.

#DesignTokens can be tough.

mia, to CSS
@mia@front-end.social avatar

Sometimes I build a custom element, and then I have second thoughts about it.

Do I really need:
<color-tile>teal</color-tile>

When CSS allows:
<code style="--tile:hotpink">hotpink</code>

I wish I could have the cleaner markup, without the JS dependency. Or split the difference, if we had the full attr() function:

<code color-tile="hotpink">hotpink</code>

What do you think?

https://www.miriamsuzanne.com/2024/01/24/el-2-ways/

cirrus,
@cirrus@mstdn.social avatar

@mia +1 for full attr() support. That would enable so many nice things.

samstokes, to random

"We don't recognize this device, we've texted you a code". Am I the only one who sees this every damn time I log into every website? I check the "remember this device" box every time.

Is it because I use Firefox and some privacy feature is defeating the "device remembering"? Did I get put on some kind of watchlist for not accepting enough cookies?

cirrus,
@cirrus@mstdn.social avatar

@samstokes I get the same. 😞 And, I'm also using Firefox and susepct it might be due to its stricter handling of cookies.

cirrus, to Discount
@cirrus@mstdn.social avatar

A tad random, but maybe this'll help someone here. I got a 10% code for gadgets bought from 's store. It can be used ten times, so first come first serve: https://i.soreto.com/samsunguk/f/N1euRLbY1l

Enjoy!

(full disclosure: I'll get a 10% discount myself if someone buys something via the link above)

cirrus, to random
@cirrus@mstdn.social avatar

Starting a new job as Engineer at Investec today. 🚀

Sloshed some coffee on my sleeve twice already and haven't even made it to the office yet. Off to a good start then... 😜

cirrus,
@cirrus@mstdn.social avatar

@hugovk Thanks so much! 🙏

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • JUstTest
  • ngwrru68w68
  • everett
  • InstantRegret
  • magazineikmin
  • thenastyranch
  • rosin
  • Durango
  • ethstaker
  • Youngstown
  • slotface
  • khanakhh
  • kavyap
  • DreamBathrooms
  • Leos
  • osvaldo12
  • tacticalgear
  • cubers
  • cisconetworking
  • anitta
  • provamag3
  • modclub
  • mdbf
  • GTA5RPClips
  • tester
  • megavids
  • normalnudes
  • lostlight
  • All magazines
    •