fixed higlighting of form items when focused

diff --git a/assets/sass/components/_form.scss b/assets/sass/components/_form.scss
index 4bf1548..5bfe29f 100644 (file)
--- a/assets/sass/components/_form.scss
+++ b/assets/sass/components/_form.scss
@@ -91,7 +91,7 @@
        textarea {\r
                @include vendor('appearance', 'none');\r
                background: _palette_light(border-bg);\r
-               border: none;\r
+               border: 1px solid _palette_light(fg-light);\r
                border-radius: 0;\r
                color: inherit;\r
                display: block;\r
@@ -100,7 +100,8 @@
                text-decoration: none;\r
                width: 100%;\r
                @media screen and (prefers-color-scheme: dark) {\r
-                       background: _palette_dark(border-bg);\r
+                       background: _palette_dark(border);\r
+                       border: 1px solid _palette_dark(fg-light);\r
                }\r
 \r
                &:invalid {\r
@@ -109,10 +110,10 @@
 \r
                &:focus {\r
                        border-color: _palette_light(highlight);\r
-                       box-shadow: 0 0 0 2px _palette_light(highlight);\r
+                       box-shadow: inset 0 0 0 2px _palette_light(highlight);\r
                        @media screen and (prefers-color-scheme: dark) {\r
                                border-color: _palette_dark(highlight);\r
-                               box-shadow: 0 0 0 2px _palette_dark(highlight);\r
+                               box-shadow: inset 0 0 0 2px _palette_dark(highlight);\r
                        }\r
                }\r
        }\r
@@ -221,9 +222,9 @@
 \r
                &:focus + label {\r
                        &:before {\r
-                               box-shadow: 0 0 0 2px _palette_light(highlight);\r
+                               box-shadow: inset 0 0 0 2px _palette_light(highlight);\r
                                @media screen and (prefers-color-scheme: dark) {\r
-                                       box-shadow: 0 0 0 2px _palette_dark(highlight);\r
+                                       box-shadow: inset 0 0 0 2px _palette_dark(highlight);\r
                                }\r
                        }\r
                }\r