Thinking on ways to solve BUTTONS
42 873
10.6
Google Chrome Developers766 тыс
Следующее
24.05.22 – 17 18624:45Популярные
107 дней – 1 7300:49
127 дней – 5 12716:48Опубликовано 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
Свежие видео
3 дня – 106 99626:23
7 дней – 3 2390:15
7 дней – 273 0360:16
7 дней – 2 2390:49
10 дней – 2 6780:24
159 дней – 194 9201:54Случайные видео
19.04.23 – 3 7813:49
06.07.22 – 5 5720:24
31.08.21 – 1 6330:19
04.04.21 – 7 144 98329:54
16.10.12 – 36 0103:33
29 дней – 4510:30
21 час – 93311:52
3 дня – 41 29713:36
8 дней – 21 66537:40
8 дней – 2 7951:14
10 дней – 1 6880:19
10 дней – 33 41011:38
20 часов – 13 68510:06