From be88c61e6aedd361f1583f33152190ea6118fef1 Mon Sep 17 00:00:00 2001
From: Dixsie Wolmers <dixsie@ibm.com>
Date: Mon, 20 Jul 2020 13:29:54 -0500
Subject: 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
---
 src/assets/styles/bmc/custom/_base.scss | 43 +++++++++++++++++++++++++++++++++
 src/components/Global/PageSection.vue   |  2 +-
 src/components/Global/PageTitle.vue     |  4 ---
 src/components/Global/TableFilter.vue   |  3 ---
 src/views/Overview/OverviewNetwork.vue  |  4 +--
 5 files changed, 46 insertions(+), 10 deletions(-)

(limited to 'src')

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>
-- 
cgit v1.2.3