Merge pull request meshery#10402 from ayush844/bug/ayush844/10351

solves hover effect issue in dark mode
captain-Akshay · Mar 16, 2024 · f203f4c · f203f4c
2 parents 73accfe + 7c45260
commit f203f4c
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 3 deletions.
diff --git a/docs/_layouts/past-results-layout.html b/docs/_layouts/past-results-layout.html
@@ -54,9 +54,8 @@ <h2>{{page.subheading}} Integration Tests</h2>
 </script>
 
 <style>
-  td:hover,
-  tr:hover {
-    background-color: #ccfff9;
+  td.details table tr:hover td{
+    background-color: var(--hidden-details-data-color) !important;
     cursor: pointer;
   }
   td.details {

diff --git a/docs/_sass/root-variables.scss b/docs/_sass/root-variables.scss
@@ -59,6 +59,10 @@
   --background-grey-secondary: linear-gradient(to right top, #868e96, #767e86, #676e76, #585f66, #495057);
   --background-neumorphic: #ecf0f3;
 
+  // table color
+  --test-detail-data-color: #ccfff9;
+  --hidden-details-data-color: #ccfff9;
+
   // Gradients
   --section-button: linear-gradient(315deg, #3C494F 0%, rgba(70, 86, 93, 1) 87%);
 
@@ -87,6 +91,10 @@
   --color-summary-background-hover:#666666;
   --color-details-background:#282828;
 
+  // table color
+  --test-detail-data-color: #495057;
+  --hidden-details-data-color: #00B39F;
+
   --box-shadow-primary: 4px 4px 8px rgba(0, 0, 0, 1);
   --box-shadow-primary-light: 2px 2px 8px rgb(0 0 0 / 70%);
   --box-shadow-primary-left: -4px 8px 8px rgb(0 0 0 / 10%);

diff --git a/docs/_sass/table.scss b/docs/_sass/table.scss
@@ -498,4 +498,9 @@ table.tablesorter th.headerSortUp {
 
 td.details, .hidden-details > td {
   background-color: var(--color-primary-dark) !important;
+}
+
+tr.test-details td:not(:first-child):hover{
+  background-color: var(--test-detail-data-color) !important;
+  cursor: pointer;
 }