Conversion of User Guide to the SHH stack (#2781)

guide/style/bulma-prefers-dark/sass/base/_all.sass

@@ -0,0 +1,4 @@
+@charset "utf-8"
+
+@import "generic.sass"
+@import "helpers.sass"

guide/style/bulma-prefers-dark/sass/base/generic.sass

@@ -0,0 +1,39 @@
+$body-background-color-dark: $body-background-dark !default
+$body-color-dark: $text-dark !default
+
+$hr-background-color-dark: $background-dark !default
+
+$strong-color-dark: $text-strong-dark !default
+
+html
+  background-color: $body-background-color-dark
+
+body
+  color: $body-color-dark
+
+// Inline
+
+a
+  color: $link-dark
+  &:hover
+    color: $link-hover-dark
+
+code
+  background-color: $code-background-dark
+  color: $code-dark
+
+hr
+  background-color: $hr-background-color-dark
+
+strong
+  color: $strong-color-dark
+
+// Block
+
+pre
+  background-color: $pre-background-dark
+  color: $pre-dark
+
+table
+  th
+    color: $text-strong-dark

guide/style/bulma-prefers-dark/sass/base/helpers.sass

@@ -0,0 +1,16 @@
+@each $name, $pair in $colors
+  $color: nth($pair, 1)
+  .has-text-#{$name}-dark
+    color: $color !important
+  a.has-text-#{$name}-dark
+    &:hover,
+    &:focus
+      color: lighten($color, 10%) !important
+  .has-background-#{$name}-dark
+    background-color: $color !important
+
+@each $name, $shade in $shades
+  .has-text-#{$name}-dark
+    color: $shade !important
+  .has-background-#{$name}-dark
+    background-color: $shade !important