cronapp-framework-js 3.0.0-SP.9 → 3.1.0

package/css/themes/custom/krypton/panel-krypton.css

@@ -2,21 +2,24 @@
     background: var(--backgroundColor40, #14202a);
     box-shadow: none;
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 .panel-footer {
     color: var(--backgroundColor40, #14202a);
-    background: var(--backgroundColor10, #CED0D2);
+    background: var(--backgroundColor60, #ced0d2);
     border: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 .panel-body .lead {
     margin-bottom: 0;
     font-size: var(--textNormalSize, 10px);
-    border-radius: 10px;
+    border-radius: 5px;
+}
 
+.panel-heading {
+    border-bottom: unset;
 }
 
 .panel-body {
@@ -25,90 +28,90 @@
     margin: 1px 0;
     border: transparent;
     background: var(--textColor40, #f0f0f0);
-    border-radius: 10px;
+    border-radius: 5px;
     color: var(--backgroundColor40, #14202a);
 }
 
 .panel-group .panel-heading.heading-arrow {
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Default */
 .panel-default .panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
+    background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Primary */
 .panel-primary>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+    background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Success */
 .panel-success>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
+    background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Info */
 .panel-info>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
+    background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Warning */
 .panel-warning>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
+    background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Danger */
 .panel-danger>.panel-heading {
     color: var(--textColorDanger40, #fffef9);
-    background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
+    background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Light */
 .panel-light>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
+    background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Stable */
 .panel-stable>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
+    background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Royal */
 .panel-royal>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
+    background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }
 
 /* Dark */
 .panel-dark>.panel-heading {
     color: var(--textColor40, #f0f0f0);
-    background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
+    background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
     border-color: transparent;
-    border-radius: 10px;
+    border-radius: 5px;
 }

package/css/themes/custom/lumen/button-lumen.css

@@ -20,7 +20,7 @@
 .k-button.k-default:hover,
 .btn.btn-default,
 .btn.btn-default:hover {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -33,7 +33,7 @@
 .btn.btn-default:active,
 .btn.btn-default.activated,
 .btn.btn-default.active {
-    background: var(--colorDefault50, #f0f0f0);
+    background: var(--colorDefault50, #eeeeee);
     border-color: var(--colorDefault60, #d2d2d2);
 }
 
@@ -58,7 +58,7 @@
 .btn.btn-primary:active,
 .btn.btn-primary.activated,
 .btn.btn-primary.active {
-    background: var(--colorPrimary50, #f0f0f0);
+    background: var(--colorPrimary50, #eeeeee);
     border-color: var(--colorPrimary60, #d2d2d2);
 }
 
@@ -77,7 +77,7 @@
 .btn.btn-info:active,
 .btn.btn-info.activated,
 .btn.btn-info.active {
-    background: var(--colorCalm50, #f0f0f0);
+    background: var(--colorCalm50, #eeeeee);
     border-color: var(--colorCalm60, #d2d2d2);
 }
 
@@ -102,7 +102,7 @@
 .btn.btn-danger:active,
 .btn.btn-danger.activated,
 .btn.btn-danger.active {
-    background: var(--colorDanger50, #f0f0f0);
+    background: var(--colorDanger50, #eeeeee);
     border-color: var(--colorDanger60, #d2d2d2);
 }
 
@@ -121,7 +121,7 @@
 .btn.btn-warning:active,
 .btn.btn-warning.activated,
 .btn.btn-warning.active {
-    background: var(--colorWarning50, #f0f0f0);
+    background: var(--colorWarning50, #eeeeee);
     border-color: var(--colorWarning60, #d2d2d2);
 }
 
@@ -140,7 +140,7 @@
 .btn.btn-success:active,
 .btn.btn-success.activated,
 .btn.btn-success.active {
-    background: var(--colorSuccess50, #f0f0f0);
+    background: var(--colorSuccess50, #eeeeee);
     border-color: var(--colorSuccess60, #d2d2d2);
 }
 
@@ -155,7 +155,7 @@
 .btn.btn-light:active,
 .btn.btn-light.activated,
 .btn.btn-light.active {
-    background: var(--colorLight50, #f0f0f0);
+    background: var(--colorLight50, #eeeeee);
     border-color: var(--colorLight60, #d2d2d2);
 }
 

package/css/themes/custom/lumen/custom-lumen.css

@@ -37,6 +37,7 @@
 
     /* Menus - Sizes and Distances */
     --menuVerticalWidth: 270px;
+    --menuVerticalCollapsedWidth: 225px;
     --menuSideSize: 20px;
     --menuItemBarSize: 6px;
     --menuElementOverallPadding: 10px;
@@ -85,7 +86,7 @@
     --colorDefault10: #fbfbfb;
     --colorDefault20: #f7f7f7;
     --colorDefault30: #f4f4f4;
-    --colorDefault40: #f0f0f0;
+    --colorDefault40: #eeeeee;
     --colorDefault50: #d2d2d2;
     --colorDefault60: #b0b0b0;
     --colorDefault70: #838383;
@@ -242,26 +243,26 @@
     --textColorDark70: #ffffff;
 
     /* Color - Neutral (web e mobile) */
-    --colorNeutral00: #FFFFFF;
-    --colorNeutral10: #F1F1F1;
-    --colorNeutral20: #E3E3E3;
-    --colorNeutral30: #D5D5D5;
-    --colorNeutral40: #C7C7C7;
-    --colorNeutral50: #B9B9B9;
-    --colorNeutral60: #ACACAC;
-    --colorNeutral70: #9E9E9E;
+    --colorNeutral00: #ffffff;
+    --colorNeutral10: #f1f1f1;
+    --colorNeutral20: #e3e3e3;
+    --colorNeutral30: #d5d5d5;
+    --colorNeutral40: #c7c7c7;
+    --colorNeutral50: #b9b9b9;
+    --colorNeutral60: #acacac;
+    --colorNeutral70: #9e9e9e;
     --colorNeutral80: #909090;
     --colorNeutral90: #828282;
     --colorNeutral100: #747474;
     --colorNeutral110: #666666;
-    --colorNeutral120: #5D5D5D;
+    --colorNeutral120: #5d5d5d;
     --colorNeutral130: #535353;
-    --colorNeutral140: #4A4A4A;
+    --colorNeutral140: #4a4a4a;
     --colorNeutral150: #414141;
     --colorNeutral160: #383838;
-    --colorNeutral170: #2E2E2E;
+    --colorNeutral170: #2e2e2e;
     --colorNeutral180: #252525;
-    --colorNeutral190: #1C1C1C;
+    --colorNeutral190: #1c1c1c;
     --colorNeutral200: #131313;
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
@@ -269,7 +270,7 @@
     /* === Variables used exclusively in the color palette property === */
     /* Components - Button */
     --btnLink: var(--colorPrimary40, #158cba);
-    --btnDefault: var(--colorDefault40, #f0f0f0);
+    --btnDefault: var(--colorDefault40, #eeeeee);
     --btnPrimary: var(--colorPrimary40, #158cba);
     --btnSuccess: var(--colorSuccess40, #28b62c);
     --btnCalm: var(--colorCalm40, #75caeb);
@@ -339,7 +340,7 @@
     --borderCheckboxDark: var(--colorDark40, #555555);
 
     /* Components - Combobox */
-    --comboboxDefault: var(--colorDefault40, #f0f0f0);
+    --comboboxDefault: var(--colorDefault40, #eeeeee);
     --comboboxPrimary: var(--colorPrimary40, #158cba);
     --comboboxSuccess: var(--colorSuccess40, #28b62c);
     --comboboxCalm: var(--colorCalm40, #75caeb);
@@ -385,7 +386,7 @@
     --borderOptionDark: var(--colorDark40, #555555);
 
     /* Components - Panel */
-    --panelDefault: var(--colorPrimary40, #158cba);
+    --panelDefault: var(--colorDefault40, #eeeeee);
     --panelPrimary: var(--colorLight40, #f6f6f6);
     --panelSuccess: var(--colorSuccess40, #28b62c);
     --panelCalm: var(--colorCalm40, #75caeb);
@@ -396,7 +397,7 @@
     --panelRoyal: var(--colorRoyal40, #886aea);
     --panelDark: var(--colorDark40, #555555);
 
-    --borderPanelDefault: var(--colorPrimary40, #158cba);
+    --borderPanelDefault: var(--colorDefault50, #d2d2d2);
     --borderPanelPrimary: var(--colorLight50, #d7d7d7);
     --borderPanelSuccess: var(--colorSuccess40, #28b62c);
     --borderPanelCalm: var(--colorCalm40, #75caeb);
@@ -427,15 +428,15 @@ h6,
 }
 
 .color-default {
-    color: var(--colorDefault50, #d2d2d2);
+    color: var(--colorDefault40, #eeeeee);
 }
 
 .color-light {
-    color: var(--colorLight50, #d7d7d7);
+    color: var(--colorLight40, #f6f6f6);
 }
 
 .color-stable {
-    color: var(--colorStable50, #d9d9d9);
+    color: var(--colorStable40, #f8f8f8);
 }
 
 /* option - radio  */
@@ -443,17 +444,17 @@ h6,
 .k-radio:checked+.k-radio-label:before,
 .option-default .k-radio:checked+.k-radio-label:before,
 .option-default .k-radio-label:before {
-    border-color: var(--colorDefault50, #d2d2d2);
+    border-color: var(--colorDefault40, #eeeeee);
 }
 
 .option-light .k-radio:checked+.k-radio-label:before,
 .option-light .k-radio-label:before {
-    border-color: var(--colorLight50, #d7d7d7);
+    border-color: var(--colorLight40, #f6f6f6);
 }
 
 .option-default .k-radio-label:after,
 .option-default .k-radio:checked+.k-radio-label:after {
-    background: var(--colorDefault50, #d2d2d2);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -465,7 +466,7 @@ h6,
 
 .option-default .k-radio:focus+.k-radio-label::before,
 .option-default .k-radio:hover+.k-radio-label::before {
-    box-shadow: 0 0 5px 0 var(--colorDefault50, #d2d2d2);
+    box-shadow: 0 0 5px 0 var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -482,7 +483,7 @@ h6,
 
 .option-stable .k-radio-label:after,
 .option-stable .k-radio:checked+.k-radio-label:after {
-    background: var(--colorStable50, #d9d9d9);
+    background: var(--colorStable40, #f8f8f8);
     border-color: var(--colorStable50, #d9d9d9);
 }
 
@@ -578,7 +579,7 @@ h6,
 .checkbox-light .k-checkbox:indeterminate+.k-checkbox-label:before,
 .checkbox-light .k-checkbox:checked+.k-checkbox-label:after,
 .checkbox-light .k-checkbox:indeterminate+.k-checkbox-label:after {
-    background: var(--colorLight50, #d7d7d7);
+    background: var(--colorLight40, #f6f6f6);
     color: var(--textColorLight40, #222222);
 }
 
@@ -654,6 +655,10 @@ h6,
     color: var(--textColor40, #555555);
 }
 
+i.color-white.glyphicon.glyphicon-search::before {
+    color: var(--textColor40, #555555);
+}
+
 .k-grid .k-pager-numbers .k-state-selected {
     background: var(--colorPrimary50, #127ba3);
     color: var(--textColorPrimary40, #ffffff);
@@ -679,7 +684,7 @@ h6,
     background: transparent;
     border-style: solid;
     border-width: 1px 0 1px 1px;
-    border-color: var(--colorDefault40, #f0f0f0);
+    border-color: var(--colorDefault40, #eeeeee);
 }
 
 .bg-login2 #container-first {
@@ -784,8 +789,8 @@ a:hover {
 /* Banner */
 .jumbotron {
     background: var(--colorLight20, #fafafa);
-    border: 1px solid var(--colorDefault40, #f0f0f0);
-    border-top: 4px solid var(--colorDefault40, #f0f0f0);
+    border: 1px solid var(--colorDefault40, #eeeeee);
+    border-top: 4px solid var(--colorDefault40, #eeeeee);
 }
 
 .jumbotron .h1,
@@ -818,13 +823,13 @@ a:hover {
 }
 
 .dynamic-image-container .btn {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
     color: var(--textColor40, #555555);
 }
 
 .dynamic-image-container .btn:hover {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -853,7 +858,7 @@ a:hover {
 #modalPassword .modal-footer .k-button.k-danger,
 #modalPassword .modal-footer .btn.btn-danger {
     color: var(--textColorDefault40, #222222);
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -868,7 +873,6 @@ a:hover {
 }
 
 /* Crud button */
-
 .active-bar .k-button.k-default,
 .active-bar .btn.btn-default {
     background: var(--colorSuccess40, #28b62c);
@@ -1128,7 +1132,7 @@ td.k-state-focused.k-state-selected {
 .k-listview>.k-state-focused,
 .k-state-focused,
 td.k-state-focused {
-    box-shadow: inset 0 0 7px 0 var(--colorDefault40, #f0f0f0);
+    box-shadow: inset 0 0 7px 0 var(--colorDefault40, #eeeeee);
 }
 
 .k-calendar .k-today.k-state-selected.k-state-hover,
@@ -1146,4 +1150,12 @@ td.k-state-focused {
 .k-popup .k-list .k-state-focused {
     box-shadow: inset 0 0 2px 0 var(--colorPrimary30, #7daecc), inset 0 0 7px 0 var(--colorPrimary40, #158cba);
     background: transparent;
+}
+
+.combobox-default .k-multiselect .k-button {
+    border-color: var(--colorDefault50, #d2d2d2);
+    background: var(--colorDefault40, #eeeeee);
+    color: var(--textColorDefault40, #ffffff);
+    padding-left: 13px;
+    padding-right: 25px;
 }

package/css/themes/custom/lumen/navbar-lumen.css

@@ -102,5 +102,5 @@
 }
 
 label.labelCollapsibleMenu {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
 }

package/css/themes/custom/lumen/panel-lumen.css

@@ -1,7 +1,7 @@
 .panel {
     background: var(--backgroundColor40, #ffffff);
     box-shadow: none;
-    border: 1px solid var(--colorDefault40, #f0f0f0);
+    border: 1px solid var(--colorDefault40, #eeeeee);
     border-width: 0 1px 4px 1px;
 }
 
@@ -13,73 +13,77 @@
 
 /* Default */
 .panel-default .panel-heading {
-    color: var(--textColorPrimary40, #ffffff);
-    background: var(--colorPrimary40, #158cba);
+    background: var(--colorDefault40, #eeeeee);
+    color: var(--textColor40, #555555);
     border-color: transparent;
 }
 
 /* Primary */
 .panel-primary>.panel-heading {
-    color: var(--textColor40, #555555);
-    background: var(--colorLight40, #f6f6f6);
+    background: var(--colorPrimary40, #158cba);
+    color: var(--textColorPrimary40, #ffffff);
     border-color: transparent;
 }
 
 /* Sucess */
 .panel-success>.panel-heading {
-    color: var(--textColorSuccess40, #ffffff);
     background: var(--colorSuccess40, #28b62c);
+    color: var(--textColorSuccess40, #ffffff);
     border-color: transparent
 }
 
 /* Info */
 .panel-info>.panel-heading {
-    color: var(--textColorCalm40, #ffffff);
     background: var(--colorCalm40, #75caeb);
+    color: var(--textColorCalm40, #ffffff);
     border-color: transparent
 }
 
 /* Warning */
 .panel-warning>.panel-heading {
-    color: var(--textColorWarning40, #ffffff);
     background: var(--colorWarning40, #ff851b);
+    color: var(--textColorWarning40, #ffffff);
     border-color: transparent
 }
 
 /* Danger */
 .panel-danger>.panel-heading {
-    color: var(--textColorDanger40, #ffffff);
     background: var(--colorDanger40, #ff4136);
+    color: var(--textColorDanger40, #ffffff);
     border-color: transparent
 }
 
 /* Light */
 .panel-light>.panel-heading {
-    color: var(--textColor40, #555555);
     background: var(--colorLight40, #f6f6f6);
+    color: var(--textColor40, #555555);
     border-color: transparent
 }
 
 /* Stable */
 .panel-stable>.panel-heading,
 .panel-stable>.panel-footer {
-    color: var(--textColorStable40, #444444);
     background: var(--colorStable50, #d9d9d9);
+    color: var(--textColorStable40, #444444);
     border-color: transparent
 }
 
 /* Royal */
 .panel-royal>.panel-heading,
 .panel-royal>.panel-footer {
-    color: var(--textColorRoyal40, #ffffff);
     background: var(--colorRoyal40, #886aea);
+    color: var(--textColorRoyal40, #ffffff);
     border-color: transparent
 }
 
 /* Dark */
 .panel-dark>.panel-heading,
 .panel-dark>.panel-footer {
-    color: var(--textColorDark40, #ffffff);
     background: var(--colorDark40, #555555);
+    color: var(--textColorDark40, #ffffff);
     border-color: transparent
+}
+
+.panel-group .heading-arrow.panel-heading::after {
+    color: var(--textColor40, #555555);
 }

package/css/themes/custom/material/custom-material.css

@@ -37,6 +37,7 @@
 
     /* Menus - Sizes and Distances */
     --menuVerticalWidth: 270px;
+    --menuVerticalCollapsedWidth: 225px;
     --menuSideSize: 20px;
     --menuItemBarSize: 6px;
     --menuElementOverallPadding: 10px;
@@ -717,6 +718,16 @@ textarea.k-textbox:hover {
     background: var(--colorDefault50, #343c7c);
 }
 
+.dynamic-input-upload {
+     border: 1px dashed var(--colorDefault40, #3b448e);
+}
+
+.dynamic-input-upload btn{
+    border-color: transparent;
+    box-shadow: none;
+    margin: 0;
+}
+
 /* Multi select */
 .k-multiselect-wrap .k-button {
     min-height: 2em;
@@ -1136,4 +1147,4 @@ div[data-component^='crn-textinputicon'] .k-button {
 
 #cron-breadcrumbs{
     background: transparent;
-}
+}

package/css/themes/custom/material/grid-material.css

@@ -181,7 +181,7 @@ thead.k-grid-header th.k-header:last-child,
     margin: 0;
 }
 
-.k-grid tbody .k-button:hover,
+.k-grid tbody .btn .btn-primary:hover,
 .k-grid tbody .k-button:focus {
     background: var(--colorPrimary40, #5665be);
     color: var(--textColorPrimary40, #ffffff);

package/css/themes/custom/material/navbar-material.css

@@ -42,6 +42,11 @@
     color: var(--textColorDefault40, #ffffff);
     background: var(--colorDefault40, #3b448e);
     border-radius: 0;
+    margin: auto;
+}
+
+.navbar-default .navbar-nav a span {
+    margin-left: 0;
 }
 
 .dropdown-menu {
@@ -60,6 +65,12 @@
     margin-top: -1px;
 }
 
+.navbar-default #navbar2 .navbar-nav li .dropdown-menu a {
+    color: var(--textColor40, #393939);
+    margin: 0;
+    margin-left: -5px;
+}
+
 .navbar-default .navbar-toggle {
     border-color: var(--colorPrimary60, #2b3268);
 }
@@ -72,6 +83,8 @@
 .navbar-default .navbar-collapse,
 .navbar-default .navbar-form {
     border-color: transparent;
+    padding: 0;
+    margin-left: -8px;
 }
 
 .navbar-default .navbar-toggle:focus,