Prefix header style names with 'v-label-'

Avoid name clashes with custom theme style names (got one report where
this was an issue).

Change-Id: If4bac6c227ad665084f2c9d4e03e1514a4149684

2 files changed, 27 insertions, 27 deletions

diff --git a/WebContent/VAADIN/themes/valo/components/_formlayout.scss b/WebContent/VAADIN/themes/valo/components/_formlayout.scss
index c73fff9b9a..33191e4a20 100644
--- a/WebContent/VAADIN/themes/valo/components/_formlayout.scss
+++ b/WebContent/VAADIN/themes/valo/components/_formlayout.scss
@@ -39,9 +39,9 @@
       font-weight: $v-font-weight + 100;
     }
 
-    > .h2,
-    > .h3,
-    > .h4 {
+    > .v-label-h2,
+    > .v-label-h3,
+    > .v-label-h4 {
       position: absolute;
       left: 0;
       margin-top: -0.5em;
@@ -189,15 +189,15 @@
   }
 
   > table > tbody > .#{$primary-stylename}-row > .#{$primary-stylename}-contentcell {
-    > .h2,
-    > .h3,
-    > .h4 {
+    > .v-label-h2,
+    > .v-label-h3,
+    > .v-label-h4 {
       border-bottom: none;
       color: $v-selection-color;
     }
 
-    > .h3,
-    > .h4 {
+    > .v-label-h3,
+    > .v-label-h4 {
       margin-top: 0;
     }
   }
diff --git a/WebContent/VAADIN/themes/valo/components/_label.scss b/WebContent/VAADIN/themes/valo/components/_label.scss
index b1365e0011..502b640809 100644
--- a/WebContent/VAADIN/themes/valo/components/_label.scss
+++ b/WebContent/VAADIN/themes/valo/components/_label.scss
@@ -24,15 +24,15 @@ $v-letter-spacing--h4:    0               !default;
     white-space: nowrap;
   }
 
-  h1, .h1,
-  h2, .h2,
-  h3, .h3 {
+  h1, .#{$primary-stylename}-h1,
+  h2, .#{$primary-stylename}-h2,
+  h3, .#{$primary-stylename}-h3 {
     line-height: $v-line-height--header;
     font-weight: $v-font-weight--header;
     color: valo-header-color($v-app-background-color);
   }
 
-  h1, .h1 {
+  h1, .#{$primary-stylename}-h1 {
     font-size: $v-font-size--h1;
     margin-top: 1.4em;
     margin-bottom: 1em;
@@ -40,7 +40,7 @@ $v-letter-spacing--h4:    0               !default;
     letter-spacing: $v-letter-spacing--h1;
   }
 
-  h2, .h2 {
+  h2, .#{$primary-stylename}-h2 {
     font-size: $v-font-size--h2;
     font-family: $v-font-family--h2;
     margin-top: 1.6em;
@@ -48,7 +48,7 @@ $v-letter-spacing--h4:    0               !default;
     letter-spacing: $v-letter-spacing--h2;
   }
 
-  h3, .h3 {
+  h3, .#{$primary-stylename}-h3 {
     font-size: $v-font-size--h3;
     font-family: $v-font-family--h3;
     margin-top: 1.8em;
@@ -56,7 +56,7 @@ $v-letter-spacing--h4:    0               !default;
     letter-spacing: $v-letter-spacing--h3;
   }
 
-  h4, .h4 {
+  h4, .#{$primary-stylename}-h4 {
     line-height: $v-line-height--header;
     font-weight: $v-font-weight + 200;
     font-size: $v-font-size--small;
@@ -72,10 +72,10 @@ $v-letter-spacing--h4:    0               !default;
    > h2,
    > h3,
    > h4
-   > .h1,
-   > .h2,
-   > .h3
-   > .h4 {
+   > .#{$primary-stylename}-h1,
+   > .#{$primary-stylename}-h2,
+   > .#{$primary-stylename}-h3
+   > .#{$primary-stylename}-h4 {
       &:first-child {
         margin-top: $v-font-size;
       }
@@ -84,18 +84,18 @@ $v-letter-spacing--h4:    0               !default;
 
   .v-verticallayout > .v-slot:first-child,
   .v-verticallayout > div > .v-slot:first-child {
-    h1, .h1,
-    h2, .h2,
-    h3, .h3
-    h4, .h4 {
+    h1, .#{$primary-stylename}-h1,
+    h2, .#{$primary-stylename}-h2,
+    h3, .#{$primary-stylename}-h3
+    h4, .#{$primary-stylename}-h4 {
       margin-top: $v-font-size;
     }
   }
 
-  h1, .h1,
-  h2, .h2,
-  h3, .h3,
-  h4, .h4 {
+  h1, .#{$primary-stylename}-h1,
+  h2, .#{$primary-stylename}-h2,
+  h3, .#{$primary-stylename}-h3,
+  h4, .#{$primary-stylename}-h4 {
     &.no-margin {
       margin: 0 !important;
     }