Update use of Sass variables for better theming
Use Bootstrap color functions for theme-colors and grays instead
of directly referencing Sass variable to allow more flexible
theming.
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Id08b77ff6df3bdf99400dcdfe964853706f1070f
diff --git a/src/assets/styles/bmc/custom/_tables.scss b/src/assets/styles/bmc/custom/_tables.scss
index b20feb0..52bdcff 100644
--- a/src/assets/styles/bmc/custom/_tables.scss
+++ b/src/assets/styles/bmc/custom/_tables.scss
@@ -3,20 +3,20 @@
z-index: $zindex-dropdown;
td {
- border-top: 1px solid $gray-300;
- border-bottom: 1px solid $gray-300;
+ border-top: 1px solid gray("300");
+ border-bottom: 1px solid gray("300");
&:first-of-type {
- border-left: 1px solid $gray-300;
+ border-left: 1px solid gray("300");
}
&:last-of-type {
- border-right: 1px solid $gray-300;
+ border-right: 1px solid gray("300");
}
}
// thead-light added for specificiy
.thead-light th {
border: none;
- color: $dark;
+ color: theme-color("dark");
}
.status-icon svg {
@@ -34,7 +34,7 @@
}
.b-table-details {
- background-color: $light;
+ background-color: theme-color("light");
td {
padding-left: calc(50px + (#{$table-cell-padding} * 2));
}
@@ -57,7 +57,7 @@
width: 50px;
}
svg {
- fill: $dark;
+ fill: theme-color("dark");
}
}
}
\ No newline at end of file