Frontendɾ
@frontendr
Tweets mostly about #HTML, #CSS, #Javascript and other web based technologies.
corner-shape: squircle; available in chrome for now used it recently on my site, no more clip-path or svg needed to achieve it
little details 👨🍳 tiny css transition-delay on :hover filters noise and captures intent .text { transition: grid-template-columns 0.2s var(--ease); } button:hover .text { grid-template-columns: 1fr; transition-delay: 0.1s; }
accordion transitions w/ css ::details-content, <details> + <summary> 🧑🍳 details:has(~ [open]) { --y: -1; } [open] ~ details { --y: 1; } details { translate: 0 calc(var(--y) * 1rem); } [open]::details-content { height: fit-content; }
Using the blur trick for optical alignment
The new CSS heading selector is so good! This will make it much easier to style headings all at once.
You know how position: sticky always fails for weird reasons that are a pain in the 🍑 to fix? I finally had enough, peeked at the spec, asked AI some questions, and mostly figured things out—and wrote about it here. Link below 👇
Vite 7.2 is out! ⚡️ 🗃️ `build.license` option 🔌 proxy + HTTP2 support 💜 and more features and fixes Don't forget to check the complete changelog github.com/vitejs/vite/bl…
Yes. You can do responsive inline css vars in Tailwind. [--color:red] sm:[--color:blue]
oxfmt (the oxc-based formatter) is getting very close to ready! - 2-3x faster than Biome - 45x faster than Prettier - Better prettier conformance than Biome means switching won’t cause huge diffs - More flexible line wrapping than Prettier We have tested oxfmt against several…
@cursor_ai is now in @raycast start agents, track progress, and finish in Cursor – all without leaving the keyboard
Launch and manage @cursor_ai agents with @raycast 🚀 Tips to start: 🎹 Set a hotkey like ⌘ + ⌃ + C for the Launch Agent command 🖼️ Add screenshots of errors or bug reports 🎛️ Take over anytime with the Open in Cursor action Next time you spot a bug, start an agent first!
⚙️ New CSS Generator! Save this link for the future. A tool to easily convert any SVG shape into a CSS one in no time. Powered by the new shape() function! 🤩 css-generators.com/svg-to-css/ Single-element, responsive, and no more ViewBox headaches.
I STILL get so many folks misunderstanding the difference between: Pick, Omit Exclude, Extract They should be called: PickFromObject, OmitFromObject ExcludeFromUnion, ExtractFromUnion Here's a breakdown:
tired of seeing fugly `<details>` try this one nerdy.dev/nice-details
Another shape made easy using the new shape() function. css-tip.com/heart/ I think I just found my new favorite CSS feature. 😍
Another shape with rounded corners using shape()! This time it's an arrow-like box. A single-element responsive implementation easy to adjust using CSS variables. css-tip.com/arrow-like-box/ A follow up to a post by @chriscoyier
don't forget `touch-action: manipulation` for buttons on mobile double taps shouldn't zoom
I'm a @DrizzleORM fan and user, but I'm also an SQL-first dev. Drizzle's migrations are nice, but I prefer migrations to be first-class, rather than an artifact of code-first schema management. If you haven't tried Goose, highly recommend: github.com/pressly/goose
Found out a nice way to have @tailwindcss IntelliSense anywhere in the code.
Writing my TypeScript .cursor/rules. Writing it not only to include my recommendations, but also to tell the AI things about TypeScript that may not be uppermost in its training data. What should I include?
✍️ New Article: First Look at The Modern attr() I explored the new attr() capabilities and shared my thoughts about it. Happy reading! ishadeed.com/article/modern…
United States 趋势
- 1. Good Thursday 27.3K posts
- 2. Happy Friday Eve N/A
- 3. #thursdaymotivation 1,653 posts
- 4. #thursdayvibes 2,279 posts
- 5. #ThursdayThoughts 1,583 posts
- 6. #หลิงออมปฏิทินช่อง3ปี2569 742K posts
- 7. LINGORM CH3 CALENDAR SIGN 733K posts
- 8. Nnamdi Kanu 63.2K posts
- 9. #ProofOfFortification N/A
- 10. FEMA 80.3K posts
- 11. Crockett 59.3K posts
- 12. But Jesus 22K posts
- 13. The 2024 88.4K posts
- 14. NO CAP 14.5K posts
- 15. Knicks 14.2K posts
- 16. Shamet 3,201 posts
- 17. FREE HAT 1,902 posts
- 18. Hire American 5,463 posts
- 19. Sam Harris 3,925 posts
- 20. Paint 32.7K posts
Something went wrong.
Something went wrong.