diff options
author | Sneha Patel <Snehaben.Patel@ibm.com> | 2021-05-24 22:11:26 +0300 |
---|---|---|
committer | Sneha Patel <Snehaben.Patel@ibm.com> | 2021-05-25 00:14:47 +0300 |
commit | e516d4d9e8d14a826cd98b1b8ce5f5b117597a5a (patch) | |
tree | ae4c5f6d5b4969c555b9f781c4c48e905ba994f1 /src/components/Global/TableToolbar.vue | |
parent | 71114feb9a800d42f6eeddfa477077a8ab8e44f6 (diff) | |
download | webui-vue-e516d4d9e8d14a826cd98b1b8ce5f5b117597a5a.tar.xz |
Add dividers between table batch action buttons
Signed-off-by: Sneha Patel <Snehaben.Patel@ibm.com>
Change-Id: I54ddce13b1fc02138f42141c636453f499d35b96
Diffstat (limited to 'src/components/Global/TableToolbar.vue')
-rw-r--r-- | src/components/Global/TableToolbar.vue | 20 |
1 files changed, 20 insertions, 0 deletions
diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue index 85c11a46..a9281748 100644 --- a/src/components/Global/TableToolbar.vue +++ b/src/components/Global/TableToolbar.vue @@ -96,6 +96,26 @@ $toolbar-height: 46px; padding: 0 $spacer; } +// Using v-deep to style export slot child-element +// depricated and vue-js 3 +.toolbar-actions ::v-deep .btn { + position: relative; + &:after { + content: ''; + position: absolute; + left: 0; + height: 1.5rem; + width: 1px; + background: rgba($white, 0.6); + } + &:last-child, + &:first-child { + &:after { + width: 0; + } + } +} + .slide-enter-active { transition: transform $duration--moderate-02 $entrance-easing--productive; } |