forgot to modify _form.scss

diff --git a/assets/sass/components/_form.scss b/assets/sass/components/_form.scss
index 5d20c58..4bf1548 100644 (file)
--- a/assets/sass/components/_form.scss
+++ b/assets/sass/components/_form.scss
@@ -76,6 +76,9 @@
                letter-spacing: _font(letter-spacing-alt);\r
                margin: 0 0 (_size(element-margin) * 0.5) 0;\r
                text-transform: uppercase;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       color: _palette_dark(fg-bold);\r
+               }\r
        }\r
 \r
        input[type="text"],\r
@@ -96,6 +99,9 @@
                padding: 0 1em;\r
                text-decoration: none;\r
                width: 100%;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       background: _palette_dark(border-bg);\r
+               }\r
 \r
                &:invalid {\r
                        box-shadow: none;\r
@@ -104,6 +110,10 @@
                &:focus {\r
                        border-color: _palette_light(highlight);\r
                        box-shadow: 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
+                       }\r
                }\r
        }\r
 \r
@@ -115,10 +125,17 @@
                height: _size(element-height);\r
                padding-right: _size(element-height);\r
                text-overflow: ellipsis;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       background-image: svg-url("<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'><path d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='#{_palette_dark(border)}' /></svg>");\r
+               }\r
 \r
                option {\r
                        color: _palette_light(fg-bold);\r
                        background: _palette_light(bg);\r
+                       @media screen and (prefers-color-scheme: dark) {\r
+                               color: _palette_dark(fg-bold);\r
+                               background: _palette_dark(bg);\r
+                       }\r
                }\r
 \r
                &:focus {\r
@@ -165,6 +182,9 @@
                        padding-left: (_size(element-height) * 0.6) + 1em;\r
                        padding-right: 0.75em;\r
                        position: relative;\r
+                       @media screen and (prefers-color-scheme: dark) {\r
+                               color: _palette_dark(fg);\r
+                       }\r
 \r
                        &:before {\r
                                background: _palette_light(border-bg);\r
@@ -179,6 +199,9 @@
                                text-align: center;\r
                                top: 0;\r
                                width: (_size(element-height) * 0.75);\r
+                               @media screen and (prefers-color-scheme: dark) {\r
+                                       background: _palette_dark(border-bg);\r
+                               }\r
                        }\r
                }\r
 \r
@@ -188,12 +211,20 @@
                                border-color: _palette_light(highlight);\r
                                content: '\f00c';\r
                                color: _palette_light(bg);\r
+                               @media screen and (prefers-color-scheme: dark) {\r
+                                       background: _palette_dark(fg-bold);\r
+                                       border-color: _palette_dark(highlight);\r
+                                       color: _palette_dark(bg);\r
+                               }\r
                        }\r
                }\r
 \r
                &:focus + label {\r
                        &:before {\r
                                box-shadow: 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
+                               }\r
                        }\r
                }\r
        }\r
@@ -216,19 +247,31 @@
        ::-webkit-input-placeholder {\r
                color: _palette_light(fg-light) !important;\r
                opacity: 1.0;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       color: _palette_dark(fg-light) !important;\r
+               }\r
        }\r
 \r
        :-moz-placeholder {\r
                color: _palette_light(fg-light) !important;\r
                opacity: 1.0;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       color: _palette_dark(fg-light) !important;\r
+               }\r
        }\r
 \r
        ::-moz-placeholder {\r
                color: _palette_light(fg-light) !important;\r
                opacity: 1.0;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       color: _palette_dark(fg-light) !important;\r
+               }\r
        }\r
 \r
        :-ms-input-placeholder {\r
                color: _palette_light(fg-light) !important;\r
                opacity: 1.0;\r
+               @media screen and (prefers-color-scheme: dark) {\r
+                       color: _palette_dark(fg-light) !important;\r
+               }\r
        }
\ No newline at end of file