Merge pull request #781 from NASA-IMPACT/74-dropdown-darkmode-styling

74: all dropdowns now styled for dark mode
NASA-IMPACT · May 31, 2024 · 8070002 · 8070002
2 parents 8769a05 + 03bcf63
commit 8070002
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 7 deletions.
diff --git a/sde_indexing_helper/static/css/candidate_url_list.css b/sde_indexing_helper/static/css/candidate_url_list.css
@@ -41,8 +41,9 @@
     white-space: nowrap;
     font-family: sans-serif;
     background: #FFF;
-    color: #333;
+    color: white;
     border-radius: 5px;
+    background-color:#15232E;
 }
 
 .custom-menu li {
@@ -51,7 +52,7 @@
 }
 
 .custom-menu li:hover {
-    background-color: #DEF;
+    background-color: #0066CA;
 }
 
 .pattern_type {
@@ -273,6 +274,11 @@ letter-spacing: -0.02em;
     white-space: normal;
 }
 
+.selected{
+    background-color: inherit !important;
+}
+
+
 div.dt-buttons .btn.processing:after {
     border: 2px solid #FFFFFF !important;
     border-left-color: transparent !important;

diff --git a/sde_indexing_helper/static/css/project.css b/sde_indexing_helper/static/css/project.css
@@ -244,6 +244,22 @@ body {
   border-color: #A7BACD !important;
  }
 
+ .dropdown-menu{
+  background-color:#15232E;
+  border:1px solid #A7BACD;
+  font-size: 16px;
+  font-weight: 500;
+  letter-spacing: -0.02em;
+ }
+
+ .dropdown-item{
+  color:white !important;
+ }
+
+ .dropdown-item:hover{
+  background-color:#0066CA !important;
+ }
+
  .customizeColumnContainer{
   background-color: #15232E !important;
  }
@@ -252,6 +268,7 @@ body {
   font-family: sans-serif;
   font-size:14px;
  }
+
 .user-bubble {
   width: 30px;
   height: 30px;

diff --git a/sde_indexing_helper/static/js/candidate_url_list.js b/sde_indexing_helper/static/js/candidate_url_list.js
@@ -108,10 +108,6 @@ function initializeDataTable() {
         },
       },
     ],
-    select: {
-      style: "os",
-      selector: "td:nth-child(5)",
-    },
     rowId: "url",
     stateLoadCallback: function (settings) {
       var state = JSON.parse(
@@ -672,7 +668,7 @@ function getDocumentTypeColumn() {
       button_text = data ? dict[data] : "Select";
       button_color = data ? "btn-success" : "btn-secondary";
       return `
-            <div class="dropdown document_type_dropdown " data-match-pattern=${remove_protocol(
+            <div  data-match-pattern=${remove_protocol(
               row["url"]
             )}>
               <button class="btn ${button_color} btn-sm dropdown-toggle selectStyling" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">