From 26ffd50381fed6db672b265990caa12d4d98d272 Mon Sep 17 00:00:00 2001 From: Ian Grindley Date: Fri, 9 Aug 2019 12:38:46 +0100 Subject: Make column classes less verbose .cols shorthand for .columns [class~="col-"] Removes the need to add 'column' to the column class attribute --- src/_layout.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/_layout.scss b/src/_layout.scss index 1f6b77c..e6bad9a 100644 --- a/src/_layout.scss +++ b/src/_layout.scss @@ -39,6 +39,7 @@ } // Responsive grid system +.cols, .columns { display: flex; flex-wrap: wrap; @@ -59,6 +60,7 @@ overflow-x: auto; } } +[class~="col-"], .column { flex: 1; max-width: 100%; -- cgit v1.2.3 From 8ebe2b973384486ffe063ec40fe657ef5e30c035 Mon Sep 17 00:00:00 2001 From: Ian Grindley Date: Fri, 9 Aug 2019 12:43:56 +0100 Subject: Add additional text helper functions .text-muted similar to Bootstrap, adds a slight fade to the text Added text size utilities text-small and text-tiny Added new classes to docs --- docs/utilities/text.html | 7 +++++++ src/utilities/_text.scss | 12 ++++++++++++ 2 files changed, 19 insertions(+) diff --git a/docs/utilities/text.html b/docs/utilities/text.html index 81d3575..476c46f 100644 --- a/docs/utilities/text.html +++ b/docs/utilities/text.html @@ -234,8 +234,15 @@ <div class="text-bold"></div> <!-- Italicized text --> <div class="text-italic"></div> +<!-- Muted text --> +<div class="text-muted"></div> <!-- Larger text (120%) --> <div class="text-large"></div> +<!-- Smaller text (90%) --> +<div class="text-small"></div> +<!-- Tiny text (80%) --> +<div class="text-tiny"></div> + <!-- Overflow behavior: display an ellipsis to represent clipped text --> <div class="text-ellipsis"></div> diff --git a/src/utilities/_text.scss b/src/utilities/_text.scss index 67793ac..fa1cbd8 100644 --- a/src/utilities/_text.scss +++ b/src/utilities/_text.scss @@ -46,6 +46,18 @@ font-size: 1.2em; } +.text-small { + font-size: 0.9em; +} + +.text-tiny { + font-size: 0.8em; +} + +.text-muted { + opacity: 0.8; +} + // Text overflow utilities .text-ellipsis { @include text-ellipsis(); -- cgit v1.2.3 From c9c6f0bf951d6231eac16ad763e5c8df59013b18 Mon Sep 17 00:00:00 2001 From: Ian Grindley Date: Fri, 9 Aug 2019 12:47:59 +0100 Subject: Fixes for Hound Line should be indented 2 spaces, but was indented 4 spaces Removed leading zeros --- src/utilities/_text.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/utilities/_text.scss b/src/utilities/_text.scss index fa1cbd8..5796905 100644 --- a/src/utilities/_text.scss +++ b/src/utilities/_text.scss @@ -47,15 +47,15 @@ } .text-small { - font-size: 0.9em; + font-size: .9em; } .text-tiny { - font-size: 0.8em; + font-size: .8em; } .text-muted { - opacity: 0.8; + opacity: .8; } // Text overflow utilities -- cgit v1.2.3