 In latest @FirefoxNightly, the variable tooltip in @FirefoxDevTools now shows the computed value of the variable! I'm super excited about this, it should make working with custom properties much easier. Combined with the registered property info and @starting-style value, this feels like super power 🦹 We're also planning other changes that would make the tooltip even better :) Oh wow – there's an emoji for "white guy holding up the valuable things they've created with AI": 🤷 Last day of my summer vacation … time for a quick dive before opening my mailbox next Monday. 🤩 View Transitions excitement! The Firefox team recently had a kick-off meeting to implement View Transitions. “Goal and scope of the project: Single page in H2 2024” https://docs.google.com/document/d/1w5ss3hSdh5x4imgvh4q9eZk6o0zz7B--e_rsamjKozw/edit 🥹🥳 If you haven't been following along: (if all goes well) that means we'll have cross-browser support for Same-Document View Transitions by the end of the year! 😎 Can you Syntax Highlight a code snippet on the web without overloading the DOM with a ton of `<span>` elements wrapped around the tokens? Thanks to the Custom Highlight API, you can!
Show previous comments
 @bramus This demo is incredibly cool. I see a huge value in this API. I am wondering more about the trade-off: more spans vs more tokenization logic. What if code blocks can be rendered on the server? Is it worth the effort? I have so many questions about this… Thanks for sharing this snippet dude! @bramus Do CSS Highlights support bold/italic? I saw those in your code but had a play and couldn't get it to work. MDN lists a stricter set of allowed properties. Is that changing? https://developer.mozilla.org/en-US/docs/Web/CSS/::highlight#allowable_properties  Psst, you no longer need JavaScript to create an exclusive accordion! As of Chrome 120 you can give `<details>` elements a `name` value. Just like radio buttons, those with the same name will form a group, of which only one can be chosen at the same time. https://developer.chrome.com/docs/css-ui/exclusive-accordion Exclusive Accordion (aka “named <details>”) is also supported in Safari 17.2 and up. And oh, we’re also looking into making it more easy for you to add animations `<details>` … but more on that later ;)  @bramus There are a11y concerns around this pattern which have not yet been addressed, so I'm not going to be using or encouraging this pattern until that's done. @bramus Exclusive accordions aren't good for the user. It shouldn't be someone else's choice whether you can expand all the content on a page. See this discussion: To change a color based on Light Mode or Dark Mode, you’d typically use a `prefers-color-scheme` Media Query. To make things easier, CSS now comes with a `light-dark()` utility function. Read https://brm.us/light-dark to get to know the details. Browser Support: Firefox 120.
Show previous comments
@bramus gotta read the details, but was there some consideration to have a syntax that supports more color scheme like forced-colors? Or who knows, there could be color schemes for common color blindness. Would be nice to have a unified syntax to define colors, and other values for the different color schemes  @bramus One day it would be very easy to replace my var(--LIGHT, …) var(--DARK, …) space-toggles-based solution with this :D (which we use in production for around a year with zero issues!) Just a moment ago, CSS View Transitions Module Level 1 got published as Candidate Recommendation. Congrats @jaffathecake et al on reaching this HUGE MILESTONE! |
Gregory's Server
@nicolaschevobbe @FirefoxNightly @kizu @anatudor @shadeed9 @FirefoxDevTools Great feature! Will this be part of the next Firefox Dev version?
@nicolaschevobbe @FirefoxNightly @FirefoxDevTools @shadeed9 will you remove in IA in Firefox? Like, not add it?
@nicolaschevobbe @FirefoxNightly This feature is just super helpful 🤩 Thanks a lot!