From 0b56f00047248776b097d790b71278e2be69aa01 Mon Sep 17 00:00:00 2001 From: itsmesabyrzhan Date: Thu, 23 Oct 2025 20:48:19 +0500 Subject: [PATCH 1/3] feat: enhance CSS normalize with form controls and a11y improvements --- normalize.css | 78 +++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 69 insertions(+), 9 deletions(-) diff --git a/normalize.css b/normalize.css index 6843ed2..35bc681 100644 --- a/normalize.css +++ b/normalize.css @@ -83,7 +83,6 @@ p:where(:not([class]):not(:last-child)) { margin-bottom: var(--paragraphMarginBottom); } - /** Упрощаем работу с изображениями и видео */ @@ -115,10 +114,6 @@ html { при появлении / исчезновении скроллбара */ scrollbar-gutter: stable; - /** - Плавный скролл - */ - scroll-behavior: smooth; } body { @@ -133,6 +128,16 @@ body { line-height: 1.5; } +/** + Плавный скролл только для пользователей, + которые не отключили анимации + */ +@media (prefers-reduced-motion: no-preference) { + html { + scroll-behavior: smooth; + } +} + /** Нормализация высоты элемента ссылки при его инспектировании в DevTools */ @@ -149,10 +154,38 @@ label { } /** - Убирает серую подсветку при тапе на мобильных устройствах (iOS/Android) + Убираем стандартные стили кнопок */ -button { +button, +input:where([type="button"], [type="submit"], [type="reset"]) { -webkit-tap-highlight-color: transparent; + -webkit-appearance: none; + appearance: none; + background-color: transparent; + border: none; +} + +/** + Убираем стрелки у input type="number" + */ +input:where([type="number"]) { + -moz-appearance: textfield; +} + +input:where([type="number"])::-webkit-inner-spin-button, +input:where([type="number"])::-webkit-outer-spin-button { + -webkit-appearance: none; + margin: 0; +} + +/** + Убираем крестик очистки у input type="search" + */ +input:where([type="search"])::-webkit-search-decoration, +input:where([type="search"])::-webkit-search-cancel-button, +input:where([type="search"])::-webkit-search-results-button, +input:where([type="search"])::-webkit-search-results-decoration { + -webkit-appearance: none; } /** @@ -160,7 +193,7 @@ button { (за исключением тех, у которых уже указан атрибут fill со значением 'none' или начинается с 'url') */ -:where([fill]:not( +:where(svg [fill]:not( [fill="none"], [fill^="url"] )) { @@ -172,7 +205,7 @@ button { (за исключением тех, у которых уже указан атрибут stroke со значением 'none') */ -:where([stroke]:not( +:where(svg [stroke]:not( [stroke="none"], [stroke^="url"] )) { @@ -191,9 +224,36 @@ svg * { */ :where(table) { border-collapse: collapse; + border-spacing: 0; border-color: currentColor; } +/** + Убираем отступы у ячеек таблицы с классом + */ +:where(th, td):where([class]) { + padding: 0; +} + +/** + Делаем textarea не растягиваемым по горизонтали + */ +textarea { + resize: vertical; +} + +/** + Нормализация summary для details + */ +summary { + cursor: pointer; + list-style: none; +} + +summary::-webkit-details-marker { + display: none; +} + /** Удаляем все анимации и переходы для людей, которые предпочитают их не использовать From 0e9960facc58648abcac007bd22d6b607362db60 Mon Sep 17 00:00:00 2001 From: itsmesabyrzhan Date: Thu, 23 Oct 2025 21:18:45 +0500 Subject: [PATCH 2/3] feat: enhance with form controls & a11y improvements From 0c07330af1c9a8b734b1afc677f19114586e4e75 Mon Sep 17 00:00:00 2001 From: itsmesabyrzhan Date: Thu, 23 Oct 2025 21:19:28 +0500 Subject: [PATCH 3/3] feat: enhance with form controls & a11y improvements