Split common-stylenames to individual component files (#14374)

Moved notification and valo-menu styles to the components folder as
well, and added them to the $v-included-components list.

Additional styles are now also controlled with a list variable, which
lists all components whose additional styles should be included in the
build.

Change-Id: Ifb8d49d71622decf8fa0d4875985fcafd908a1f8

1 files changed, 38 insertions, 1 deletions

diff --git a/WebContent/VAADIN/themes/valo/components/_tabsheet.scss b/WebContent/VAADIN/themes/valo/components/_tabsheet.scss
index 2e28174fa7..7f2421b5ff 100644
--- a/WebContent/VAADIN/themes/valo/components/_tabsheet.scss
+++ b/WebContent/VAADIN/themes/valo/components/_tabsheet.scss
@@ -51,7 +51,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default;
 
 
 
-@mixin valo-tabsheet ($primary-stylename: v-tabsheet) {
+@mixin valo-tabsheet ($primary-stylename: v-tabsheet, $include-additional-styles: contains($v-included-additional-styles, tabsheet)) {
   .#{$primary-stylename} {
     &:not(.v-has-width) {
       width: auto !important;
@@ -119,6 +119,43 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default;
     }
   }
 
+
+  @if $include-additional-styles {
+    .#{$primary-stylename}-equal-width-tabs {
+      @include valo-tabsheet-equal-width-tabs-style($flex: false);
+    }
+
+    .#{$primary-stylename}-framed {
+      @include valo-tabsheet-framed-style;
+    }
+
+    .#{$primary-stylename}-centered-tabs {
+      @include valo-tabsheet-align-tabs-style($align: center);
+    }
+
+    .#{$primary-stylename}-right-aligned-tabs {
+      @include valo-tabsheet-align-tabs-style($align: right);
+    }
+
+    .#{$primary-stylename}-padded-tabbar {
+      @include valo-tabsheet-padded-tabbar-style;
+    }
+
+    .#{$primary-stylename}-icons-on-top {
+      @include valo-tabsheet-icons-on-top-style;
+    }
+
+    .#{$primary-stylename}-compact-tabbar {
+      > .#{$primary-stylename}-tabcontainer-compact-tabbar .v-caption {
+        line-height: 1.8;
+      }
+    }
+
+    .#{$primary-stylename}-only-selected-closable {
+      @include valo-tabsheet-only-selected-closable-style;
+    }
+  }
+
 }