@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.

cirrus, to random
@cirrus@mstdn.social avatar

Spent this afternoon wrangling NPM dependencies in our 's monorepo. Managed to nuke a few and also eliminate all the vulnerable package versions being reported by npm audit.

I am so ready for the weekend!

cirrus, to random
@cirrus@mstdn.social avatar

Just prepping a few props for a demo I'm doing at work tomorrow. ๐Ÿ˜…

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

I think Angular users may even be worse than React users, on the whole, for using the wrong markup for stuff. Looking at a page with background images on <div>s instead of, well, images and a form made out of <li> and <a> elements with button roles instead of checkboxes and radios. Oh and not even in a <form> element, just a <div>.

cirrus,
@cirrus@mstdn.social avatar

@heydon Yup. ...and don't even get me started on the faux web-component elements and weird ng* attributes that Angular spews out into the DOM as well.

slightlyoff, to random
@slightlyoff@toot.cafe avatar

MSFT words I have to unpack in every meeting:

  • "ask" == "request"
  • "inbox" == "include"
  • "double click" == "discuss in detail"
  • "learnings" == "lessons"
  • "delighter" == "feature" (apologies to Kano)
cirrus,
@cirrus@mstdn.social avatar

@dletorey @slightlyoff @zachleat I think there are some valuable learnings here that we should socialize with the team at the next town hall.

cirrus, to javascript
@cirrus@mstdn.social avatar

Grumble. is doing my head in. Why do Angular packages create a new package.json in the dist folder and expect you to cd into there before running npm publish?!?!

I have a monorepo with lots of other non-Angular packages. I use Changesets to manage versioning and releases.

Now, because Angular can't just use npm like it's meant to be used, I'm stuck.

cirrus,
@cirrus@mstdn.social avatar

@shaknais Unfortunately, I don't think that'll help in my case.

mikemai2awesome, to CSS
@mikemai2awesome@mastodon.social avatar

This is the way.

@ media (hover: hover)  
 a:hover { ... }  
}

cirrus,
@cirrus@mstdn.social avatar

@mikemai2awesome I'm curious why that is. Does this avoid a first tap activating a faux hover state on touch devices or something like that?

cirrus,
@cirrus@mstdn.social avatar

@mikemai2awesome Got it, thanks.

This is the way.

cirrus, to typescript
@cirrus@mstdn.social avatar

Been going down a rabbit hole today trying to get #Lit, #TypeScript, #CustomElement manifests and #Storybook to all hold hands and sing kumbaya.

Send help.

How's your day going?

cirrus, to javascript
@cirrus@mstdn.social avatar

Every day is #JS Naked Day on my site: https://cirrus.twiddles.com/ ๐Ÿ˜œ

More info: https://js-naked-day.org/

mattwilcox, to random
@mattwilcox@mstdn.social avatar

Genuine question, because I'm starting to second guess myself.

Sites like this: https://buttermax.net/

I can't use them, and I ... I'm not sure why. I have no idea what the site was about, I literally (somehow) did not realise you could scroll the page so missed a ton of content. My eyes bounce around and I can't focus on anything to read it.

Is it just me?

cirrus,
@cirrus@mstdn.social avatar

@mattwilcox I'd say that's just poor usability. Yes, it's eye-catching but they've way overindexed on that. Classic form over function IMHO.

Took me a while to realise what their business actually is.

To be fair, a memorable first impression is probably what they're going for. But the trouble is that kinda thing gets old real fast. Even if you go "wow" the first time, when you come back for the 2nd, 3rd, nth time to just look something up, the fluff just gets in the way and slows you down.

cirrus, to webdev
@cirrus@mstdn.social avatar

Went down a rabbit hole today trying to share some CSS between a document (i.e. "light DOM") and the shadow DOMs of some custom elements (aka ).

This article by Eisenberg Effect was super useful: https://eisenbergeffect.medium.com/

I ended up building something along similar lines, but customised for my specific needs. Needs a bit of polish, but it works.

It really shouldn't be that hard to do though. Really hope a native way to do this ends up in the platform someday.

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

If you had Philipโ€™s hue and were going to watch Alien with your teenage youngling this evening what colour would you set the lights?

Dark green, right?

cirrus,
@cirrus@mstdn.social avatar

@sturobson Maybe turn the lights off completely?

cirrus, to random
@cirrus@mstdn.social avatar

I know it's been done a million times (incl. a few by my past self), but it still feels like magic when demoing a pipeline.

In our case, the demo was:

  • Static HTML, React & Angular web apps are all open in browser windows, displaying some of p
    our components
  • An Android emulator running a React Native app, also using DS components, is open too.
  • I open a Figma library, edit the color of a variable
    ...
cirrus,
@cirrus@mstdn.social avatar

...

  • I use the Tokens Brรผcke Figma plugin to save out the variables as a DTCG file in our 's git repo
  • I run an npm command to rebuild our themes from the updated DTCG file
  • Seconds later all browser windows and the Android app auto-refresh and the color of the buttons has changed ๐Ÿค˜
cirrus, to random
@cirrus@mstdn.social avatar

Current status:

cirrus,
@cirrus@mstdn.social avatar

@sturobson Yeah, I should've said "Permanent status:"

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

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 I ever owned 20 years ago...

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

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

has an infinity constant.

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

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

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.

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