chore: change description color in light mode (#1697)

expressjs · Nov 28, 2024 · 9092d18 · 9092d18
1 parent d5ca463
commit 9092d18
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 16 deletions.
diff --git a/css/dark-theme.css b/css/dark-theme.css
@@ -19,6 +19,7 @@
   --dark_header_text: silver;
   --dark_main_text: #e6edf3;
   --dark_bright_text: wheat;
+  --dark_smooth_text: #aeaeae;
   --dark_border: #ddd;
   --link: #259dff;
 }
@@ -139,7 +140,7 @@ html.dark-mode #navbar > span.algolia-autocomplete > input::placeholder {
 }
 :lang(uz) span.algolia-autocomplete > input,
 :lang(ru) span.algolia-autocomplete > input,
-:lang(de) span.algolia-autocomplete > input, 
+:lang(de) span.algolia-autocomplete > input,
 :lang(fr) span.algolia-autocomplete > input {
   max-width: 100%;
 }
@@ -169,6 +170,9 @@ html.dark-mode pre {
 html.dark-mode #description .express > a {
   color: var(--dark_main_text);
 }
+html.dark-mode #description .description {
+  color: var(--dark_smooth_text);
+}
 html.dark-mode #install-command {
   background: var(--main_dark_bg);
 }
@@ -207,8 +211,8 @@ html.dark-mode #api-doc > h3 {
 html.dark-mode #api-doc section h5 {
   color: var(--dark_header_text);
 }
-/* 
-overriding search-bar results drop down  
+/*
+overriding search-bar results drop down
 */
 html.dark-mode .ds-dropdown-menu .ds-dataset-1 {
   background-color: var(--dark_bg);
@@ -264,16 +268,16 @@ html.dark-mode .blog-post{
   background-color: initial;
   border: 1px solid var(--dark_border);
   transition: 0.3s;
-} 
+}
 html.dark-mode .blog-post:hover{
   background-color: var(--darker_hover);
 }
 html.dark-mode .blog-title > a{
   color: var(--dark_main_text);
-} 
+}
 html.dark-mode .blog-excerpt{
   color: var(--dark_bright_text);
-} 
+}
 html.dark-mode #blog-side-menu-container h3 a{
   color: var(--dark_header_text);
 }
@@ -283,4 +287,4 @@ html.dark-mode #blog-side-menu > li > a{
 
 html.dark-mode pre code {
   background-color: inherit;
-} 
+}
diff --git a/css/style.css b/css/style.css
@@ -230,7 +230,7 @@ li code {
 
 *::-webkit-scrollbar-thumb:active {
   background-color: #616161;
-} 
+}
 
 /* links */
 
@@ -295,7 +295,7 @@ a {
   position: relative;
   top: -5px;
   font: 100 4.1em "Helvetica Neue", "Open Sans", sans-serif;
-  color: #aeaeae;
+  color: #7e7e7e;
   line-height: .87;
 }
 
@@ -449,7 +449,7 @@ html[xmlns] .clearfix {
   width: 100%;
   margin-top: 5px;
   margin-bottom: 20px;
-}     
+}
 
 /* doc specific */
 
@@ -627,7 +627,7 @@ footer {
 
 #footer-copyright {
   display: flex;
-  flex-direction: column; 
+  flex-direction: column;
   justify-content: center;
   gap: 20px;
 }
@@ -1100,7 +1100,7 @@ h2 a {
 #blog-doc {
   margin: 0 10px;
 }
-#blog-doc:has(> h1#express-blog), 
+#blog-doc:has(> h1#express-blog),
 #blog-doc:has(> h1#write-a-blog-post) {
   min-height: 300px;
 }
@@ -1125,7 +1125,7 @@ h2 a {
   justify-content: space-between;
   box-shadow: 2px 3px #E0E0E0;
   border-radius: 5px;
-  border: 1px solid #808080;  
+  border: 1px solid #808080;
   transition: 0.1s;
 }
 .blog-post:hover {
@@ -1181,7 +1181,7 @@ h2 a {
     margin-right: 0;
     padding-right: 10px;
   }
-  
+
 
 
   #blog-doc .blog-details + p > img {
@@ -1198,7 +1198,7 @@ h2 a {
   }
   .blog-tags {
     margin-bottom: 20px;
-  } 
+  }
   .blog-title {
     font-size: 1.3rem;
     margin-bottom: 20px;
@@ -1207,7 +1207,7 @@ h2 a {
   .blog-post .blog-details {
     display: flex;
     flex-direction: row;
-    margin-left: 1rem; 
+    margin-left: 1rem;
     font-size: 90%;
   }
   .blog-post .blog-details div:first-child {