Loading video...

Video Failed to Load

Go Home

UI tip: instead of using gaps in bordered lists, try hiding the borders next to the hovered item.

guerriero_se's profile picture

Sebastiano Guerriero

19,264 subscribers

32,620 views • 2 months ago •via X (Twitter)

Science & Technology
LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

this effect can be achieved using only css by combining the :has() and :not() pseudo-classes: `.menu:has(.item:hover) .item:not(:hover) { filter: blur(8px); }` which simply means: when a menu has a hovered item, blur every item inside it that isn't being hovered
0:10

this effect can be achieved using only css by combining the :has() and :not() pseudo-classes: `.menu:has(.item:hover) .item:not(:hover) { filter: blur(8px); }` which simply means: when a menu has a hovered item, blur every item inside it that isn't being hovered

daniel petho

19,234 views • 4 months ago

Everyone keeps calling the Apple Vision Pro's UI "Magical" I NEEDED to try it out for myself. The Quest Pro is capable of it so I made a demo using eye tracking and hand tracking replicating the Apple UI. Its really good. APK for everyone to try the "Vision UI Experience" soon, Video with my takeaways Sooner.
0:13

Everyone keeps calling the Apple Vision Pro's UI "Magical" I NEEDED to try it out for myself. The Quest Pro is capable of it so I made a demo using eye tracking and hand tracking replicating the Apple UI. Its really good. APK for everyone to try the "Vision UI Experience" soon, Video with my takeaways Sooner.

𝙏𝙝𝙧𝙞𝙡𝙡

240,329 views • 3 years ago

One nice subtle benefit of using Base UI over Radix is that the animations are interruptible since Base uses CSS transitions instead of keyframes. This is me spamming on both dropdowns, notice the glitchiness in the one on the left.
0:10

One nice subtle benefit of using Base UI over Radix is that the animations are interruptible since Base uses CSS transitions instead of keyframes. This is me spamming on both dropdowns, notice the glitchiness in the one on the left.

Emil Kowalski

68,801 views • 1 month ago

A simple possession game using sticky ball. •Hurley in hurling hand, throw with the catching hand •Team in possession try work the ball to their teammate with the sticky pad •Players can progress to hand passing instead of throwing
0:13

A simple possession game using sticky ball. •Hurley in hurling hand, throw with the catching hand •Team in possession try work the ball to their teammate with the sticky pad •Players can progress to hand passing instead of throwing

Hurling made easy

21,242 views • 1 year ago

💡 FM26 Quick Tip: Tick Multiple Boxes Faster Instead of ticking each box one by one, click on the first item you want, then hold Shift and click on the last one: everything in between will be selected automatically. ☑️
0:11

💡 FM26 Quick Tip: Tick Multiple Boxes Faster Instead of ticking each box one by one, click on the first item you want, then hold Shift and click on the last one: everything in between will be selected automatically. ☑️

Sort It Out SI.net

54,401 views • 1 year ago

Instead of using cardio machines, you can also try these...
0:18

Instead of using cardio machines, you can also try these...

Muscle Blueprint - Fitness | Health | Abs

71,583 views • 7 months ago

The DTI waiting time just to get the next item:
0:19

Sensitive content

The DTI waiting time just to get the next item:

Greenie 🐸

57,834 views • 1 month ago

If you ever feel like the gradients you're using are dull or muddy, try using OKLCH colors instead. In OKLCH, hue is angular, which means that the colors the gradient passes through are different compared to sRGB.
0:11

If you ever feel like the gradients you're using are dull or muddy, try using OKLCH colors instead. In OKLCH, hue is angular, which means that the colors the gradient passes through are different compared to sRGB.

Jakub Krehel

283,661 views • 9 months ago

In the next version of React Scan: Filter down and select parts of the UI that you care about
0:13

In the next version of React Scan: Filter down and select parts of the UI that you care about

Aiden Bai

62,860 views • 1 year ago

preview of the upcoming cupcakke collab emote arriving in the next item shop reset 👀🔥 (Via: @kanesbarefeet)
0:15

preview of the upcoming cupcakke collab emote arriving in the next item shop reset 👀🔥 (Via: @kanesbarefeet)

Lucien 🐊

20,170 views • 11 months ago

Claude Code pro tip: use Ctrl+W to delete full words instead of backspacing like a caveman hat tip to Ray Fernando for the tip on his stream
0:15

Claude Code pro tip: use Ctrl+W to delete full words instead of backspacing like a caveman hat tip to Ray Fernando for the tip on his stream

Ian Nuttall

69,916 views • 1 year ago

Forgot to mention this CSS tip when sharing the :has() calendar 🤦‍♂️ It's a <table> & a snippet like this 👇 tr:has(:checked) ~ tr:has(:hover) .cell:has(~ .cell:hover) Says target the cell in a sibling row that's hovered and has a sibling that is hovered 🤯 You :has() power! 💪
0:15

Forgot to mention this CSS tip when sharing the :has() calendar 🤦‍♂️ It's a <table> & a snippet like this 👇 tr:has(:checked) ~ tr:has(:hover) .cell:has(~ .cell:hover) Says target the cell in a sibling row that's hovered and has a sibling that is hovered 🤯 You :has() power! 💪

jhey ʕ•ᴥ•ʔ

298,163 views • 3 years ago

Second attempt at the face rig. This time instead of using FaceIt, I'm using my own custom addon that's more streamlined towards cartoony faces. I'll try to animate something with it soon.
0:12

Second attempt at the face rig. This time instead of using FaceIt, I'm using my own custom addon that's more streamlined towards cartoony faces. I'll try to animate something with it soon.

cladur

45,907 views • 1 year ago

Trying to make sure i'm not just sitting around doing nothing. early wip for the item box ui
0:10

Trying to make sure i'm not just sitting around doing nothing. early wip for the item box ui

Travis

24,825 views • 1 month ago

Design Engineering Tip: If you’re using the same corner radius across your entire UI, try scaling it with the component size: 12px → XS (buttons, tags) 16px → S (cards, inputs) 24px → M (modals, panels) As components get larger, increasing the radius can help preserve the same visual softness and balance.
0:13

Design Engineering Tip: If you’re using the same corner radius across your entire UI, try scaling it with the component size: 12px → XS (buttons, tags) 16px → S (cards, inputs) 24px → M (modals, panels) As components get larger, increasing the radius can help preserve the same visual softness and balance.

Gabriel

28,199 views • 4 months ago

One rounded wood profile, zero gaps: clean cuts lock into a perfect mate, the joint looks built-in instead of patched 🪵
0:16

One rounded wood profile, zero gaps: clean cuts lock into a perfect mate, the joint looks built-in instead of patched 🪵

Tansu Yegen

19,163 views • 6 months ago

hello guys im tabi and i have a lot of kittens :3 consider using code "TABII" in the item shop to support me tysm!
0:12

hello guys im tabi and i have a lot of kittens :3 consider using code "TABII" in the item shop to support me tysm!

tabi

26,603 views • 1 year ago