CSS border style classes

front/core/components/step-control/style.scss

@@ -12,31 +12,25 @@ vn-step-control {
             display: flex;
             flex-direction: row
         }
-
         & > .steps > .step {
             justify-content: center;
             min-width: 125px;
             display: flex;
             flex: auto
         }
-        
         & > .steps > .step .circle {
             border: 2px solid $color-main;
             background-color: white;
             align-content: center;
             margin-top: -9.5px;
-            -moz-border-radius: 50%;
-            -webkit-border-radius: 50%;
             border-radius: 50%;
             cursor: pointer;
             height: 15px;
             width: 15px
         }
- 
         & > .steps > .step .circle.active {
             background-color: $color-main;
         }
-
         & > .buttons {
             display: flex;
             flex: auto;
@@ -44,11 +38,9 @@ vn-step-control {
             justify-content: space-between;
             margin-top: 10px
         }
-
         & > .buttons > .step {
             display: flex
         }
-
         & > .buttons > .step > .mdl-button {
             line-height: 32px;
             font-size: 12px;
@@ -56,5 +48,4 @@ vn-step-control {
             height: 32px
         }
     }
-
 }

front/core/styles/border.scss

@@ -1,23 +1,23 @@
 @import "./variables";
 
-html [border-solid], .border-solid {
+.border-solid {
     border: $border-thin-light;
 }
-html [border-solid-top], .border-solid-top {
+.border-solid-top {
     border-top: $border-thin-light;
 }
-html [border-solid-left], .border-solid-left {
+.border-solid-left {
     border-left: $border-thin-light;
 }
-html [border-solid-right], .border-solid-right {
+.border-solid-right {
     border-right: $border-thin-light;
 }
-html [border-solid-bottom], .border-solid-bottom {
+.border-solid-bottom {
     border-bottom: $border-thin-light;
 }
 
 /* Border Radius */
 
-html [border-radius], .border-radius {
+.border-radius {
     border-radius: .3em;
 }

front/core/styles/spacing.scss

@@ -1,10 +1,8 @@
-@import "./variables";
-
 /**
  * CSS spacing classes
  *
  * vn-[p|m][t|r|b|l|a|x|y]-[none|auto|xs|sm|md|lg|xl]
- *         T             D                                     S
+ *      T         D                     S
  * 
  * T - type
  *     - values: p (padding), m (margin)
@@ -25,6 +23,8 @@
  *             xl (extra large)
  */
  
+ @import "./variables";
+
 //++++++++++++++++++++++++++++++++++++++++++++++++ Padding
 
 // None
@@ -328,7 +328,7 @@
     margin-right: $spacing-lg;
 }
 
-/* Huge */
+/* Extra large */
 
 .vn-ma-xl {
     margin: $spacing-xl;

modules/client/front/address/index/index.html

@@ -15,10 +15,9 @@
         class="address">
         <a
             ui-sref="client.card.address.edit({addressId: {{::address.id}}})"
-            class="vn-pa-sm border-solid"
+            class="vn-pa-sm border-solid border-radius"
             ng-class="{'item-disabled': !address.isActive}"
-            translate-attr="{title: 'Edit address'}"
-            border-radius>
+            translate-attr="{title: 'Edit address'}">
             <vn-none
                 class="vn-pr-sm"
                 ng-click="$ctrl.onStarClick($event)">
@@ -52,8 +51,7 @@
             <vn-vertical
                 vn-one
                 ng-if="address.observations.length"
-                border-solid-left
-                class="vn-hide-narrow vn-px-md"
+                class="vn-hide-narrow vn-px-md border-solid-left"
                 style="height: 6em; overflow: auto;">
                 <vn-one ng-repeat="observation in address.observations track by $index" ng-class="{'vn-pt-sm': $index}">
                     <b>{{::observation.observationType.description}}:</b> 

modules/client/front/credit-insurance/index/index.html

@@ -7,8 +7,7 @@
         class="vn-pb-md insurance"
         style="align-items: center;">
         <vn-one
-            border-radius
-            class="vn-pa-sm border-solid"
+            class="vn-pa-sm border-solid border-radius"
             ng-class="{'item-hightlight': !classification.finished,'item-disabled': classification.finished}">
             <vn-horizontal style="align-items: center;">
                 <vn-none class="vn-px-md">
@@ -19,7 +18,7 @@
                         ng-click="$ctrl.closeContract(classification)">
                     </vn-icon-button>
                 </vn-none>
-                <vn-one border-solid-right>
+                <vn-one class="border-solid-right">
                     <div><vn-label translate>Since</vn-label> {{::classification.started | dateTime:'dd/MM/yyyy'}}</div>
                     <div><vn-label translate>To</vn-label> {{classification.finished | dateTime:'dd/MM/yyyy'}}</div>
                 </vn-one>