diff options
author | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-08-03 10:39:44 +0300 |
---|---|---|
committer | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-08-03 10:39:44 +0300 |
commit | 9797c509f97e539d5ea6ef25a5e9be1c05d15303 (patch) | |
tree | 89838d0cd2581e0a5ba335b786e1fd0feaa71389 /src/assets/styles/bmc | |
parent | 58860854beb269e6fa3d62e08be2c9ebb95997f2 (diff) | |
download | webui-vue-9797c509f97e539d5ea6ef25a5e9be1c05d15303.tar.xz |
add style for fullscreen table, fix responsive tables
Diffstat (limited to 'src/assets/styles/bmc')
-rw-r--r-- | src/assets/styles/bmc/_sila/_tables.scss | 58 |
1 files changed, 54 insertions, 4 deletions
diff --git a/src/assets/styles/bmc/_sila/_tables.scss b/src/assets/styles/bmc/_sila/_tables.scss index bbb89f16..c9977905 100644 --- a/src/assets/styles/bmc/_sila/_tables.scss +++ b/src/assets/styles/bmc/_sila/_tables.scss @@ -153,9 +153,16 @@ [class*="table-responsive-"] { @include media-breakpoint-up(lg) { overflow: auto; - width: calc(100vw - 345px); - border-right: 1px solid $gray-10; - border-radius: $border-radius; + width: calc(100vw - 346px); + .table { + border-right: 1px solid $gray-30; + border-radius: $border-radius; + } + .table-accessory, + .table-full { + border-right: none; + border-radius: 0px; + } } } @@ -166,7 +173,6 @@ tr { &:not(:first-child) > td[aria-colindex="1"] { - // border-top: 1px solid $gray-10; padding-top: 0.625rem; } @@ -236,11 +242,55 @@ padding: 2px; } td { + white-space: nowrap; font-size: 0.745rem; color: $text-tretiatry; } .thead-light th > div { font-size: 0.755rem !important; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + width: 90%; + } + @include media-breakpoint-down(md) { + overflow-y: auto; + width: 100vw; + } +} + +.table-full { + border-left: none; + border-right: none; + border-radius: 0; + border-top: 1px solid $gray-30; + + thead th { + border-bottom: 1px solid $gray-30; + border: none; + &:first-child { + border-radius: 0; + } + &:last-child { + border-radius: 0; + } + } +} + +.full-table-container { + & > [class*="table-responsive-"] { + overflow: auto; + width: calc(100vw - 280px); + margin-left: -1.97rem; + margin-right: -1.95rem; + border-radius: 0; + @include media-breakpoint-down(lg) { + margin-left: -2.2rem; + } + @include media-breakpoint-down(md) { + margin-left: -1.2rem; + width: 100vw; + } } } |