fix: hr and vr elements don't support themes

Author: mrholek

scss/_type.scss

@@ -56,7 +56,10 @@ hr {
   margin-top: $hr-margin-y;
   margin-bottom: $hr-margin-y;
   border: 0;
-  border-top: $hr-border-width solid $hr-border-color;
+  border-top: $hr-border-width solid;
+  @include themes($typography-theme-map, $create: parent) {
+    border-color: themes-get-value("hr-border-color");
+  }
 }
 
 //
@@ -65,7 +68,9 @@ hr {
 
 .c-vr {
   width: $vr-width;
-  background-color: $vr-color-bg;
+  @include themes($typography-theme-map, $create: parent) {
+    background-color: themes-get-value("vr-bg");
+  }
 }
 
 //

scss/variables/_typography.scss

@@ -59,8 +59,8 @@ $blockquote-font-size:        $font-size-base * 1.25 !default;
 $hr-border-color:  rgba($black, .2) !default;
 $hr-border-width:  $border-width !default;
 
-$vr-color-bg:  rgba($black, .2) !default;
-$vr-width:     $border-width !default;
+$vr-bg:     rgba($black, .2) !default;
+$vr-width:  $border-width !default;
 
 $mark-padding:  .2em !default;
 
@@ -96,7 +96,9 @@ $typography-theme-map: () !default;
 $typography-theme-map: map-merge(
   (
     default: (
-      "text-muted":  $text-muted
+      "hr-border-color":  $hr-border-color,
+      "vr-bg":            $vr-bg,
+      "text-muted":       $text-muted
     )
   ),
   $typography-theme-map