Dark Mode Search Input

layer5io · Sep 15, 2024 · 7ee7968 · 7ee7968
1 parent 0e75ca7
commit 7ee7968
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/src/reusecore/Search/searchbox.style.js b/src/reusecore/Search/searchbox.style.js
@@ -15,6 +15,10 @@ export const SearchWrapper = styled.div`
       border-radius: 5px;
       border: 1px solid ${(props) => props.theme.headingColor};
       background-color: ${(props) => props.theme.shadowLightColor};
+      
+      /*Changes color for the text*/
+      color: ${(props) => props.theme.textColor};
+
       &:focus {
         /* border-color: ${(props) => props.theme.primaryColor}; */
         border-color: #fff;

diff --git a/src/theme/app/themeStyles.js b/src/theme/app/themeStyles.js
@@ -240,7 +240,7 @@ export const darktheme = {
   scrollbarColor: "#00d3a9",
 
   // white
-  primaryColor: "#FFFFFF",
+  primaryColor: "#00d3a9",
 
   // silver chalice (light gray)
   primaryLightColor: "#2C2C2C",
@@ -265,14 +265,14 @@ export const darktheme = {
   // Teal Blue
   tertiaryColorTwo: "#477E96",
 
-  headingColor: "#000000",
+  headingColor: "#111111",
 
   // light slate gray (medium gray)
-  textColor: "#000000",
+  textColor: "#ffffff",
   shadowColor: "rgba(255, 255, 255, 0.05)",
 
   // platinum (light gray)
-  shadowLightColor: "#E6E6E6",
+  shadowLightColor: "#333333",
 
   // dark gray
   shadowDarkColor: "#484848",