fix(business/field): change gray color to fit style guide (#55)

sbb-design-systems · Jun 25, 2019 · fd3b6b4 · fd3b6b4
1 parent 977fb78
commit fd3b6b4
Showing 1 changed file with 26 additions and 8 deletions.
diff --git a/projects/sbb-esta/angular-public/src/styles/common/_form.scss b/projects/sbb-esta/angular-public/src/styles/common/_form.scss
@@ -49,8 +49,16 @@
     display: none;
   }
 
+  &:focus {
+    border-color: $sbbColorGrey;
+  }
+
   @include businessOnly() {
     border-width: 1px;
+
+    &:focus {
+      border-color: $sbbColorGranite;
+    }
   }
 
   @include publicOnly() {
@@ -67,10 +75,6 @@
     }
   }
 
-  &:focus {
-    border-color: $sbbColorGrey;
-  }
-
   &.ng-touched.ng-invalid:not([aria-expanded='true']) {
     color: $sbbColorError;
     border-color: $sbbColorError;
@@ -102,18 +106,28 @@
   line-height: pxToRem(16);
   display: block;
 
-  @include mq($from: desktop4k) {
-    font-size: pxToRem(13 * $scalingFactor4k);
+  @include businessOnly() {
+    color: $sbbColorGranite;
   }
 
-  @include mq($from: desktop5k) {
-    font-size: pxToRem(13 * $scalingFactor5k);
+  @include publicOnly() {
+    @include mq($from: desktop4k) {
+      font-size: pxToRem(13 * $scalingFactor4k);
+    }
+
+    @include mq($from: desktop5k) {
+      font-size: pxToRem(13 * $scalingFactor5k);
+    }
   }
 }
 
 @mixin formlabel {
   color: $sbbColorGrey;
   font-size: pxToEm(13);
+
+  @include businessOnly() {
+    color: $sbbColorGranite;
+  }
 }
 
 @mixin inputField() {
@@ -129,5 +143,9 @@
 
   &:focus {
     border-color: $sbbColorGrey;
+
+    @include businessOnly() {
+      border-color: $sbbColorGranite;
+    }
   }
 }