[UI] adding Monospace font (#1133)

Signed-off-by: Scott Mathis <[email protected]> [UI] fixing override issue caused by AOT Signed-off-by: Scott Mathis <[email protected]> [wip] update gemini tests Signed-off-by: Scott Mathis <[email protected]>
vmware-archive · Jul 5, 2017 · aa9cf3d · aa9cf3d
1 parent 6b7342e
commit aa9cf3d
Show file tree

Hide file tree

Showing 7 changed files with 5 additions and 0 deletions.
diff --git a/gemini/screens/tree-view/Tree View - Basic/default/chrome.png b/gemini/screens/tree-view/Tree View - Basic/default/chrome.png
diff --git a/gemini/screens/wizard/custom-danger-button/default/chrome.png b/gemini/screens/wizard/custom-danger-button/default/chrome.png
diff --git a/gemini/screens/wizard/dynamic-wizard/default/chrome.png b/gemini/screens/wizard/dynamic-wizard/default/chrome.png
diff --git a/gemini/screens/wizard/form-alert/default/chrome.png b/gemini/screens/wizard/form-alert/default/chrome.png
diff --git a/gemini/screens/wizard/form-validation/default/chrome.png b/gemini/screens/wizard/form-validation/default/chrome.png
diff --git a/src/clarity-angular/code/syntax-highlight/_code.clarity.scss b/src/clarity-angular/code/syntax-highlight/_code.clarity.scss
@@ -4,6 +4,7 @@
 
 @include exports('code.clarity') {
     //Styles for Clarity Code Snippets
+
     pre, pre[class*="language-"] {
         margin: $clr_baselineRem_0_5 0;
     }
@@ -21,6 +22,9 @@
 
     //Overriding PrismJS code styles
     :not(pre) > code[class*="language-"], pre[class*="language-"], pre, code[class*="language-"] {
+        // aot is allowing prism to push its styles below ours; using important here instead of
+        // an extra layer of specificity due to the nature of code/pre tags.
+        font-family: $clr-monoFont !important;
         line-height: $clr_baselineRem_1;
         padding: 0;
     }

diff --git a/src/clarity-angular/utils/_variables.clarity.scss b/src/clarity-angular/utils/_variables.clarity.scss
@@ -43,6 +43,7 @@ $clr-breakpoints: (
 //1. Fonts Options
 $clr-font: Metropolis, 'Avenir Next', 'Helvetica Neue', Arial, sans-serif !default; //Default font stack for Clarity
 $clr-altFont: $clr-font !default; //TODO: TBD. Alternative font for Clarity
+$clr-monoFont: Consolas, Monaco, Courier, monospace !default;
 $clr-font-base-size: 14 !default;
 $clr-font-size: unquote($clr-font-base-size+'px') !default;
 $clr-rem-denominator: $clr-font-base-size !default;