Mandy Michael

Change the content on your page based on the light level in the room using the Ambient Light API. You can play around with the sensor.illuminance value in the pen to switch at different levels. Give it a try: s.codepen.io/mandymichael/d… See the code: codepen.io/mandymichael/p…

@matt_colman @philnash Now you know for next time!

@Mandy_Kerr @philnash I looked like an idiot up there with a grey shirt and white shoes

Phil’s shirt matches his background. I’ve got nothing on this and I’m up next 😭@philnash @webdirections

@philnash @matt_colman Always gotta match 😄

@matt_colman I have to credit @Mandy_Kerr for the inspiration and her dedication to it.

Qantas flights from Perth to Sydney return are over $1000 economy atm! 😬 in comparison to Virgin that’s like $700! Why!?!

📅 The full #LaraconAU schedule is now live! We've gathered 17 speakers from Australia and around the globe, and are hosting a Q&A with @taylorotwell, @jessarcher​, @joetannenbaum, @avosalmon, and @andrehvalentin from the @laravelphp team.

I was just looking for a resource for something and started reminiscing about the @smashingconf I went to in 2019. That was such a great event! 😄

@pabo_ 💜😭 it was so bad! I’d just started a new job too (honestly they were so great about it) but i was so stressed!

@Mandy_Kerr These things happen with little ones in Australia, I have a 1yr old and a 3yr old and we've been there a couple of times. It'll get easier.

The last 2 weeks have been the worst of my life. 1yr old was in hospital all last week with RSV - my husband & I both got sick as well. having a child in hospital sick is horrible we made it worse by neglecting our heath to focus on her (understandably) Now we are still very sick

@myfonj @askoufish I’ll try get some screenshots Friday

@Mandy_Kerr @askoufish Interesting, can you share more details? I did a quick test on Windows and all engines I have access to (Blink, Gecko, and olden WebKit) seem to be in line with each other (and with the font-weight fallback spec mechanism as I understand it): myfonj.github.io/sandbox.html#%…

Is it documented somewhere how the different browsers map font weights? I’ve been doing some googling and not come up with anything useful Eg if there is no 500 weight does it load 400, 600 etc?

@myfonj @askoufish I also took this into consideration in the testing cross browser/cross operating system and it seems more like the font weight decision tree is the issue than other rendering possibilities given how it renders so I was hoping to get confirmation on how each browser renders it.

@askoufish @Mandy_Kerr Otherwise, visual differences in apparent weights may be caused by different rendering pipelines in browsers/operating systems: smoothing technique, subpixel antialiasing, hinting, all of these factor may differ across instances. (AFAIK macOS had notoriously "bolder" outcomes.)

@myfonj @askoufish I tested this and it’s not consistent between browsers which is why I’m asking.

@askoufish @Mandy_Kerr Fallback mechanism for font weights is also nicely described at MDN: #fallback_weights" target="_blank" rel="nofollow noopener">developer.mozilla.org/en-US/docs/Web…, I think it is more comprehensible than the spec part #font-matching-algorithm#:~:text=If%20the%20desired%20weight%20is%20inclusively,a%20match%20is%20found.,-Similar" target="_blank" rel="nofollow noopener">drafts.csswg.org/css-fonts/#fon…

@askoufish It sadly is not based on my testing

@Mandy_Kerr AFAIK browsers should be consistent in terms of mapping font weights, assuming they adhere to the spec. The relevant part of the spec is #font-matching-algorithm" target="_blank" rel="nofollow noopener">drafts.csswg.org/css-fonts/#fon…. If you scroll a bit further down you'll find the`font-weight` section.

Looking forward to #LaraconAU so pumped I finally get to attend! Sadly Jello won’t be there but he’s always there in spirit! 😄 I’ll be explaining how you can use HTML to set a good foundation for improving your website/application’s performance 💖😊 Hope to see you there!

It feels like it’s actually loading the system font but Firefox is getting it wrong?

It works fine if it’s system-ui but the issue here is system-ui might not always be sans-serif right?

In Firefox, when it underlines the font in use in dev tools if you have a -apple-system or BlinkMacSystemFont or ui-sans-serif it will underline the generic one at the end eg sans-serif (this happens even if you change sans-serif monospace but it will still be sansserif) - why?

Another beautiful customized select with a usable fallback 🧑‍🍳😘 This API is awesome 😊 Makes my heart full to see this finally moving along in the WHATWG and browser prototypes ❤️

The simple joy of the upcoming customizable select API 🙂 codepen.io/una/pen/dyBWYx…

@jaffathecake Oh haha ooops

Chrome 128 has a regression bug where CSS easings fail to parse if there's a space (or newline) after the first "(". Currently, we're going to have to wait until Chrome 129, or even 130 for a fix. If this is impacting your sites, add the URLs to issues.chromium.org/issues/3616521…

@philhawksworth @Netlify Oh wow! Do you know where you’re going next?!

common question I'm getting: how to disable scrolling the page behind a <dialog>? answer: with :has! ```#css html:has(dialog[open]) { overflow: hidden; } ```