@kms-ngx-ui/presentational 0.0.5 → 0.0.7

package/src/lib/ui/kms-accordion-item/kms-accordion-item.component.scss

@@ -1,95 +1,95 @@
-@mixin kms-accordion-item-theme($theme) {
-    .accordion-item {        
-        &.showFlat{
-            background-color: transparent;
-            box-shadow: none !important;
-            border-radius: unset !important;
-            border-top: solid rgba(189, 188, 187, 0.5);
-        }
-        &.isSmall{
-            .accordion-item-header{
-                height: 42px;
-                padding-top: 0;
-                padding-bottom: 0;
-    
-                .accordion-item-title{
-                    font-size: 16px !important;
-                    font-weight: 300;
-                }  
-            
-                .accordion-item-header-icon-wrapper{
-                    kms-icon{
-                        
-                        svg{
-                            height: 16px;
-                            width: 16px;
-                        }    
-                    }
-                }
-            }
-        }
-
-        .accordion-item-header{
-            height: auto;
-            padding-top: $base-spacing-hoz;
-            padding-bottom: $base-spacing-hoz;
-
-            .accordion-item-title{
-                text-align: left;
-                font: 600 22px/38px var(--fontName-text);
-                letter-spacing: 0.53px;
-                color: var(--gray09);
-                margin: 0px;
-                
-                @media (max-width: $responsive-breakpoint) {
-                    font: 15 18px/23px var(--fontName-text);
-                    letter-spacing: 0.29px;
-                    color: var(--gray10);
-                    //height: 3em;
-                }
-
-                span{
-                    display: inline;
-
-                    @media (max-width: $responsive-breakpoint) {
-                        display: block;
-                    }
-                }
-            }  
-        
-            .accordion-item-header-icon-wrapper{
-                align-self: center;
-                
-                kms-icon{ 
-                    svg {    
-                        height: 22px;
-                        width: 22px;
-                        use{
-                            fill: var(--primaryColor);
-                        }
-                    }
-                }
-                
-                &-desktop{
-                    display: block;
-                    @media (max-width: $responsive-breakpoint) {
-                        display: none;
-                    }
-                }
-    
-                &-mobile{
-                    display: none;
-                    @media (max-width: $responsive-breakpoint) {
-                        display: block;
-                    }
-                }
-            }
-        }
-    }
-
-    mat-expansion-panel-header{
-        @media (max-width: $responsive-breakpoint) {
-            height: auto !important;
-        }
-    }
-}
+@mixin kms-accordion-item-theme() {
+    .accordion-item {        
+        &.showFlat{
+            background-color: transparent;
+            box-shadow: none !important;
+            border-radius: unset !important;
+            border-top: solid rgba(189, 188, 187, 0.5);
+        }
+        &.isSmall{
+            .accordion-item-header{
+                height: 42px;
+                padding-top: 0;
+                padding-bottom: 0;
+    
+                .accordion-item-title{
+                    font-size: 16px !important;
+                    font-weight: 300;
+                }  
+            
+                .accordion-item-header-icon-wrapper{
+                    kms-icon{
+                        
+                        svg{
+                            height: 16px;
+                            width: 16px;
+                        }    
+                    }
+                }
+            }
+        }
+
+        .accordion-item-header{
+            height: auto;
+            padding-top: $base-spacing-hoz;
+            padding-bottom: $base-spacing-hoz;
+
+            .accordion-item-title{
+                text-align: left;
+                font: 600 22px/38px var(--fontName-text);
+                letter-spacing: 0.53px;
+                color: var(--gray09);
+                margin: 0px;
+                
+                @media (max-width: $responsive-breakpoint) {
+                    font: 15 18px/23px var(--fontName-text);
+                    letter-spacing: 0.29px;
+                    color: var(--gray10);
+                    //height: 3em;
+                }
+
+                span{
+                    display: inline;
+
+                    @media (max-width: $responsive-breakpoint) {
+                        display: block;
+                    }
+                }
+            }  
+        
+            .accordion-item-header-icon-wrapper{
+                align-self: center;
+                
+                kms-icon{ 
+                    svg {    
+                        height: 22px;
+                        width: 22px;
+                        use{
+                            fill: var(--primaryColor);
+                        }
+                    }
+                }
+                
+                &-desktop{
+                    display: block;
+                    @media (max-width: $responsive-breakpoint) {
+                        display: none;
+                    }
+                }
+    
+                &-mobile{
+                    display: none;
+                    @media (max-width: $responsive-breakpoint) {
+                        display: block;
+                    }
+                }
+            }
+        }
+    }
+
+    mat-expansion-panel-header{
+        @media (max-width: $responsive-breakpoint) {
+            height: auto !important;
+        }
+    }
+}

package/src/lib/ui/radiobutton/radiobutton.component.scss

@@ -1,30 +1,32 @@
-    .wrapper {
-        position: relative;
-        display: inline-block;
-        padding-left: 35px;
-        cursor: pointer;
-
-        &:before {
-            
-        }
-
-        &:hover:before {
-        }
-
-        // Hide the browser's default radio button
-        input {
-            position: absolute;
-            opacity: 0;
-            cursor: pointer;
-            height: 0;
-            width: 0;
-        }
-
-        input:checked {
-
-        }
-
-        &.disabled {
-            cursor: default;
-        }
-    }
+@mixin radiobutton-theme(){
+    .wrapper {
+        position: relative;
+        display: inline-block;
+        padding-left: 35px;
+        cursor: pointer;
+
+        &:before {
+            
+        }
+
+        &:hover:before {
+        }
+
+        // Hide the browser's default radio button
+        input {
+            position: absolute;
+            opacity: 0;
+            cursor: pointer;
+            height: 0;
+            width: 0;
+        }
+
+        input:checked {
+
+        }
+
+        &.disabled {
+            cursor: default;
+        }
+    }
+}

package/src/lib/ui/time-input/time-input.component.scss

@@ -1,10 +1,11 @@
-
-    .timeInput {        
-        display: inline;
-        input{
-            width: 2em;
-            margin-right: 4px;
-            margin-left: 4px;
-            font-size: 16px;
-        }
-    }
+@mixin time-input-theme(){
+    .timeInput {        
+        display: inline;
+        input{
+            width: 2em;
+            margin-right: 4px;
+            margin-left: 4px;
+            font-size: 16px;
+        }
+    }
+}

package/src/lib/ui/tooltip/tooltip.component.scss

@@ -1,27 +1,27 @@
-@mixin tooltip-theme($theme) {
-    .tooltip {
-        position: absolute;
-        max-width: 400px;
-        font-size: 14px;
-        text-align: left;
-        color: #43403E;
-        padding: 10px 10px;
-        border-radius: var(--defaultBorderRadius);
-        z-index: 1000;
-        background-color: var(--gray07);
-        box-shadow: 0px 3px 6px var(--gray12);
-        
-        display: none;
-
-        b,a,div{
-            margin: 10px 0;
-        }
-    }
-    .tooltip-show {
-        display: block;
-    }
-}
-
-[kmsTooltip]{
-    position: relative;
+@mixin tooltip-theme() {
+    .tooltip {
+        position: absolute;
+        max-width: 400px;
+        font-size: 14px;
+        text-align: left;
+        color: #43403E;
+        padding: 10px 10px;
+        border-radius: var(--defaultBorderRadius);
+        z-index: 1000;
+        background-color: var(--gray07);
+        box-shadow: 0px 3px 6px var(--gray12);
+        
+        display: none;
+
+        b,a,div{
+            margin: 10px 0;
+        }
+    }
+    .tooltip-show {
+        display: block;
+    }
+}
+
+[kmsTooltip]{
+    position: relative;
 }

package/src/lib/ui/tooltip-icon/tooltip-icon.component.scss

@@ -1,2 +1,2 @@
-@mixin tooltip-icon-theme($theme) {
-}
+@mixin tooltip-icon-theme() {
+}

package/src/styles/styles.scss

@@ -1,23 +1,31 @@
-@import 'mixins.scss';
-
-@import '../lib//ui//back-to-top/back-to-top.component';
-@import '../lib/ui/button-with-confirm-dialog/button-with-confirm-dialog.component';
-@import '../lib/ui/checkbox/checkbox.component';
-@import '../lib/ui/color-input/color-input.component';
-@import '../lib/ui/generic-dialog/generic-dialog.component';
-@import '../lib/ui/icon/icon.component';
-@import '../lib/ui/kms-accordion-item/kms-accordion-item.component';
-@import '../lib/ui/loader/loader.component';
-@import '../lib/ui/map/map.component';
-@import '../lib/ui/radiobutton/radiobutton.component';
-@import '../lib/ui/time-input/time-input.component';
-@import '../lib/ui/tooltip-icon/tooltip-icon.component';
-@import '../lib/ui/tooltip/tooltip.component';
-
-@include back-to-top-theme($app-theme);
-@include checkbox-theme();
-@include generic-dialog-component-theme($app-theme);
-@include icon-theme($app-theme);
-@include kms-accordion-item-theme($app-theme);
-@include tooltip-icon-theme($app-theme);
-@include tooltip-theme($app-theme);
+@import 'mixins.scss';
+
+@import '../lib/ui/back-to-top/back-to-top.component';
+@import '../lib/ui/button-with-confirm-dialog/button-with-confirm-dialog.component';
+@import '../lib/ui/checkbox/checkbox.component';
+@import '../lib/ui/color-input/color-input.component';
+@import '../lib/ui/file-input/file-input.component';
+@import '../lib/ui/generic-dialog/generic-dialog.component';
+@import '../lib/ui/icon/icon.component';
+@import '../lib/ui/image-slider/image-slider.component';
+@import '../lib/ui/kms-accordion-item/kms-accordion-item.component';
+@import '../lib/ui/loader/loader.component';
+@import '../lib/ui/map/map.component';
+@import '../lib/ui/radiobutton/radiobutton.component';
+@import '../lib/ui/time-input/time-input.component';
+@import '../lib/ui/tooltip-icon/tooltip-icon.component';
+@import '../lib/ui/tooltip/tooltip.component';
+
+@include back-to-top-theme();
+@include button-with-confirm-theme();
+@include checkbox-theme();
+@include color-input-theme();
+@include file-input-theme();
+@include generic-dialog-component-theme();
+@include icon-theme();
+@include image-slider-theme();
+@include kms-accordion-item-theme();
+@include radiobutton-theme();
+@include time-input-theme();
+@include tooltip-icon-theme();
+@include tooltip-theme();