diff options
author | Dixsie Wolmers <dixsie@ibm.com> | 2020-07-20 21:29:54 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-07-23 22:39:24 +0300 |
commit | be88c61e6aedd361f1583f33152190ea6118fef1 (patch) | |
tree | f2d7cc31f1b8e4947ca1d65eed175682136b59d6 /src | |
parent | 2a934977dd03d2dd0539ecb0cb2673d7973b6d75 (diff) | |
download | webui-vue-be88c61e6aedd361f1583f33152190ea6118fef1.tar.xz |
Update global typography
Updated the following body, label, and heading
styles to match new style guide:
- Font sizes
- Font weight
- Line height
- Color
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I014c968f6542b697fec8c3b9af781e64ac10794d
Diffstat (limited to 'src')
-rw-r--r-- | src/assets/styles/bmc/custom/_base.scss | 43 | ||||
-rw-r--r-- | src/components/Global/PageSection.vue | 2 | ||||
-rw-r--r-- | src/components/Global/PageTitle.vue | 4 | ||||
-rw-r--r-- | src/components/Global/TableFilter.vue | 3 | ||||
-rw-r--r-- | src/views/Overview/OverviewNetwork.vue | 4 |
5 files changed, 46 insertions, 10 deletions
diff --git a/src/assets/styles/bmc/custom/_base.scss b/src/assets/styles/bmc/custom/_base.scss index 5a6a11ba..c11e046c 100644 --- a/src/assets/styles/bmc/custom/_base.scss +++ b/src/assets/styles/bmc/custom/_base.scss @@ -4,4 +4,47 @@ label { color: gray("800"); font-size: 14px; font-weight: 400; + line-height: 1.4285; +} + +h1, +.h1 { + font-size: 2.625rem; + font-weight: 300; + line-height: 1.238; +} + +h2, +.h2 { + font-size: 2.25rem; + font-weight: 300; + line-height: 1.3333; +} + +h3, +.h3 { + font-size: 1.75rem; + font-weight: 400; + line-height: 1.2857; +} + +h4, +.h4 { + font-size: 1.25rem; + font-weight: 400; + line-height: 1.3; +} + +h5, +.h5 { + font-size: 1rem; + font-weight: 500; + line-height: 1.375; +} + +h6, +.h6 { + font-size: 0.875rem; + font-weight: 500; + line-height: 1.2857; } diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue index 6f44a3a3..96f7134e 100644 --- a/src/components/Global/PageSection.vue +++ b/src/components/Global/PageSection.vue @@ -25,7 +25,7 @@ export default { } h2 { - @include font-size($h4-font-size); + @include font-size($h3-font-size); margin-bottom: $spacer; &::after { content: ''; diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue index c4a97754..dc0738e2 100644 --- a/src/components/Global/PageTitle.vue +++ b/src/components/Global/PageTitle.vue @@ -28,10 +28,6 @@ export default { .page-title { margin-bottom: $spacer * 2; } -h1 { - font-weight: $display4-weight; - line-height: $display-line-height; -} p { max-width: 72ch; } diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue index afbe8a73..b514483f 100644 --- a/src/components/Global/TableFilter.vue +++ b/src/components/Global/TableFilter.vue @@ -133,9 +133,6 @@ export default { <style lang="scss" scoped> @import 'src/assets/styles/helpers'; -p { - font-size: 1.2rem; -} .badge { margin-right: $spacer / 2; } diff --git a/src/views/Overview/OverviewNetwork.vue b/src/views/Overview/OverviewNetwork.vue index a495fae2..70a84749 100644 --- a/src/views/Overview/OverviewNetwork.vue +++ b/src/views/Overview/OverviewNetwork.vue @@ -8,9 +8,9 @@ v-else :key="ethernetInterface.id" > - <p class="h6 interface-name font-weight-bold"> + <h3 class="h5 interface-name font-weight-bold"> {{ ethernetInterface.Id }} - </p> + </h3> <b-row> <b-col md="12" lg="4"> <dl> |