Thinking on ways to solve BUTTONS
42 239
10.6
Google Chrome Developers739 тыс
Следующее
24.05.22 – 16 69224:45Популярные
129 дней – 3 5240:58
242 дня – 4 7800:49Опубликовано 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
Свежие видео
2 дня – 2193:19
2 дня – 1 7930:32
2 дня – 4911:30
Случайные видео
60 дней – 14 407 2591:01
03.12.21 – 9 4264:09
09.10.21 – 1 527 67910:56
10.08.21 – 1 1930:56
25.08.17 – 111 0334:28
20 часов – 1 6161:10
1 день – 4840:27
1 день – 1900:17
3 дня – 7991:50
3 дня – 22:16
5 дней – 5 14812:09
1 день – 200 3090:55
1 день – 8846:24