Thinking on ways to solve BUTTONS
42 833
10.6
Google Chrome Developers764 тыс
Следующее
24.05.22 – 17 15324:45Популярные
22 дня – 2 2410:58
21 день – 9740:22Опубликовано 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
Свежие видео
8 дней – 5007:26
14 дней – 25 5220:19
15 дней – 610:24
16 дней – 22 09433:15
17 дней – 5 8350:59
18 дней – 3201:59Случайные видео
182 дня – 138 49420:53
251 день – 146 2960:23
06.11.23 – 3 351 4530:31
24.04.23 – 2 7621:06
22.03.23 – 2781:04
17.04.09 – 104 5485:26
10 часов – 1 8638:27
3 часа – 2 46232:34
3 дня – 306 0781:09
6 дней – 19 98613:04
8 дней – 2 2891:00
10 дней – 6961:59
15 дней – 1 4731:00
18 часов – 1 5330:42