@vasilis Very dark indeed

@midknight Here's a little demo for you. Is this what you had in mind?

https://codepen.io/enbee81/pen/xbVrePV?editors=1100

@midknight I guess I’d add a breaks container right before the stages. And it should span all stages slots. But then you’d need to pull the breaks out of the clear markup so maybe give it aria hidden and leave them in the stages but hide them there visually. I’ll see if I can fix up a demo.

@pixelambacht 😜
Still love these colors.
Though I hate that nowadays they seem to be the only colors anyone uses on the web.

Build a multi-stage timetable for a conference — fully in modern CSS.
Each hour grows automatically to fit all sessions.

🍾 heavy use of subgrid.
🍾 round() and mod() to place sessions accurately
🍾 scroll-driven animations for sticky stage headings

If you want the full breakdown of how this is done, here’s the write-up 👇

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

There was a time when anyone could be an artist 👨‍🎨 — if they loved the work enough.
Then came the professionals.
Then came the camera.

Today, it’s not paint that’s being replaced. It’s code.

https://9elements.com/blog/when-skill-became-obsolete-art-code-and-the-end-of-the-amateur/

@joshtumath @heydon first batch had to be black so that @heydon could wear it. 🌚

This year it’s pink and petrol.

@kizu Lovely photos – thanks so much! 😊
Would it be okay if I use the one with me in it for a post about the event?

@shadeed9 Thanks Ahmad 😊

@kizu I’ve just updated the original post to include the solution you provided, along with an explanation of how it works.

Big thanks to @kizu for suggesting another technique to adjust logo sizes in a logo strip. I've updated my blog post to include his clever suggestion.

https://9elements.com/blog/building-the-perfect-logo-strip/

@kizu I hope I'll have some time tomorrow so I can include this in the original post!

@kizu Yes, you're absolutely right.

I would like to make one final adjustment. I will reintroduce a "magic number," but this time it is called ---strength, and you can adjust the effect to your liking. When set to 1, you get the result you had in your pen; when set to 0, all icons have the same height. This way, I think it becomes a more flexible component rather than relying on a fixed magic number:

https://codepen.io/enbee81/pen/gOVOZyR

@kizu Wow, love the idea. I will definitely have another look at this. In this example, all logos apart from the owl have the same height (48px). I think it gets a lot more difficult when this is not the case (which I guess happens a lot in real life).

Here's a little preview of the final result.

Displaying a row of logos can be tricky due to their varying shapes and sizes. In my latest post, I share how I approach building the perfect logo strip by adjusting logo heights based on aspect ratios.

https://9elements.com/blog/building-the-perfect-logo-strip/

@argyleink i always thought “Mixins are really clever and you can probably do a lot of stuff with it that makes your life easier” and then I ended up never using them. Can’t really say why.

@eleventy no worries. Fun thing. After I wrote this here I thought “maybe shifting all the image transformation to a transform would be a good idea” once I had a rough prof of concept running I got back to the docs and found the transform method right there. Works perfect in my situation. 🎉

@eleventy I'm struggling with the async shortcode issue when using the image plugin. The asyncEach and ifAsync Nunjucks syntax works, but breaks every code formatter I've tried. 😞

My current solution, using statsSync, kind of works but will soon be deprecated.

Moving the entire project to webC doesn't seem feasible for me.

The docs mention I can use <eleventyImage> with the Render Plugin. Is there an example of how this would look?

@scottjehl @micahrl very clever. I’d love to use the tool you described. Right know I’m using a script that simply converts all black values to currentColor. That gives me at least the option to style mono colored icons.