Add Sass docs (variables, mixins, and loops) to most pages (#32747)

* WIP: Mention variables, mixins, and loops in docs

* Add Sass sections to component pages

* add sass docs for forms and content

* Update buttons.md

* Remove empty mixins sections

* Massive update to utilities and some consistency changes

Co-authored-by: XhmikosR <xhmikosr@gmail.com>

site/content/docs/5.0/components/list-group.md

@@ -254,6 +254,23 @@ And if you want `<label>`s as the `.list-group-item` for large hit areas, you ca
 </div>
 {{< /example >}}
 
+## Sass
+
+### Variables
+
+{{< scss-docs name="list-group-variables" file="scss/_variables.scss" >}}
+
+### Mixins
+
+Used in combination with `$theme-colors` to generate the [contextual variant classes](#contextual-classes) for `.list-group-item`s.
+
+{{< scss-docs name="list-group-mixin" file="scss/mixins/_list-group.scss" >}}
+
+### Loop
+
+Loop that generates the modifier classes with the `list-group-item-variant()` mixin.
+
+{{< scss-docs name="list-group-modifiers" file="scss/_list-group.scss" >}}
 
 ## JavaScript behavior