feat(buttons): ensure social buttons are available even when orangeIc…

…ons' missing
Orange-OpenSource · Oct 30, 2019 · cb33191 · cb33191
1 parent 75343ea
commit cb33191
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 32 deletions.
diff --git a/scss/_buttons.scss b/scss/_buttons.scss
@@ -153,6 +153,38 @@ fieldset:disabled a.btn {
   // stylelint-disable-next-line declaration-no-important
   line-height: .875 !important; // Ensure .btn-icon is squared
 }
+
+// Boosted mod: social buttons
+@each $network in map-keys($o-networks) {
+  $icon: str-replace(icon-conf($network, "icon"), "#boosted#", $black);
+  $icon-inverse: str-replace(icon-conf($network, "icon"), "#boosted#", $white);
+  .btn-#{$network} {
+    &,
+    &.btn-inverse:active {
+      background-color: $white;
+      background-image: escape-svg(url("data:image/svg+xml,#{$icon}"));
+    }
+
+    &:hover,
+    &:focus,
+    &:active,
+    &.btn-inverse {
+      background-image: escape-svg(url("data:image/svg+xml,#{$icon-inverse}"));
+      border-color: $white;
+    }
+
+    &:hover,
+    &:focus {
+      background-color: icon-conf($network, "color");
+      border-color: icon-conf($network, "color");
+    }
+
+    &:active {
+      background-color: $black;
+      border-color: $black;
+    }
+  }
+}
 // end mod
 
 

diff --git a/scss/orangeIcons.scss b/scss/orangeIcons.scss
@@ -2823,35 +2823,3 @@
     @include svg-buy(theme-color("primary"));
   }
 }
-
-@each $network in map-keys($o-networks) {
-  $icon: str-replace(icon-conf($network, "icon"), "#boosted#", $black);
-  $icon-inverse: str-replace(icon-conf($network, "icon"), "#boosted#", $white);
-  .btn-#{$network} {
-    &,
-    &.btn-inverse:active {
-      background-color: $white;
-      background-image: escape-svg(url("data:image/svg+xml,#{$icon}"));
-    }
-
-    &:hover,
-    &:focus,
-    &:active,
-    &.btn-inverse {
-      background-image: escape-svg(url("data:image/svg+xml,#{$icon-inverse}"));
-      border-color: $white;
-    }
-
-    &:hover,
-    &:focus {
-      background-color: icon-conf($network, "color");
-      border-color: icon-conf($network, "color");
-    }
-
-    &:active {
-      background-color: $black;
-      border-color: $black;
-    }
-  }
-}
-