Merge pull request #191 from korin5/master

feat: support search-input in dark mode
Candinya · Jan 18, 2024 · b98a915 · b98a915
2 parents 897d07f + 8033eda
commit b98a915
Show file tree

Hide file tree

Showing 6 changed files with 3,214 additions and 9 deletions.
diff --git a/source/css/kr-color-dark.min.css b/source/css/kr-color-dark.min.css
diff --git a/source/css/kratosr.min.css b/source/css/kratosr.min.css
diff --git a/src/scss/kr-color-dark.scss b/src/scss/kr-color-dark.scss
@@ -15,6 +15,11 @@ $page_background: #181c27;
 $info_background: #3c495bbb;
 $navbar_desktop: #181c27cc;
 $navbar_mobile: #16171ae6;
+$search_background:#282c34de;
+$search_text:#fff;
+$search_border:#fff;
+$search_shadow:0 0 0 .125em rgba(255,255,255,.25);
+
 @import './kr-color/base.scss';
 
 // for Gitalk

diff --git a/src/scss/kr-color/base.scss b/src/scss/kr-color/base.scss
@@ -271,6 +271,17 @@ span.blur {
   }
 }
 
+#search-input {
+    background-color: $search_background;
+    color: $search_text;
+
+    &:active, &:focus {
+      border-color: $search_border;
+      box-shadow: $search_shadow;
+    }
+
+}
+
 /******************* Plugins ********************/
 
 #dsqjs {

diff --git a/src/scss/kr-color/default.scss b/src/scss/kr-color/default.scss
@@ -15,4 +15,8 @@ $page_background: #f5f5f5;
 $info_background: #efefefaa;
 $navbar_desktop: #282a2c99;
 $navbar_mobile: #16171ae6;
+$search_background:#fff;
+$search_text:#000;
+$search_border:#3273dc;
+$search_shadow:0 0 0 .125em rgba(50,115,220,.25);
 @import './base.scss';
diff --git a/src/scss/kratosr.scss b/src/scss/kratosr.scss
@@ -2944,7 +2944,7 @@ span.blur {
 #search-input {
   -webkit-appearance: none;
   border-color: #dbdbdb;
-  background-color: #fff;
+  // background-color: #fff;
   border-radius: 4px 0 0 4px;
 
   &:hover {
@@ -2955,10 +2955,10 @@ span.blur {
     outline: 0;
   }
 
-  &:active, &:focus {
-    border-color: #3273dc;
-    box-shadow: 0 0 0 .125em rgba(50,115,220,.25)
-  }
+  // &:active, &:focus {
+  //   border-color: #3273dc;
+  //   box-shadow: 0 0 0 .125em rgba(50,115,220,.25)
+  // }
 }
 
 .input-group {