From d97303d03ddfd6d03072595eb5003c312e12951d Mon Sep 17 00:00:00 2001
From: Pieter Ouwerkerk <pieter.ouwerkerk@gmail.com>
Date: Thu, 28 Oct 2021 18:14:59 -0500
Subject: [PATCH 1/2] Add unindent function to scss-docs shortcode

---
 site/layouts/shortcodes/scss-docs.html | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/site/layouts/shortcodes/scss-docs.html b/site/layouts/shortcodes/scss-docs.html
index 3d1cd09a5d..d234d9ebf2 100644
--- a/site/layouts/shortcodes/scss-docs.html
+++ b/site/layouts/shortcodes/scss-docs.html
@@ -6,11 +6,13 @@
 
   Optional parameters:
     * strip-default: Remove the ` !default` flag from variable assignments - default: `true`
+    * unindent: Remove indentation by `n` spaces - default: `0`
 */ -}}
 
 {{- $name := .Get "name" -}}
 {{- $file := .Get "file" -}}
 {{- $strip_default := .Get "strip-default" | default "true" -}}
+{{- $unindent := .Get "unindent" | default 0 -}}
 
 {{- /* If any parameters are missing, print an error and exit */ -}}
 {{- if or (not $name) (not $file) -}}
@@ -39,5 +41,16 @@
     {{- $match = replace $match " !default" "" -}}
   {{- end -}}
 
-  {{- highlight $match "scss" "" -}}
+  {{- $output := "" -}}
+  {{- if (gt $unindent 0) -}}
+    {{- $prefix := (strings.Repeat $unindent " ") -}}
+    {{- range $line := split $match "\n" -}}
+      {{- $line = strings.TrimPrefix $prefix $line -}}
+      {{ $output = printf "%s%s\n" $output $line }}
+    {{- end -}}
+    {{- $output = chomp $output -}}
+  {{- else -}}
+    {{- $output = $match -}}
+  {{- end -}}
+  {{- highlight $output "scss" "" -}}
 {{- end -}}
-- 
GitLab


From 38faab0321a75e61db27123fb80fe6e64e9df34a Mon Sep 17 00:00:00 2001
From: Pieter Ouwerkerk <pieter.ouwerkerk@gmail.com>
Date: Thu, 28 Oct 2021 18:15:45 -0500
Subject: [PATCH 2/2] Unindent Utilities API examples

---
 site/content/docs/5.1/utilities/background.md     | 2 +-
 site/content/docs/5.1/utilities/borders.md        | 4 ++--
 site/content/docs/5.1/utilities/colors.md         | 2 +-
 site/content/docs/5.1/utilities/display.md        | 2 +-
 site/content/docs/5.1/utilities/flex.md           | 2 +-
 site/content/docs/5.1/utilities/float.md          | 2 +-
 site/content/docs/5.1/utilities/interactions.md   | 2 +-
 site/content/docs/5.1/utilities/opacity.md        | 2 +-
 site/content/docs/5.1/utilities/overflow.md       | 2 +-
 site/content/docs/5.1/utilities/position.md       | 2 +-
 site/content/docs/5.1/utilities/shadows.md        | 2 +-
 site/content/docs/5.1/utilities/sizing.md         | 2 +-
 site/content/docs/5.1/utilities/spacing.md        | 2 +-
 site/content/docs/5.1/utilities/text.md           | 2 +-
 site/content/docs/5.1/utilities/vertical-align.md | 2 +-
 site/content/docs/5.1/utilities/visibility.md     | 2 +-
 16 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/site/content/docs/5.1/utilities/background.md b/site/content/docs/5.1/utilities/background.md
index 61c27365b1..33afec799e 100644
--- a/site/content/docs/5.1/utilities/background.md
+++ b/site/content/docs/5.1/utilities/background.md
@@ -121,4 +121,4 @@ And background color opacities build on that with their own map that's consumed
 
 Background utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-bg-color" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-bg-color" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/borders.md b/site/content/docs/5.1/utilities/borders.md
index 6ba1174c9d..c69cbdbf50 100644
--- a/site/content/docs/5.1/utilities/borders.md
+++ b/site/content/docs/5.1/utilities/borders.md
@@ -94,6 +94,6 @@ Use the scaling classes for larger or smaller rounded corners. Sizes range from
 
 Border utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-borders" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-borders" file="scss/_utilities.scss" unindent=4 >}}
 
-{{< scss-docs name="utils-border-radius" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-border-radius" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/colors.md b/site/content/docs/5.1/utilities/colors.md
index 60462070b4..e8a9699542 100644
--- a/site/content/docs/5.1/utilities/colors.md
+++ b/site/content/docs/5.1/utilities/colors.md
@@ -110,4 +110,4 @@ And color opacities build on that with their own map that's consumed by the util
 
 Color utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-color" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-color" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/display.md b/site/content/docs/5.1/utilities/display.md
index 9e5a5dfb2d..2f25771f55 100644
--- a/site/content/docs/5.1/utilities/display.md
+++ b/site/content/docs/5.1/utilities/display.md
@@ -157,4 +157,4 @@ The print and display classes can be combined.
 
 Display utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-display" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-display" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/flex.md b/site/content/docs/5.1/utilities/flex.md
index bbb1824b43..c4adb0491c 100644
--- a/site/content/docs/5.1/utilities/flex.md
+++ b/site/content/docs/5.1/utilities/flex.md
@@ -662,4 +662,4 @@ And say you want to vertically center the content next to the image:
 
 Flexbox utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-flex" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-flex" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/float.md b/site/content/docs/5.1/utilities/float.md
index a18c21471c..76b1d72187 100644
--- a/site/content/docs/5.1/utilities/float.md
+++ b/site/content/docs/5.1/utilities/float.md
@@ -45,4 +45,4 @@ Here are all the support classes:
 
 Float utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-float" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-float" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/interactions.md b/site/content/docs/5.1/utilities/interactions.md
index 35ea2b9959..a67c9f0278 100644
--- a/site/content/docs/5.1/utilities/interactions.md
+++ b/site/content/docs/5.1/utilities/interactions.md
@@ -39,4 +39,4 @@ If possible, the simpler solution is:
 
 Interaction utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-interaction" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-interaction" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/opacity.md b/site/content/docs/5.1/utilities/opacity.md
index a2fdc38071..6bb8b82afd 100644
--- a/site/content/docs/5.1/utilities/opacity.md
+++ b/site/content/docs/5.1/utilities/opacity.md
@@ -27,4 +27,4 @@ Set the `opacity` of an element using `.opacity-{value}` utilities.
 
 Opacity utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-opacity" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-opacity" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/overflow.md b/site/content/docs/5.1/utilities/overflow.md
index a36374cd55..d4ea0d18d7 100644
--- a/site/content/docs/5.1/utilities/overflow.md
+++ b/site/content/docs/5.1/utilities/overflow.md
@@ -37,4 +37,4 @@ Using Sass variables, you may customize the overflow utilities by changing the `
 
 Overflow utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-overflow" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-overflow" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/position.md b/site/content/docs/5.1/utilities/position.md
index 46e62dd36f..e11478eb07 100644
--- a/site/content/docs/5.1/utilities/position.md
+++ b/site/content/docs/5.1/utilities/position.md
@@ -127,4 +127,4 @@ Default position utility values are declared in a Sass map, then used to generat
 
 Position utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-position" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-position" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/shadows.md b/site/content/docs/5.1/utilities/shadows.md
index bb5ef44abb..d8f563d530 100644
--- a/site/content/docs/5.1/utilities/shadows.md
+++ b/site/content/docs/5.1/utilities/shadows.md
@@ -27,4 +27,4 @@ While shadows on components are disabled by default in Bootstrap and can be enab
 
 Shadow utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-shadow" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-shadow" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/sizing.md b/site/content/docs/5.1/utilities/sizing.md
index 962575ffe3..bea50a539c 100644
--- a/site/content/docs/5.1/utilities/sizing.md
+++ b/site/content/docs/5.1/utilities/sizing.md
@@ -57,4 +57,4 @@ You can also use utilities to set the width and height relative to the viewport.
 
 Sizing utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-sizing" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-sizing" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/spacing.md b/site/content/docs/5.1/utilities/spacing.md
index 70fbe76945..18ffd01d8a 100644
--- a/site/content/docs/5.1/utilities/spacing.md
+++ b/site/content/docs/5.1/utilities/spacing.md
@@ -122,4 +122,4 @@ Spacing utilities are declared via Sass map and then generated with our utilitie
 
 Spacing utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-spacing" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-spacing" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/text.md b/site/content/docs/5.1/utilities/text.md
index be8e0e1c02..b3c01804c9 100644
--- a/site/content/docs/5.1/utilities/text.md
+++ b/site/content/docs/5.1/utilities/text.md
@@ -151,4 +151,4 @@ Font-size utilities are generated from this map, in combination with our utiliti
 
 Font and text utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-text" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-text" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/vertical-align.md b/site/content/docs/5.1/utilities/vertical-align.md
index 9fe0eeb932..1517417c02 100644
--- a/site/content/docs/5.1/utilities/vertical-align.md
+++ b/site/content/docs/5.1/utilities/vertical-align.md
@@ -45,4 +45,4 @@ With table cells:
 
 Vertical align utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-vertical-align" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-vertical-align" file="scss/_utilities.scss" unindent=4 >}}
diff --git a/site/content/docs/5.1/utilities/visibility.md b/site/content/docs/5.1/utilities/visibility.md
index 61eb302418..520027476b 100644
--- a/site/content/docs/5.1/utilities/visibility.md
+++ b/site/content/docs/5.1/utilities/visibility.md
@@ -34,4 +34,4 @@ Apply `.visible` or `.invisible` as needed.
 
 Visibility utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
 
-{{< scss-docs name="utils-visibility" file="scss/_utilities.scss" >}}
+{{< scss-docs name="utils-visibility" file="scss/_utilities.scss" unindent=4 >}}
-- 
GitLab