Ana Rodrigues

@anarodrigues@front-end.social
1.6K Followers
479 Following
712 Posts

Previously ohhelloana@mastodon.social

Eight hours of sleep on the rare occasion, 8 hours working as an unprofessional front-end developer, then on my other 8 hours, I poke my blog, take photos of my cat & try my best. Keen on #IndieWeb, #CSS, #sustainability, #plants, #crafts, #privacy, #DIY, #dreams & more.
she/her

LocationLondon, UK
Bloghttps://ohhelloana.blog
Githubhttps://github.com/ohhelloana
Ana Rodrigues4h ago

Hello friends with a personal website (and friends who want one)! 🩵

Tomorrow I will be co-hosting Homebrew Website (London timezone).

Join us online! Everyone from any timezone is welcome.

Check what we’re about:
https://events.indieweb.org/2025/06/homebrew-website-club-europe-london-BGblmFAv1LQU

Homebrew Website Club Europe/London

Ana Rodrigues11h ago
Bramus4d ago

Psst, the slides of my Middlesbrough Front End talk are up on my blog!

> This talk explores the wild side of View Transitions. We’ll combine them with Scroll-Driven Animations, trigger them automatically with MutationObserver, and even resurrect classic Internet Explorer’s Page Transitions.

https://www.bram.us/2025/06/19/cranking-view-transtions-up-to-11-safely-maybe-2025-06-12-middlesbrough-front-end/

#MFE25

Cranking View Transtions up to 11 (Safely, Maybe) (2025.06.12 – Middlesbrough Front End)

At Middlesbrough Front End 2025 I gave a talk about some of the more exotic applications of View Transitions

Bram.us
Ana Rodrigues1d ago
thewinduppirate1d ago
Anyone in the #UK have experience of setting up a #RepairCafe ? There isn't one in my local town and I'm investigating setting one up. Especially with the #endof10 looming for #windows10 , I figure my experience with #linux and fixing stuff could be useful to others.
Ana Rodrigues4d ago
paulcuth4d ago
Turns out I have the most unread emails of everyone at #pixelpioneers… by 2 orders of magnitude 😬😳
Ana Rodrigues4d ago
Frills4d ago
An absolute joy to watch @anarodrigues talk. Lots of take aways! And fab to have lunch with a real life indie web pal
Ana Rodrigues4d ago
Thank you so much #PixelPioneers for listening to me! I will share my talk on my blog soon 🤗
Ana Rodrigues4d ago
Edward Loveall5d ago

I’m delighted to announce that Hotline Webring has reopened! We were never really “closed” but we weren’t accepting new sites for about a year.

Come join a surprisingly large webring—over 600 sites.

https://hotlinewebring.club/

Hotline Webring

A friendly ring of cool websites. Join today!

Ana Rodrigues6d ago
stux⚡6d ago
Hehe
Ana Rodrigues6d ago
Patrick BrossetJun 5

The ability to style grid and flex gaps is coming fast in a browser near you!
Bubbling with ideas for what this will be useful for!

Code: https://github.com/MicrosoftEdge/Demos/tree/main/css-gap-decorations

Ana Rodrigues6d ago
*+ Melon x Loom +*6d ago

Helooo for anyone in the London area next month - I'll be hosting a ZINE WORKSHOP with @klb where u will be forced to make zines whether you like it or not  (there will be snacks)

https://thephotographersgallery.org.uk/whats-on/zine-workshop-what-internet-made

Zine Workshop: What is the internet made of?

Create a take-away pu

The Photographers Gallery
×
Patrick BrossetJun 5

The ability to style grid and flex gaps is coming fast in a browser near you!
Bubbling with ideas for what this will be useful for!

Code: https://github.com/MicrosoftEdge/Demos/tree/main/css-gap-decorations

Show threadSara Joy Jun 5
@patrickbrosset yesssssss
Show threadChristopher Kirk-NielsenJun 5
@patrickbrosset This rules! (sorry)
Show threadwakest ⁂Jun 5
@patrickbrosset oh fuck that's gonna be amazing
Show threadhirsebirseJun 5

@patrickbrosset Looks like https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_multicol_layout/Styling_columns But: Yeah!

I'm looking forward to explaining it to our design team. 🙂

Styling columns - CSS: Cascading Style Sheets | MDN

As column boxes created inside multi-column (multicol) containers are anonymous boxes, styling individual columns is not possible, but we can style the gaps between the columns and the container in general. This guide explains how to change the gap and style rules between columns.

MDN Web Docs
Show threadPatrick BrossetJun 5
@hirsebirse yes, this is based on the column-rule property for multicol layouts. But now, it will work with flex and grid too, as well as in the row direction.
Show threadOlliewJun 8
@patrickbrosset love this. Do you know if there will be a @sheet prototype anytime soon?
Show threadPatrick BrossetJun 9
@Olliew @aluhrs will know.
Show threadAndy LuhrsJun 10
@patrickbrosset @Olliew it’ll still be a bit. Current focus is working through the initial standards for LRLR (https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/LocalReferenceLinkRel/explainer.md) which would allow using a stylesheet from light DOM in shadow DOM. Assuming that goes well, we’ll do @sheet after.
MSEdgeExplainers/LocalReferenceLinkRel/explainer.md at main · MicrosoftEdge/MSEdgeExplainers

Home for explainer documents originated by the Microsoft Edge team - MicrosoftEdge/MSEdgeExplainers

GitHub
Show threadOlliewJun 10
@aluhrs @patrickbrosset imo @sheet has other use cases outside of shadow DOM, but I’m glad it’s on the roadmap. Thanks for the update.
Show threadAndy LuhrsJun 10
@Olliew @patrickbrosset yeah definitely, our driving motivation right now is around shadow DOM though, so that’s our focus.
Show threadOlliewJun 11

@patrickbrosset Where is the best place to give feedback for early features like this? Combining it with flex-wrap: balance; seems slightly buggy.

https://codepen.io/cssgrid/pen/wBapVOW

row-rule/column-rule

...

Show threadRoma KomarovJun 11
@Olliew @patrickbrosset I think in this case it is a slightly different problem with the shrink-wrapping (if by buggy you mean gaps going to the edges of the container)
Show threadOlliewJun 11
@kizu @patrickbrosset Yep that's my issue, the row-gap (and the gap decoration) are stretching all the way to the very edge despite width: fit-content and margin-inline: auto set on the flex container.
Show threadRoma KomarovJun 11
@Olliew @patrickbrosset Yep, I don't think this is a gap decoration fault, see https://kizu.dev/shrinkwrap-problem/ — this is just the way CSS wrapping works (filling the parent). If we want to solve this case for gap decorations, we'd want to solve it in general.
The Shrinkwrap Problem: Possible Future Solutions

There is one old, yet unsolved, CSS problem: shrinking containers to fit the content when it automatically wraps. While not intentional, anchor positioning allows us to come closer to solving it, at least for a few cases. In this article, I’ll demonstrate how we can use anchor positioning to neatly decorate wrapping text or elements in flex or grid contexts.

Show threadOlliewJun 11
@kizu @patrickbrosset reminds me of a similar issue with text-wrap pretty
Show threadPatrick BrossetJun 12
@Olliew the best place is the Chromium bug tracker. The team will monitor it and then move the report to whatever place might be more relevant if needed (e.g. working group discussion, etc.)
See https://developer.chrome.com/blog/gap-decorations?hl=en#call_for_feedback
A new way to style gaps in CSS  |  Blog  |  Chrome for Developers

Say goodbye to border and pseudo-element hacks.

Chrome for Developers
Show threadWolfr5d ago
@patrickbrosset woohoo! A CSS change I can get excited about!