[FEATURE] Introduce datatable severity

TYPO3GmbH · Jan 31, 2020 · d5f6156 · d5f6156
1 parent 8eac6a1
commit d5f6156
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 13 deletions.
diff --git a/assets/css/modules/_datatable.scss b/assets/css/modules/_datatable.scss
@@ -65,43 +65,54 @@ $table-sorting-icon-descending: '<svg viewBox="0 0 16 16"><g fill="#{$table-high
         td {
             border-top: 1px solid #e0e3e4;
         }
-
         th {
             font-weight: normal;
-            background-color: rgba(224, 227, 228, 0.3);
+            background-color: rgba(0, 0, 0, 0.025);
         }
-
         tr {
             &:nth-child(odd) {
                 background-color: rgba(245, 245, 246, 0.5);
             }
-
             &:hover {
                 background-color: $table-row-hover-bg;
                 color: $table-row-hover-color;
-
-                th {
-                    background-color: darken($table-row-hover-bg, 3%);
-                }
-
                 th,
                 td {
                     border-top: 1px solid darken($table-row-hover-bg, 5%);
                 }
-
                 a:not(.datatable-action) {
                     border-bottom-color: inherit;
                 }
-
                 .datatable-link-highlight {
                     color: inherit;
                 }
-
                 .datatable-action {
                     background-color: #fff;
                     color: $table-text;
                 }
             }
+            @each $name, $value in $theme-colors {
+                &.datatable-severity-#{$name} {
+                    background-color: theme-color-level($name, -10);
+                    color: color-yiq(theme-color-level($name, -10));
+                    th,
+                    td {
+                        border-top: 1px solid darken(theme-color-level($name, -10), 5%);
+                    }
+                    &:nth-child(odd) {
+                        background-color: theme-color-level($name, -8);
+                        color: color-yiq(theme-color-level($name, -8));
+                    }
+                    &:hover {
+                        background-color: theme-color($name);
+                        color: color-yiq(theme-color($name));
+                        th,
+                        td {
+                            border-top: 1px solid darken(theme-color($name), 5%);
+                        }
+                    }
+                }
+            }
         }
     }
 

diff --git a/src/Resources/public/app.css b/src/Resources/public/app.css