diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2019-12-30 20:06:45 +0300 |
---|---|---|
committer | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-01-29 01:18:05 +0300 |
commit | 996d2d57be172fd36952ec7d679e411565cac013 (patch) | |
tree | f8d0ff86f77c5c930ec23803b6d7a4ca2e952ecc /src | |
parent | 71ac230a533fdd4819a8d36b82570285a0973b97 (diff) | |
download | webui-vue-996d2d57be172fd36952ec7d679e411565cac013.tar.xz |
Update button variant styles
Adding styles to leverage bootstrap-vue button components.
Using the link variant as a replacement for our current 'ghost'
button style. Use $enable-rounded flag to disable rounded
corners. This will take care of all components with rounded
corners (input fields, modals, etc).
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ie48f19a76698f896d9ebe7e72e9c0575f6db80c1
Diffstat (limited to 'src')
-rw-r--r-- | src/assets/styles/_buttons.scss | 27 | ||||
-rw-r--r-- | src/assets/styles/_obmc-custom.scss | 4 | ||||
-rw-r--r-- | src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue | 4 |
3 files changed, 33 insertions, 2 deletions
diff --git a/src/assets/styles/_buttons.scss b/src/assets/styles/_buttons.scss new file mode 100644 index 00000000..02b0caea --- /dev/null +++ b/src/assets/styles/_buttons.scss @@ -0,0 +1,27 @@ +.btn { + font-weight: $headings-font-weight; + svg { + vertical-align: sub; + margin-left: $spacer / 2; + } +} + +.btn-primary { + fill: $white; +} + +.btn-secondary { + fill: $white; + @extend .btn-secondary-dark; +} + +.btn-link { + fill: $primary; + text-decoration: none !important; + &:focus { + box-shadow: $btn-focus-box-shadow; + } + &:hover { + fill: darken($primary, 15%); + } +}
\ No newline at end of file diff --git a/src/assets/styles/_obmc-custom.scss b/src/assets/styles/_obmc-custom.scss index 7deb6cba..e87e01bb 100644 --- a/src/assets/styles/_obmc-custom.scss +++ b/src/assets/styles/_obmc-custom.scss @@ -1,3 +1,5 @@ +$enable-rounded: false; + // Required @import "~bootstrap/scss/functions"; @import "./functions"; @@ -49,3 +51,5 @@ $colors: map-remove($theme-colors, "light", "dark"); @import "~bootstrap/scss/print"; @import "~bootstrap-vue/src/index.scss"; + +@import "./buttons";
\ No newline at end of file diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue index bc2200e6..6ca43f32 100644 --- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue +++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue @@ -4,12 +4,12 @@ <b-row> <b-col lg="10"> <b-button @click="initModalSettings" variant="link"> - <icon-settings /> Account policy settings + <icon-settings /> </b-button> <b-button @click="initModalUser(null)" variant="primary"> - <icon-add /> Add user + <icon-add /> </b-button> </b-col> </b-row> |