#devsheets 搜索结果

Sometimes it's the tiny things. 💪 ✨ Firefox is the first browser shipping `URL.canParse`, and it's so much better than try/catching valid URLs. 😅 #devsheets

.@babeljs shipped support for duplicate named capture groups and since the last DevSheet has been a while, here's a quick named capture groups explainer. 🙈 #devsheets Video alt: Explanation of the named capture group syntax `(?<name>.*)`.

💡 TIL – there's a new global JavaScript method to report exceptions to global error handlers. If you're knee deep in your call stack you can handle exception so that things don't blow up, but also trigger global event handlers for e.g. error monitoring. 🎉 #devsheets

Can you tell me more about devsheets? seems there's none at #devsheets on twitter.

So, who's adopting the fancy `inset` logical CSS properties? #devsheets Video alt: Explanation of `inset-block` and `inset-inline` showing that they translate to `top`, `right`, `bottom` and `left`, but depend on `writing-mode`, `direction` and `text-orientation`.

🎉 Input type `datetime-local` support is coming to Firefox 93. 🎉 🔗 MDN docs: developer.mozilla.org/en-US/docs/Web… #devsheets

Quick morning DevSheet – forgiving selector lists in CSS. 🙈 🔗 Spec: drafts.csswg.org/selectors-4/#f… #devsheets Video alt: Browsers invalidate a complete CSS selector if they fail to parse it. :is()/:where() don't invalidate bc. they take forgiving selector lists as argument.

Today I learned that you can control if SVG stroke-width should scale with applied transformations using `vector-effect`. 😲 #devsheets 🔗 stefanjudis.com/today-i-learne… Video alt: Example showing scaled stroke width that's turned of by using vector-effect.

Quick evening devsheet. 🙈 `accent-color` will enable us to have style-matching checkboxes and radios. 👏 🔗 Spec: drafts.csswg.org/css-ui-4/#widg… 🔗 CodePen example: codepen.io/stefanjudis/pe… #devsheets Video alt: A purple coloured radio and checkbox input.

🙈 I just learned that you can use `text-align: start` and `text-align: end` to align text with language text direction in mind. #devsheets Video alt: Example showing how `text-align: start` and `text-align: end` adjust alignments correctly for RTL languages.

Quick Sunday DevSheet. 🙈 With Chromium v91 `@​counter-style` slowly enters the stage. Soon you can go wild with another option to create custom list styles. #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web… 🔗 Spec: drafts.csswg.org/css-counter-st… 🔗 Chrome status: chromestatus.com/feature/569269…

TIL – `repeating` gradient #css functions exist. 😲 🔗 stefanjudis.com/today-i-learne… #devsheets

I just learned that quotes can be localised via CSS. 😲 Big thanks to @lonekorean for including that in an article. 🙇‍♂️ 🔗 codersblock.com/blog/diving-in… #devsheets

I just updated Chrome and it now supports complex selectors in CSS `:not()` pseudo-classes. 😲 That means stuff like this is now possible. 👇 #devsheets Works in Chrome 88, Safari and Firefox. 🎉 ✍️ Article and live example: stefanjudis.com/snippets/how-t…

🎉 Starting with @firefox 85 we can say goodbye to :-moz-focusring and say hello to :focus-visible. 🎉 MDN: developer.mozilla.org/en-US/docs/Web… #devsheets Video alt: Explanation showing that focus styles can be hidden for click interactions but be visible for keyboards.

Little evening devsheet. 🙈 Order matters in CSS transformations. Blog post: stefanjudis.com/blog/order-in-… #devsheets How transforms are applied when using functions and properties. 👇

CSS filter functions in a nutshell. 🙈 #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web…

☕ Little Monday devsheet. `place-items` in CSS grid. #devsheets Link Symbol MDN: developer.mozilla.org/en-US/docs/Web… Video alt: Visualisation of the place-items CSS property and how it can be used to center elements in grid containers. (there was a mistake in the previous one... 🙈)

☕ Little morning devsheet. min-content, max-content and fit-content in CSS. :) 🔗 @css : css-tricks.com/almanac/proper… 🔗 Spec: drafts.csswg.org/css-sizing-3/#… #devsheets Video alt: in next tweet. 👇🧵

`inputmode` on HTML elements. 🙈👇 #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web…

Safari now supports `enterkeyhint`. 👏 I always like it when the enter key gives me more context. 👇 🔗 Spec: html.spec.whatwg.org/multipage/inte… #devsheets

💡 TIL – there's a new global JavaScript method to report exceptions to global error handlers. If you're knee deep in your call stack you can handle exception so that things don't blow up, but also trigger global event handlers for e.g. error monitoring. 🎉 #devsheets

Little morning devsheet ☕ – `Intl.NumberFormat`. 🔗 MDN: developer.mozilla.org/en-US/docs/Web… #devsheets

Sometimes it's the tiny things. 💪 ✨ Firefox is the first browser shipping `URL.canParse`, and it's so much better than try/catching valid URLs. 😅 #devsheets

🍵 Little evening DevSheet: The new Cookie Store API shipping in Chrome 87. 🔗 Chrome status: chromestatus.com/feature/565884… 🔗 Explainer: wicg.github.io/cookie-store/e… #devsheets

I just updated Chrome and it now supports complex selectors in CSS `:not()` pseudo-classes. 😲 That means stuff like this is now possible. 👇 #devsheets Works in Chrome 88, Safari and Firefox. 🎉 ✍️ Article and live example: stefanjudis.com/snippets/how-t…

TIL: There's an `ex` CSS unit. 🙈 🔗 CSS Spec for font-relative length units: drafts.csswg.org/css-values-4/#… #devsheets

☕ Little morning DevSheet. Reviver and Replacer functions when dealing with JSON in JavaScript. #devsheets

CSS filter functions in a nutshell. 🙈 #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web…

☕ Little morning devsheet: the flexible `flex` shorthand CSS property. 🙈 #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web…

I just learned that quotes can be localised via CSS. 😲 Big thanks to @lonekorean for including that in an article. 🙇‍♂️ 🔗 codersblock.com/blog/diving-in… #devsheets

TIL – `repeating` gradient #css functions exist. 😲 🔗 stefanjudis.com/today-i-learne… #devsheets

I haven't used the readonly attribute on form elements for a while and forgot that they can be targeted with a :read-only pseudo class. 🙈 To remember, I made a quick devsheet showing the differences of disabled and readonly inputs. #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Lea…

🎉 Input type `datetime-local` support is coming to Firefox 93. 🎉 🔗 MDN docs: developer.mozilla.org/en-US/docs/Web… #devsheets

So I am doing frontend dev after 2 years. What is this power I feel w/ CSS Grids and Flexbox #devsheets @freeCodeCamp @css

☕ Quick morning DevSheet. `git status` vs. `git status -s` vs. `git status --porcelain`. :) #devsheets 🔗 TIL post: stefanjudis.com/today-i-learne…

Quick Sunday DevSheet. 🙈 With Chromium v91 `@​counter-style` slowly enters the stage. Soon you can go wild with another option to create custom list styles. #devsheets 🔗 MDN: developer.mozilla.org/en-US/docs/Web… 🔗 Spec: drafts.csswg.org/css-counter-st… 🔗 Chrome status: chromestatus.com/feature/569269…

☕ Little morning devsheet because `selector` entered Safari Tech Preview (shipping Safari 14+). 👇`@supports` and the `selector` function in CSS. 🎉 #devsheets 🔗 MDN for supports: developer.mozilla.org/en-US/docs/Web…

frontendfront: RT stefanjudis: There is always new stuff to learn in HTML :D Today I learned ordered lists have a `reversed` attribute. 😲 🔗 spec: html.spec.whatwg.org/multipage/grou… #devsheets