1 files changed, 76 insertions, 1 deletions
diff --git a/WebContent/VAADIN/themes/valo/components/_button.scss b/WebContent/VAADIN/themes/valo/components/_button.scss
index 4930742dad..ec74f70eaf 100644
--- a/WebContent/VAADIN/themes/valo/components/_button.scss
+++ b/WebContent/VAADIN/themes/valo/components/_button.scss
@@ -1,8 +1,83 @@
-@mixin valo-button ($primary-stylename: v-button) {
+@mixin valo-button ($primary-stylename: v-button, $include-additional-styles: contains($v-included-additional-styles, button)) {
   .#{$primary-stylename} {
     @include valo-button-static-style;
     @include valo-button-style;
   }
+
+
+  @if $include-additional-styles {
+    .#{$primary-stylename}-primary {
+      @include valo-button-style($background-color: $v-selection-color);
+      $padding-width: round($v-unit-size/2);
+      padding: 0 $padding-width;
+      font-weight: bold;
+      $min-width: round($v-unit-size * 2.2);
+      min-width: $min-width;
+
+      // IE8 + border-box + min-width == fail
+      .v-ie8 & {
+        min-width: $min-width - ($padding-width * 2);
+      }
+    }
+
+    .#{$primary-stylename}-friendly {
+      @include valo-button-style($background-color: $v-friendly-color);
+    }
+
+    .#{$primary-stylename}-danger {
+      @include valo-button-style($background-color: $v-error-indicator-color);
+    }
+
+    .#{$primary-stylename}-borderless {
+      @include valo-button-borderless-style;
+    }
+
+    .#{$primary-stylename}-borderless-colored {
+      @include valo-button-borderless-style($font-color: $v-selection-color);
+    }
+
+    .#{$primary-stylename}-quiet {
+      @include valo-button-quiet-style;
+    }
+
+    .#{$primary-stylename}-link {
+      @include valo-button-borderless-style;
+      @include valo-link-style;
+    }
+
+    .#{$primary-stylename}-small {
+      @include valo-button-style($unit-size: $v-unit-size--small, $bevel: null, $shadow: null, $background-color: null, $font-size: $v-font-size--small, $font-weight: null);
+    }
+
+    .#{$primary-stylename}-large {
+      @include valo-button-style($unit-size: $v-unit-size--large, $bevel: null, $shadow: null, $background-color: null, $font-size: $v-font-size--large, $font-weight: null);
+    }
+
+    .#{$primary-stylename}-icon-align-right {
+      @include valo-button-icon-align-right-style;
+    }
+
+    .#{$primary-stylename}-icon-align-top {
+      @include valo-button-icon-align-top-style;
+    }
+
+    .#{$primary-stylename}-icon-only {
+      width: $v-unit-size;
+      padding: 0;
+
+      &.#{$primary-stylename}-small {
+        width: $v-unit-size--small;
+      }
+
+      &.#{$primary-stylename}-large {
+        width: $v-unit-size--large;
+      }
+
+      .#{$primary-stylename}-caption {
+        display: none;
+      }
+    }
+  }
 }