diff options
author | Sukanya Pandey <sukapan1@in.ibm.com> | 2020-09-14 18:18:39 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-10-07 01:06:28 +0300 |
commit | fde429e08a1643a9fab05131aaef563260743aa6 (patch) | |
tree | 2e89e043683d93dbc37738f21f06d85b50f88fa7 | |
parent | 5e9c391cab08fc34f85776427b35a82853e7b617 (diff) | |
download | webui-vue-fde429e08a1643a9fab05131aaef563260743aa6.tar.xz |
Add updated table styles
- Refer below link for styles:
https://ibm.invisionapp.com/share/D8O06PPE32B#/screens
Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com>
Change-Id: I6dcc3b8d0fb7ef19388b5bfeaf87fce78725b638
17 files changed, 34 insertions, 1 deletions
diff --git a/src/assets/styles/bmc/custom/_tables.scss b/src/assets/styles/bmc/custom/_tables.scss index b3ef0565..8b8c4a8e 100644 --- a/src/assets/styles/bmc/custom/_tables.scss +++ b/src/assets/styles/bmc/custom/_tables.scss @@ -17,6 +17,9 @@ .thead-light th { border: none; color: theme-color("dark"); + &:focus { + outline: none; + } } .status-icon svg { @@ -60,6 +63,17 @@ fill: theme-color("dark"); } } + .b-table-sort-icon-left { + background-position: left calc(1.5rem / 2) center !important; + padding-left: calc(1.2rem + 0.65em) !important; + &:focus { + outline: none; + box-shadow: inset 0 0 0 2px theme-color('primary') !important; + } + &:hover { + background-color: theme-color-dark('light'); + } + } } .b-table-sticky-header td { diff --git a/src/assets/styles/bmc/helpers/_functions.scss b/src/assets/styles/bmc/helpers/_functions.scss index 456caf36..57956c99 100644 --- a/src/assets/styles/bmc/helpers/_functions.scss +++ b/src/assets/styles/bmc/helpers/_functions.scss @@ -2,4 +2,8 @@ // theme variant color to use as a background color @function theme-color-light($variant) { @return theme-color-level($variant, -11.3); +} + +@function theme-color-dark($variant) { + @return theme-color-level($variant, 2); }
\ No newline at end of file diff --git a/src/views/AccessControl/Ldap/TableRoleGroups.vue b/src/views/AccessControl/Ldap/TableRoleGroups.vue index 8df87742..9daf1fd7 100644 --- a/src/views/AccessControl/Ldap/TableRoleGroups.vue +++ b/src/views/AccessControl/Ldap/TableRoleGroups.vue @@ -34,6 +34,7 @@ selectable show-empty no-select-on-click + hover no-sort-reset sort-icon-left :items="tableItems" diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue index 31cc3571..9978f4a7 100644 --- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue +++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue @@ -32,6 +32,7 @@ selectable show-empty no-select-on-click + hover :fields="fields" :items="tableItems" :empty-text="$t('global.table.emptyMessage')" diff --git a/src/views/AccessControl/LocalUserManagement/TableRoles.vue b/src/views/AccessControl/LocalUserManagement/TableRoles.vue index 6596c508..b4b366af 100644 --- a/src/views/AccessControl/LocalUserManagement/TableRoles.vue +++ b/src/views/AccessControl/LocalUserManagement/TableRoles.vue @@ -1,5 +1,5 @@ <template> - <b-table stacked="sm" small :items="items" :fields="fields"> + <b-table stacked="sm" hover small :items="items" :fields="fields"> <template v-slot:cell(administrator)="data"> <template v-if="data.value"> <checkmark20 /> diff --git a/src/views/AccessControl/SslCertificates/SslCertificates.vue b/src/views/AccessControl/SslCertificates/SslCertificates.vue index 57275956..bce50d72 100644 --- a/src/views/AccessControl/SslCertificates/SslCertificates.vue +++ b/src/views/AccessControl/SslCertificates/SslCertificates.vue @@ -56,6 +56,7 @@ <b-table responsive="md" show-empty + hover :fields="fields" :items="tableItems" :empty-text="$t('global.table.emptyMessage')" diff --git a/src/views/Configuration/NetworkSettings/NetworkSettings.vue b/src/views/Configuration/NetworkSettings/NetworkSettings.vue index 863f2ab8..4a181fd8 100644 --- a/src/views/Configuration/NetworkSettings/NetworkSettings.vue +++ b/src/views/Configuration/NetworkSettings/NetworkSettings.vue @@ -104,6 +104,7 @@ <b-col lg="9" class="mb-3"> <b-table responsive="md" + hover :fields="ipv4StaticTableFields" :items="form.ipv4StaticTableItems" class="mb-0" @@ -217,6 +218,7 @@ <b-col lg="4" class="mb-3"> <b-table responsive + hover :fields="dnsTableFields" :items="form.dnsStaticTableItems" class="mb-0" diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue index cf5d4787..af576521 100644 --- a/src/views/Health/EventLogs/EventLogs.vue +++ b/src/views/Health/EventLogs/EventLogs.vue @@ -47,6 +47,7 @@ selectable no-select-on-click sort-icon-left + hover no-sort-reset sort-desc show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue b/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue index 91aeac78..1c8bb974 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue @@ -2,6 +2,7 @@ <page-section :section-title="$t('pageHardwareStatus.bmcManager')"> <b-table responsive="md" + hover :items="items" :fields="fields" show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue index 8fdcbfde..961396a2 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue @@ -2,6 +2,7 @@ <page-section :section-title="$t('pageHardwareStatus.chassis')"> <b-table responsive="md" + hover :items="chassis" :fields="fields" show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue index b72a6cc2..76ef2b63 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue @@ -17,6 +17,7 @@ <b-table sort-icon-left no-sort-reset + hover sort-by="health" responsive="md" show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue index f35ab9d2..e955eda3 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue @@ -17,6 +17,7 @@ <b-table sort-icon-left no-sort-reset + hover responsive="md" sort-by="health" show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue index 51b579ed..4d57feca 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue @@ -17,6 +17,7 @@ <b-table sort-icon-left no-sort-reset + hover responsive="md" sort-by="health" show-empty diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue index 6b2648b5..0b2ee60e 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue @@ -18,6 +18,7 @@ <b-table sort-icon-left no-sort-reset + hover responsive="md" show-empty :items="processors" diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue index 724f1c8a..89ae5118 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue @@ -2,6 +2,7 @@ <page-section :section-title="$t('pageHardwareStatus.system')"> <b-table responsive="md" + hover show-empty :items="systems" :fields="fields" diff --git a/src/views/Health/Sensors/Sensors.vue b/src/views/Health/Sensors/Sensors.vue index 7f25025b..66bb7d50 100644 --- a/src/views/Health/Sensors/Sensors.vue +++ b/src/views/Health/Sensors/Sensors.vue @@ -39,6 +39,7 @@ selectable no-select-on-click sort-icon-left + hover no-sort-reset sticky-header="75vh" sort-by="status" diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue index a194039b..ac39a2b3 100644 --- a/src/views/Overview/OverviewEvents.vue +++ b/src/views/Overview/OverviewEvents.vue @@ -12,6 +12,7 @@ per-page="5" sort-by="id" sort-desc + hover responsive="md" stacked="sm" show-empty |