issue expressjs#1382

- add css to search bar drop down - rearrange css file and add comments
chrisdel101 · Apr 20, 2024 · 5b0cd2f · 5b0cd2f
1 parent 6e419fb
commit 5b0cd2f
Showing 1 changed file with 76 additions and 19 deletions.
diff --git a/css/theme.css b/css/theme.css
@@ -4,7 +4,9 @@
   --dark_hover: #383838;
   --second_dark_hover: #484848;
   --dark_text: #e6edf3;
-  --second_dark_text: #e6edf3;
+  --dark_header_text: silver;
+  --dark_inner_text: grey;
+  --link: #259dff;
 }
 #theme-icon-container {
   position: relative;
@@ -31,9 +33,6 @@ body.dark-mode header {
   background-color: var(--second_dark_bg);
   color: var(--dark_text);
 }
-body.dark-mode div#overlay {
-  opacity: 0.5;
-}
 body.dark-mode #logo > a {
   color: var(--dark_text);
 }
@@ -60,17 +59,8 @@ body.dark-mode #navbar .menu ul.dropit-submenu a:hover {
 body.dark-mode #navbar #navmenu li {
   background: var(--second_dark_bg);
 }
-body.dark-mode #description .express > a {
-  color: var(--dark_text);
-}
-body.dark-mode #install-command {
-  background: var(--main_dark_bg);
-}
-body.dark-mode #announcements {
-  background: var(--main_dark_bg);
-}
-body.dark-mode #boxes div > h3 {
-  color: var(--dark_text);
+body.dark-mode div#overlay {
+  opacity: 0.5;
 }
 @media (max-width: 899px) {
   #theme-icon-container {
@@ -106,30 +96,97 @@ body.dark-mode em,
 body.dark-mode strong {
   color: var(--dark_text);
 }
-
 body.dark-mode pre {
   background: var(--second_dark_bg);
 }
+/* index.html */
+body.dark-mode #description .express > a {
+  color: var(--dark_text);
+}
+body.dark-mode #install-command {
+  background: var(--main_dark_bg);
+}
+body.dark-mode #announcements {
+  background: var(--main_dark_bg);
+}
+body.dark-mode #boxes div > h3 {
+  color: var(--dark_text);
+}
+/* basic-routing.htlm */
 body.dark-mode [class*='language-'] {
   text-shadow: 0 1px var(--second_dark_bg);
 }
+/* js fat arrow operator */
 body.dark-mode .token.operator {
   background: inherit;
 }
+/* debugging.htlm */
 body.dark-mode table tr:first-child th {
   background-color: var(--second_dark_bg);
   color: var(--dark_text);
 }
+/* api pages */
 body.dark-mode #menu li > * {
   color: var(--dark_text);
 }
 body.dark-mode #menu li ul li > em {
-  color: silver;
+  color: var(--dark_header_text);
 }
 body.dark-mode #menu li ul li > a {
-  color: grey;
+  color: var(--dark_inner_text);
 }
-body.dark-mode table thead tr:first-child th {
+body.dark-mode #api-doc > h3 {
+  color: var(--dark_header_text);
+}
+body.dark-mode #api-doc section h5 {
+  color: var(--dark_header_text);
+}
+/* 
+overriding search-bar results drop down  
+*/
+body.dark-mode .ds-dropdown-menu .ds-dataset-1 {
+  background-color: var(--dark_bg);
+}
+body.dark-mode .ds-dropdown-menu .ds-dataset-1 .ds-suggestion a {
   background-color: var(--second_dark_bg);
   color: var(--dark_text);
 }
+body.dark-mode
+  .ds-dropdown-menu
+  .ds-dataset-1
+  .ds-suggestions
+  .algolia-docsearch-suggestion--category-header {
+  color: var(--dark_text);
+}
+body.dark-mode
+  .ds-dropdown-menu
+  .ds-dataset-1
+  .ds-suggestions
+  .algolia-docsearch-suggestion--wrapper
+  .algolia-docsearch-suggestion--subcategory-column {
+  color: var(--dark_header_text);
+}
+body.dark-mode
+  .ds-dropdown-menu
+  .ds-dataset-1
+  .ds-suggestions
+  .algolia-docsearch-suggestion--wrapper
+  .algolia-docsearch-suggestion--title {
+  color: var(--dark_text);
+}
+body.dark-mode
+  .ds-dropdown-menu
+  .ds-dataset-1
+  .ds-suggestions
+  .algolia-docsearch-suggestion--wrapper
+  .algolia-docsearch-suggestion--text {
+  color: var(--dark_text);
+}
+body.dark-mode
+  .ds-dropdown-menu
+  .ds-dataset-1
+  .ds-suggestions
+  .algolia-docsearch-suggestion--wrapper
+  .algolia-docsearch-suggestion--highlight {
+  color: var(--link);
+}