@mediusinc/mng-commons 0.2.5 → 0.2.9

package/scss/common/layout/_topbar.scss

@@ -37,7 +37,7 @@
             border-radius: 6px;
             background-color: $topbarIconBg;
             color: $topbarTextColor;
-            @include transition(color .3s);
+            @include transition(color 0.3s);
 
             &:hover {
                 color: $topbarTextHoverColor;
@@ -75,7 +75,7 @@
                     width: 36px;
                     height: 36px;
                     margin: 0 0.4rem;
-                    padding: .75rem .5rem;
+                    padding: 0.75rem 0.5rem;
                     border-radius: $borderRadius;
 
                     &:hover {
@@ -85,7 +85,7 @@
 
                     .topbar-icon {
                         font-size: 1.5rem;
-                        @include transition(color .3s);
+                        @include transition(color 0.3s);
                     }
 
                     .topbar-item-name {
@@ -130,7 +130,7 @@
                     right: 0;
                     display: none;
                     min-width: 12rem;
-                    animation-duration: .5s;
+                    animation-duration: 0.5s;
                     list-style-type: none;
                     margin: 0;
                     z-index: 1;
@@ -153,7 +153,9 @@
                             margin-right: 8px;
                         }
 
-                        i, img, span {
+                        i,
+                        img,
+                        span {
                             vertical-align: middle;
                         }
 

package/scss/common/layout/_typography.scss

@@ -1,4 +1,9 @@
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
     margin: 1.5rem 0 1rem 0;
     font-family: inherit;
     font-weight: 600;
@@ -35,8 +40,8 @@ h6 {
 }
 
 mark {
-    background: #FFF8E1;
-    padding: .25rem .4rem;
+    background: #fff8e1;
+    padding: 0.25rem 0.4rem;
     border-radius: $borderRadius;
     font-family: monospace;
 }
@@ -44,13 +49,13 @@ mark {
 blockquote {
     margin: 1rem 0;
     padding: 0 2rem;
-    border-left: 4px solid #90A4AE;
+    border-left: 4px solid #90a4ae;
 }
 
 hr {
     border-top: solid $dividerColor;
     border-width: 1px 0 0 0;
-    margin: 1rem 0; 
+    margin: 1rem 0;
 }
 
 p {
@@ -60,4 +65,4 @@ p {
     &:last-child {
         margin-bottom: 0;
     }
-}
+}

package/scss/common/layout/_utils.scss

@@ -1,6 +1,6 @@
 /* Utils */
 .clearfix:after {
-    content: " ";
+    content: ' ';
     display: block;
     clear: both;
 }

package/scss/common/layout/_widgets.scss

@@ -20,8 +20,8 @@
         height: 32px;
         width: 70px;
         border-radius: 6px;
-        padding: .5em;
-        margin-top: .5em;
+        padding: 0.5em;
+        margin-top: 0.5em;
         margin-right: 12px;
 
         i {
@@ -41,7 +41,7 @@
 
     &.widget-overview-box-1 {
         .overview-badge {
-            background-color: #FC6161;
+            background-color: #fc6161;
             box-shadow: 0px 6px 20px rgba(252, 97, 97, 0.3);
         }
     }
@@ -49,14 +49,14 @@
     &.widget-overview-box-2 {
         .overview-badge {
             margin-right: 12px;
-            background-color: #0BD18A;
+            background-color: #0bd18a;
             box-shadow: 0px 6px 20px rgba(11, 209, 138, 0.3);
         }
     }
 
     &.widget-overview-box-3 {
         .overview-badge {
-            background-color: #00D0DE;
+            background-color: #00d0de;
             box-shadow: 0px 6px 20px rgba(0, 208, 222, 0.3);
         }
     }
@@ -76,7 +76,7 @@
                 }
 
                 i {
-                    margin-left: .5rem;
+                    margin-left: 0.5rem;
                 }
             }
         }
@@ -115,7 +115,7 @@
 
         .header-icons {
             i {
-                margin-left: .5rem;
+                margin-left: 0.5rem;
             }
         }
     }
@@ -129,7 +129,8 @@
         }
 
         .p-timeline-event-content {
-            p, h6 {
+            p,
+            h6 {
                 margin: 0;
             }
 
@@ -145,7 +146,7 @@
 
         .custom-marker {
             border-radius: 50%;
-            padding: .25rem;
+            padding: 0.25rem;
             width: 24px;
             height: 24px;
             text-align: center;
@@ -185,7 +186,7 @@
                     width: 24px;
                     height: 24px;
                     border-radius: 4px;
-                    margin-right: .5rem;
+                    margin-right: 0.5rem;
                 }
             }
         }
@@ -202,7 +203,7 @@
                 align-items: center;
 
                 i {
-                    margin-left: .5rem;
+                    margin-left: 0.5rem;
                 }
             }
         }
@@ -242,7 +243,7 @@
                 }
 
                 .person-info {
-                    margin-left: .5rem;
+                    margin-left: 0.5rem;
 
                     .amount {
                         font-size: 18px;
@@ -268,7 +269,7 @@
 
             .actions {
                 i {
-                    margin-left: .5rem;
+                    margin-left: 0.5rem;
                 }
             }
         }
@@ -287,7 +288,7 @@
         }
 
         p {
-            margin-left: .5rem;
+            margin-left: 0.5rem;
             color: $textThirdColor;
             font-size: 12px;
             line-height: 1rem;
@@ -305,7 +306,7 @@
         .rate {
             font-size: 13px;
             line-height: 1rem;
-            color: #0BD18A;
+            color: #0bd18a;
 
             i {
                 font-size: 12px;
@@ -321,7 +322,7 @@
         margin-top: 1.5rem;
         min-height: 235px;
         position: relative;
-        color: #FC6161;
+        color: #fc6161;
         display: flex;
         justify-content: space-between;
 
@@ -348,14 +349,14 @@
 
             &.success {
                 span:first-child {
-                    color: #0BD18A;
+                    color: #0bd18a;
                 }
 
                 .p-progressbar {
                     box-shadow: 0px 0px 10px rgba(11, 209, 138, 0.3);
 
                     .p-progressbar-value {
-                        background-color: #0BD18A;
+                        background-color: #0bd18a;
                     }
                 }
             }
@@ -368,7 +369,7 @@
                 background-color: $progressBarBg;
 
                 .p-progressbar-value {
-                    background-color: #FC6161;
+                    background-color: #fc6161;
                     box-shadow: 0px 0px 10px rgba(252, 97, 97, 0.3);
                 }
             }

package/scss/common/layout/menu/_menu_common.scss

@@ -68,11 +68,11 @@
                 &.layout-root-menuitem {
                     > div {
                         padding-left: 1.5rem;
-                        margin-bottom: .5rem;
+                        margin-bottom: 0.5rem;
                         font-size: 12px;
 
                         > .layout-menuitem-text {
-                            font-size: .857rem;
+                            font-size: 0.857rem;
                             font-weight: 600;
                             text-transform: uppercase;
                         }
@@ -82,7 +82,7 @@
                 > a {
                     display: flex;
                     align-items: center;
-                    padding: .5rem 1rem;
+                    padding: 0.5rem 1rem;
                     cursor: pointer;
                     user-select: none;
                     border-radius: 8px;
@@ -117,13 +117,13 @@
 
                     li {
                         ul {
-                            padding: 0 0 .25rem;
+                            padding: 0 0 0.25rem;
                             overflow: hidden;
                         }
                     }
 
                     > li {
-                        margin-top: .2rem;
+                        margin-top: 0.2rem;
 
                         &.layout-root-menuitem {
                             > a {
@@ -168,7 +168,7 @@
                     padding: 6px;
 
                     > a {
-                        padding: .75rem 1.25rem;
+                        padding: 0.75rem 1.25rem;
                     }
                 }
             }

package/scss/common/layout/menu/_menu_overlay.scss

@@ -29,7 +29,7 @@
                             padding: 6px;
 
                             > a {
-                                padding: .75rem 1rem;
+                                padding: 0.75rem 1rem;
                             }
                         }
                     }

package/scss/common/layout/menu/_menu_sidebar.scss

@@ -81,7 +81,8 @@
 
                     .layout-inline-menu {
                         .layout-inline-menu-action {
-                            .layout-inline-menu-text, .layout-inline-menu-icon {
+                            .layout-inline-menu-text,
+                            .layout-inline-menu-icon {
                                 visibility: visible;
                             }
 
@@ -113,7 +114,6 @@
                         overflow: hidden;
 
                         > li {
-
                             .layout-menuitem-root-text {
                                 display: none;
                             }
@@ -147,7 +147,7 @@
                                 cursor: pointer;
 
                                 > span {
-                                    margin: 0 .5rem;
+                                    margin: 0 0.5rem;
                                     margin-left: 1rem;
                                     visibility: hidden;
                                     white-space: nowrap;
@@ -160,7 +160,7 @@
                                     &.layout-submenu-toggler {
                                         @include transition(transform $transitionDuration);
                                         margin-left: auto;
-                                        font-size:12px ;
+                                        font-size: 12px;
                                         visibility: hidden;
                                     }
                                 }
@@ -205,7 +205,8 @@
 
                 .layout-inline-menu {
                     .layout-inline-menu-action {
-                        .layout-inline-menu-text, .layout-inline-menu-icon {
+                        .layout-inline-menu-text,
+                        .layout-inline-menu-icon {
                             white-space: nowrap;
                             visibility: hidden;
                         }

package/scss/common/layout/menu/_menu_slim.scss

@@ -82,7 +82,7 @@
                                     min-height: 32px;
 
                                     .layout-menuitem-text {
-                                        margin-left: .5rem;
+                                        margin-left: 0.5rem;
                                     }
 
                                     > span {
@@ -97,7 +97,6 @@
                                 }
                                 @include nested-submenu-indents(8, 2, 8);
                             }
-
                         }
                     }
                 }
@@ -111,7 +110,7 @@
                     }
 
                     .layout-inline-menu-action-panel {
-                        padding: 0 .5rem;
+                        padding: 0 0.5rem;
                         padding-left: 1.5rem;
 
                         .layout-inline-menu-action-item {

package/scss/common/layout/menu/_menu_static.scss

@@ -10,7 +10,7 @@
                 border-radius: 6px;
                 background-color: $topbarIconBg;
                 color: $topbarTextColor;
-                @include transition(color .3s);
+                @include transition(color 0.3s);
 
                 &:hover {
                     color: $topbarTextHoverColor;

package/scss/common/layout/menu/_menu_theme.scss

@@ -134,7 +134,6 @@
                 .layout-menu-container {
                     .layout-menu {
                         > li {
-
                             &.layout-root-menuitem {
                                 > div {
                                     color: $rootMenuItemTextColor;
@@ -156,7 +155,8 @@
             }
         }
 
-        &.layout-overlay, &.layout-sidebar {
+        &.layout-overlay,
+        &.layout-sidebar {
             .layout-menu-wrapper {
                 background: $menuBg;
 
@@ -176,7 +176,6 @@
                                 background: $overlayMenuActiveBg;
 
                                 > a {
-
                                     i {
                                         color: $rootMenuItemTextColor;
                                     }

package/scss/common/theme/designer/_colors.scss

@@ -1,18 +1,17 @@
 :root {
-  @if variable-exists(colors) {
-    @each $name, $color in $colors {
-        @for $i from 0 through 5 {
-            @if ($i == 0) {
-                --#{$name}-50:#{tint($color, (5 - $i) * 19%)};
+    @if variable-exists(colors) {
+        @each $name, $color in $colors {
+            @for $i from 0 through 5 {
+                @if ($i == 0) {
+                    --#{$name}-50: #{tint($color, (5 - $i) * 19%)};
+                } @else {
+                    --#{$name}-#{$i * 100}: #{tint($color, (5 - $i) * 19%)};
+                }
             }
-            @else {
-                --#{$name}-#{$i * 100}:#{tint($color, (5 - $i) * 19%)};
-            }
-        }
 
-        @for $i from 1 through 4 {
-            --#{$name}-#{($i + 5) * 100}:#{shade($color, $i * 15%)};
+            @for $i from 1 through 4 {
+                --#{$name}-#{($i + 5) * 100}: #{shade($color, $i * 15%)};
+            }
         }
     }
-  }
 }

package/scss/common/theme/designer/_common.scss

@@ -1,5 +1,5 @@
 * {
-	box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 .p-component {
@@ -13,7 +13,8 @@
     transition-duration: $transitionDuration;
 }
 
-.p-disabled, .p-component:disabled {
+.p-disabled,
+.p-component:disabled {
     opacity: $disabledOpacity;
 }
 
@@ -37,4 +38,4 @@
     &:focus {
         @include focused();
     }
-}
+}

package/scss/common/theme/designer/_mixins.scss

@@ -1,85 +1,85 @@
 @mixin icon-override($icon) {
-	&:before {
-		content: $icon;
-	}
+    &:before {
+        content: $icon;
+    }
 }
 
 @mixin focused() {
-	outline: $focusOutline;
+    outline: $focusOutline;
     outline-offset: $focusOutlineOffset;
     box-shadow: $focusShadow;
 }
 
 @mixin focused-input() {
-	@include focused();
-	border-color: $inputFocusBorderColor;
+    @include focused();
+    border-color: $inputFocusBorderColor;
 }
 
 @mixin focused-listitem() {
-	outline: $focusOutline;
+    outline: $focusOutline;
     outline-offset: $focusOutlineOffset;
     box-shadow: $inputListItemFocusShadow;
 }
 
 @mixin invalid-input() {
-	border-color: $inputErrorBorderColor;
+    border-color: $inputErrorBorderColor;
 }
 
 @mixin menuitem-link {
-	padding: $menuitemPadding;
-	color: $menuitemTextColor;
+    padding: $menuitemPadding;
+    color: $menuitemTextColor;
     border-radius: $menuitemBorderRadius;
     transition: $listItemTransition;
     user-select: none;
 
-	.p-menuitem-text {
+    .p-menuitem-text {
         color: $menuitemTextColor;
-	}
+    }
 
-	.p-menuitem-icon {
-		color: $menuitemIconColor;
-		margin-right: $inlineSpacing;
+    .p-menuitem-icon {
+        color: $menuitemIconColor;
+        margin-right: $inlineSpacing;
     }
 
     .p-submenu-icon {
         color: $menuitemIconColor;
     }
 
-	&:not(.p-disabled):hover {
-		background: $menuitemHoverBg;
+    &:not(.p-disabled):hover {
+        background: $menuitemHoverBg;
 
-		.p-menuitem-text {
-			color: $menuitemTextHoverColor;
-		}
+        .p-menuitem-text {
+            color: $menuitemTextHoverColor;
+        }
 
-		.p-menuitem-icon {
-			color: $menuitemIconHoverColor;
+        .p-menuitem-icon {
+            color: $menuitemIconHoverColor;
         }
 
         .p-submenu-icon {
             color: $menuitemIconHoverColor;
         }
-	}
+    }
 
-	&:focus {
-		@include focused-listitem();
-	}
+    &:focus {
+        @include focused-listitem();
+    }
 }
 
 @mixin horizontal-rootmenuitem-link {
-	padding: $horizontalMenuRootMenuitemPadding;
-	color: $horizontalMenuRootMenuitemTextColor;
+    padding: $horizontalMenuRootMenuitemPadding;
+    color: $horizontalMenuRootMenuitemTextColor;
     border-radius: $horizontalMenuRootMenuitemBorderRadius;
     transition: $listItemTransition;
     user-select: none;
 
-	.p-menuitem-text {
+    .p-menuitem-text {
         color: $horizontalMenuRootMenuitemTextColor;
-	}
+    }
 
-	.p-menuitem-icon {
-		color: $horizontalMenuRootMenuitemIconColor;
-		margin-right: $inlineSpacing;
+    .p-menuitem-icon {
+        color: $horizontalMenuRootMenuitemIconColor;
+        margin-right: $inlineSpacing;
     }
 
     .p-submenu-icon {
@@ -87,40 +87,40 @@
         margin-left: $inlineSpacing;
     }
 
-	&:not(.p-disabled):hover {
-		background: $horizontalMenuRootMenuitemHoverBg;
+    &:not(.p-disabled):hover {
+        background: $horizontalMenuRootMenuitemHoverBg;
 
-		.p-menuitem-text {
-			color: $horizontalMenuRootMenuitemTextHoverColor;
-		}
+        .p-menuitem-text {
+            color: $horizontalMenuRootMenuitemTextHoverColor;
+        }
 
-		.p-menuitem-icon {
-			color: $horizontalMenuRootMenuitemIconHoverColor;
+        .p-menuitem-icon {
+            color: $horizontalMenuRootMenuitemIconHoverColor;
         }
 
         .p-submenu-icon {
             color: $horizontalMenuRootMenuitemIconHoverColor;
         }
-	}
+    }
 
-	&:focus {
-		@include focused-listitem();
-	}
+    &:focus {
+        @include focused-listitem();
+    }
 }
 
 @mixin placeholder {
-	::-webkit-input-placeholder {
-		@content
-	}
-	:-moz-placeholder {
-		@content
-	}
-	::-moz-placeholder {
-		@content
-	}
-	:-ms-input-placeholder {
-		@content
-	}
+    ::-webkit-input-placeholder {
+        @content;
+    }
+    :-moz-placeholder {
+        @content;
+    }
+    ::-moz-placeholder {
+        @content;
+    }
+    :-ms-input-placeholder {
+        @content;
+    }
 }
 
 @mixin scaledPadding($val, $scale) {