refactor(text): Remove telus-font-family mixin

And make styleguidist sidebar a bit wider to properly display DisplayHeading.Sup and DisplayHeading.Sub components
telus · Sep 5, 2017 · 4aa6d6c · 4aa6d6c
1 parent 8cc4c88
commit 4aa6d6c
Show file tree

Hide file tree

Showing 7 changed files with 6 additions and 20 deletions.
diff --git a/docs/index.html b/docs/index.html
@@ -7,6 +7,11 @@
   <link rel="favicon" href="/favicon.ico">
 </head>
 <body>
+  <style>
+    .sidebar-0-4{
+      width: 230px;
+    }
+  </style>
   <div id="app"></div>
 </body>
 </html>
diff --git a/src/components/Button/Button.modules.scss b/src/components/Button/Button.modules.scss
@@ -27,6 +27,7 @@ $button-text-color: $color-white;
 
   transition: background .2s;
 
+  font-family: $font-telus;
   composes: medium from '../Typography/Text/Text.modules.scss';
   composes: boldFont from '../Typography/Text/Text.modules.scss';
   text-align: center;

diff --git a/src/components/Link/ChevronLink/ChevronLink.modules.scss b/src/components/Link/ChevronLink/ChevronLink.modules.scss
@@ -2,7 +2,6 @@
 @import '../../../scss/settings/typography';
 
 .link {
-  @include telus-font-family;
   @include helvetica-neue-roman-55;
 
   composes: medium from '../../Typography/Text/Text.modules.scss';

diff --git a/src/components/Typography/DisplayHeading/DisplayHeading.modules.scss b/src/components/Typography/DisplayHeading/DisplayHeading.modules.scss
@@ -4,7 +4,6 @@
 @import '../../../scss/utility/responsive';
 
 .baseHeadingSupSubScripts {
-  @include telus-font-family;
   position: relative;
   vertical-align: baseline;
 }

diff --git a/src/components/Typography/Heading/Heading.modules.scss b/src/components/Typography/Heading/Heading.modules.scss
@@ -4,7 +4,6 @@
 @import '../../../scss/utility/responsive';
 
 .baseHeadingSupSubScripts {
-  @include telus-font-family;
   position: relative;
   vertical-align: baseline;
 }

diff --git a/src/components/Typography/Text/Text.modules.scss b/src/components/Typography/Text/Text.modules.scss
@@ -2,16 +2,11 @@
 @import '../../../scss/settings/typography';
 
 .baseSupSubScripts {
-  @include telus-font-family;
   position: relative;
   vertical-align: baseline;
   font-size: .875rem;
 }
 
-.fontFamily {
-  @include telus-font-family;
-}
-
 .sup {
   composes: baseSupSubScripts;
   top: -.5em;
@@ -38,8 +33,6 @@
 
 .smallFont {
   @include helvetica-neue-roman-55;
-
-  composes: fontFamily;
 }
 
 .medium {
@@ -50,8 +43,6 @@
 
 .mediumFont {
   @include helvetica-neue-light-45;
-
-  composes: fontFamily;
 }
 
 .large {
@@ -62,14 +53,10 @@
 
 .largeFont {
   @include helvetica-neue-light-45;
-
-  composes: fontFamily;
 }
 
 .boldFont {
   @include helvetica-neue-medium-65;
-
-  composes: fontFamily;
 }
 
 .color {

diff --git a/src/scss/settings/_typography.scss b/src/scss/settings/_typography.scss
@@ -15,10 +15,6 @@ $body-medium-line-height: 1.5; // 24px
 $body-small-text-size: 14px;
 $body-small-line-height: 1.71; // 24px
 
-@mixin telus-font-family {
-  font-family: $font-telus;
-}
-
 @mixin helvetica-neue-thin-35 {
   font-weight: 300;
 }