ADD mixin for json-schema-component

Signed-off-by: Hamza Hamidi <[email protected]>

Author: hamzahamidi

src/frontend/app/shared/components/add-service-instance/bind-apps-step/bind-apps-step.component.scss

@@ -3,27 +3,28 @@
   flex: 1;
 }
 
-.display-json {
-  white-space: -moz-pre-wrap;
-  white-space: -pre-wrap;
-  white-space: -o-pre-wrap;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-}
-
-.json-schema {
-  display: flex;
-  flex-direction: column;
-  @include breakpoint(laptop) {
+@mixin json-schema-component() {
+  .display-json {
+    white-space: -moz-pre-wrap;
+    white-space: -pre-wrap;
+    white-space: -o-pre-wrap;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+  }
+  .json-schema {
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
+    @include breakpoint(laptop) {
+      flex-direction: row;
+    }
   }
-}
-
-.json-schema-data,
-.json-schema-form {
-  width: 100%;
-  @include breakpoint(laptop) {
-    width: 50%;
+  .json-schema-data,
+  .json-schema-form {
+    width: 100%;
+    @include breakpoint(laptop) {
+      width: 50%;
+    }
   }
 }
+
+@include json-schema-component();

src/frontend/app/shared/components/add-service-instance/specify-details-step/specify-details-step.component.scss

@@ -1,3 +1,4 @@
+@import '../bind-apps-step/bind-apps-step.component';
 :host {
   flex: 1;
 }
@@ -23,3 +24,5 @@
     }
   }
 }
+
+@include json-schema-component();