From fa48f676c91f289a00ef12d0a6476eb71cd02d88 Mon Sep 17 00:00:00 2001
From: Stefan Malzner <stefan@adlk.io>
Date: Tue, 7 Nov 2017 14:26:19 +0100
Subject: Remove cumbersome style nesting

---
 src/styles/button.scss | 108 ++++++++++++++++++++++++-------------------------
 1 file changed, 53 insertions(+), 55 deletions(-)

diff --git a/src/styles/button.scss b/src/styles/button.scss
index c2dd91293..75d2cb1d4 100644
--- a/src/styles/button.scss
+++ b/src/styles/button.scss
@@ -1,74 +1,72 @@
 @import './config.scss';
 
-.franz-form {
-  .franz-form__button {
-    position: relative;
-    background: $theme-brand-primary;
-    display: block;
-    padding: 10px 20px;
-    color: #FFF;
-    border-radius: 3px;
-    transition: background 0.5s;
-    text-align: center;
+.franz-form__button {
+  position: relative;
+  background: $theme-brand-primary;
+  display: block;
+  padding: 10px 20px;
+  color: #FFF;
+  border-radius: 3px;
+  transition: background 0.5s;
+  text-align: center;
 
-    &:hover {
-      background: darken($theme-brand-primary, 5%);
-    }
+  &:hover {
+    background: darken($theme-brand-primary, 5%);
+  }
 
-    &:active {
-      transition: none;
-      background: lighten($theme-brand-primary, 5%);
-    }
+  &:active {
+    transition: none;
+    background: lighten($theme-brand-primary, 5%);
+  }
 
-    &:disabled {
-      opacity: 0.2;
-    }
+  &:disabled {
+    opacity: 0.2;
+  }
 
-    &.franz-form__button--secondary {
-      background: $theme-gray-lighter;
-      color: $theme-gray;
+  &.franz-form__button--secondary {
+    background: $theme-gray-lighter;
+    color: $theme-gray;
 
-      &:hover {
-        background: darken($theme-gray-lighter, 5%);
-      }
+    &:hover {
+      background: darken($theme-gray-lighter, 5%);
+    }
 
-      &:active {
-        background: lighten($theme-gray-lighter, 5%);
-      }
+    &:active {
+      background: lighten($theme-gray-lighter, 5%);
     }
+  }
 
-    &.franz-form__button--danger {
-      background: $theme-brand-danger;
+  &.franz-form__button--danger {
+    background: $theme-brand-danger;
 
-      &:hover {
-        background: darken($theme-brand-danger, 5%);
-      }
+    &:hover {
+      background: darken($theme-brand-danger, 5%);
+    }
 
-      &:active {
-        background: lighten($theme-brand-danger, 5%);
-      }
+    &:active {
+      background: lighten($theme-brand-danger, 5%);
     }
+  }
 
-    &.franz-form__button--inverted {
-      background: none;
-      padding: 10px 20px;
-      border: 2px solid $theme-brand-primary;
-      color: $theme-brand-primary;
-      transition: background 0.5s, color 0.5s;
+  &.franz-form__button--inverted {
+    background: none;
+    padding: 10px 20px;
+    border: 2px solid $theme-brand-primary;
+    color: $theme-brand-primary;
+    transition: background 0.5s, color 0.5s;
 
-      &:hover {
-        background: darken($theme-brand-primary, 5%);
-        color: #FFF;
-      }
+    &:hover {
+      background: darken($theme-brand-primary, 5%);
+      color: #FFF;
     }
+  }
 
-    .loader {
-      position: relative;
-      width: 20px;
-      height: 12px;
-      z-index: 9999;
-      display: inline-block;
-      margin-right: 5px;
-    }
+  .loader {
+    position: relative;
+    width: 20px;
+    height: 12px;
+    z-index: 9999;
+    display: inline-block;
+    margin-right: 5px;
   }
 }
-- 
cgit v1.2.3-54-g00ecf