Thinking on ways to solve BUTTONS
42 919
10.7
Google Chrome Developers770 тыс
Следующее
24.05.22 – 17 21524:45Популярные
26 дней – 2 66614:33
17 дней – 1 7900:57Опубликовано 18 мая 2022, 17:00
In today's GUI Challenge, @AdamArgyleInk styles all the web's different button types with custom properties and :where(), for light/dark adaptive buttons that are easy to make new variants with.
Chapters:
0:00 - Introduction
0:19 - Overview
2:08 - Keyboard UX
2:46 - New theme switcher
3:09 - Mouse UX
3:34 - Buttons in forms
4:30 - Disabled button
5:22 - HTML
5:43 - CSS base selector
6:24 - Adaptive custom properties
7:20 - Button variants
10:10 - Live button variant building
11:18 - Recap
11:50 - Reduced motion
12:57 - Outro
Resources:
Read along → goo.gle/3wEsaWR
Try a demo → goo.gle/3a2guoV
Get the source →goo.gle/39uY8Na
Watch more GUI Challenges → goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → goo.gle/ChromeDevs
#GUIchallenges #CSS #ChromeDeveloper
Chapters:
0:00 - Introduction
0:19 - Overview
2:08 - Keyboard UX
2:46 - New theme switcher
3:09 - Mouse UX
3:34 - Buttons in forms
4:30 - Disabled button
5:22 - HTML
5:43 - CSS base selector
6:24 - Adaptive custom properties
7:20 - Button variants
10:10 - Live button variant building
11:18 - Recap
11:50 - Reduced motion
12:57 - Outro
Resources:
Read along → goo.gle/3wEsaWR
Try a demo → goo.gle/3a2guoV
Get the source →goo.gle/39uY8Na
Watch more GUI Challenges → goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → goo.gle/ChromeDevs
#GUIchallenges #CSS #ChromeDeveloper
Свежие видео
7 дней – 1268:42
7 дней – 1899:29
8 дней – 55 81413:02
11 дней – 2 0630:31
15 дней – 1243:29
15 дней – 595:17Случайные видео
114 дней – 3521:43
325 дней – 161 1491:01
08.09.23 – 485 48013:17
17.07.22 – 2 492 4610:45
08.02.22 – 499 1977:53
12.02.08 – 120 0638:11
7 дней – 13 1730:20
9 дней – 3113:54
11 дней – 1251:12
13 дней – 1 5540:50
13 дней – 5640:59
2 дня – 6 7711:17