cronapp-framework-js 3.0.0-SP.3 → 3.0.0-SP.31

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/custom-lumen.css

@@ -37,6 +37,7 @@
 
     /* Menus - Sizes and Distances */
     --menuVerticalWidth: 270px;
+    --menuVerticalCollapsedWidth: 225px;
     --menuSideSize: 20px;
     --menuItemBarSize: 6px;
     --menuElementOverallPadding: 10px;

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;

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

@@ -72,6 +72,8 @@
 .navbar-default .navbar-collapse,
 .navbar-default .navbar-form {
     border-color: transparent;
+    padding: 0;
+    margin-left: -8px;
 }
 
 .navbar-default .navbar-toggle:focus,

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

@@ -37,6 +37,7 @@
 
     /* Menus - Sizes and Distances */
     --menuVerticalWidth: 270px;
+    --menuVerticalCollapsedWidth: 225px;
     --menuSideSize: 20px;
     --menuItemBarSize: 6px;
     --menuElementOverallPadding: 10px;
@@ -44,7 +45,7 @@
     --menuItemIconWidth: 25px;
 
     /* Background */
-    --backgroundColor10: #fbfbfb;
+    --backgroundColor10: #fffef9;
     --backgroundColor20: #f8f8f8;
     --backgroundColor30: #f5f5f5;
     --backgroundColor40: #f2f2f2;
@@ -199,7 +200,7 @@
     --colorLight40: #eadede;
     --colorLight50: #cdc2c2;
     --colorLight60: #dcc8c8;
-    --colorLight70: #807a7a;
+    --colorLight70: #cebaba;
     --textColorLight10: #252525;
     --textColorLight20: #313131;
     --textColorLight30: #3b3b3b;
@@ -241,26 +242,26 @@
     --textColorDark70: #fffffd;
 
     /* 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;
@@ -416,7 +417,49 @@
     border-radius: var(--borderRadiusExtraSmall, 10px);
 }
 
+.btn.btn-primary {
+    background: var(--colorPrimary40, #68afd9);
+    border-color: transparent;
+    color: var(--textColorPrimary40, #fffef9);
+}
+
+.btn.btn-success:active {
+    background: var(--colorSuccess70, #365c3b);
+}
+
+.btn.btn-info:active {
+    background: var(--colorCalm60, #6593ae);
+}
+
+.k-button.k-warning.active,
+.k-button.k-warning:active,
+.btn.btn-warning.active,
+.btn.btn-warning:active {
+    background: var(--colorWarning60, #ab5e3d);
+}
+
+.btn.btn-stable:active {
+    background: var(--colorStable70, #717171);
+}
+
+.btn.btn-light:hover {
+    color: var(--textColorLight40, #434343);
+    background: var(--colorLight60, #dcc8c8);
+    border-color: transparent;
+    outline: none;
+}
+
+.btn.btn-light:active {
+    background: var(--colorLight70, #cebaba);
+}
+
+.btn.btn-royal:active {
+    background: var(--colorRoyal70, #1a0e2b);
+}
 
+.btn.btn-dark:active {
+    background: var(--colorDark70, #1c1c1c);
+}
 
 .k-button.active,
 .k-button:active,
@@ -467,6 +510,10 @@ textarea.k-textbox:hover {
     margin: 0;
 }
 
+.k-widget.k-multiselect {
+    background: transparent;
+}
+
 .cardinput {
     padding: 0;
 }
@@ -516,7 +563,6 @@ input.k-textbox:hover:focus,
 }
 
 /* Date and Hour */
-
 .bootstrap-datetimepicker-widget .timepicker-hour,
 .bootstrap-datetimepicker-widget .timepicker-minute,
 .bootstrap-datetimepicker-widget .timepicker-second {
@@ -619,8 +665,10 @@ input .k-textbox {
 }
 
 .login-view .reset-password {
-    text-align: right;
-    right: 20px;
+    text-align: end;
+    width: 100%;
+    max-width: 600px;
+    right: 12px;
 }
 
 .login-view input.k-textbox {
@@ -656,7 +704,6 @@ textarea.k-textbox {
     background: var(--backgroundColor, #f2f2f2);
 }
 
-#modalCookies p,
 #modalCookies label,
 .privacy-view .modal-cookies h1 {
     color: var(--textColor40, #434343);
@@ -667,12 +714,7 @@ textarea.k-textbox {
     filter: brightness(0) invert(1);
 }
 
-.navbar-brand>img {
-    filter: brightness(0) invert(1)
-}
-
 /*Backgrounds login*/
-
 .bg-login #container-second {
     background: var(--colorDefault40, #442b69);
 }
@@ -729,7 +771,6 @@ label.labelCollapsibleMenu {
 }
 
 /*Links Colors*/
-
 .color-default {
     color: var(--colorDefault40, #442b69);
 }
@@ -775,6 +816,14 @@ label.labelCollapsibleMenu {
     color: var(--colorWarning50, #dc7144);
 }
 
+.color-danger {
+    color: var(--colorDanger40, #e34646);
+}
+
+.color-danger:hover {
+    color: var(--colorDanger60, #a63333);
+}
+
 .color-light {
     color: var(--colorLight40, #eadede);
 }
@@ -851,7 +900,6 @@ label.labelCollapsibleMenu {
 }
 
 /* Lista Opção*/
-
 .k-radio-label:after,
 .k-radio:checked+.k-radio-label:after,
 .option-default .k-radio-label:after,
@@ -893,7 +941,6 @@ label.labelCollapsibleMenu {
 .option-info .k-radio-label:after,
 .option-info .k-radio:checked+.k-radio-label:after {
     background: var(--colorCalm40, #8ac8ee);
-
 }
 
 .option-info .k-radio:checked+.k-radio-label:before,
@@ -965,9 +1012,7 @@ label.labelCollapsibleMenu {
     background: var(--colorDark40, #343434);
 }
 
-
 /*Checkbox*/
-
 /*Default*/
 .k-checkbox:checked+.k-checkbox-label:before,
 .k-checkbox:indeterminate+.k-checkbox-label:before,
@@ -1064,7 +1109,21 @@ label.labelCollapsibleMenu {
 
 /* Button dynamic image*/
 .dynamic-image-container .btn {
-    background: var(--colorDefault40);
+    background: var(--colorDefault40, #442b69);
+}
+
+.dynamic-image-container {
+    border-style: dashed;
+    border: 1px dashed var(--colorDefault40, #442b69);
+    border-radius: var(--borderRadiusSmallest, 5px);
+    padding: 20px;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex-wrap: wrap;
+    text-align: center;
 }
 
 .dynamic-image-container .btn:focus,
@@ -1077,7 +1136,6 @@ label.labelCollapsibleMenu {
 }
 
 /*Buttons Multiselect*/
-
 .k-multiselect .k-button {
     border: unset;
 }
@@ -1193,7 +1251,6 @@ label.labelCollapsibleMenu {
 }
 
 /*Agendador*/
-
 .k-scheduler .k-today.k-state-selected,
 .k-scheduler-navigation .k-nav-prev .k-link,
 .k-scheduler .k-state-selected>.k-link,
@@ -1315,7 +1372,6 @@ cron-scheduler .k-link:link,
 }
 
 /* Button edit form*/
-
 .k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone,
 .k-edit-form-container .k-edit-buttons .k-scheduler-cancel,
 .k-button.k-danger,
@@ -1383,7 +1439,6 @@ span.k-datetimepicker .k-select+.k-select {
 }
 
 /*Widget*/
-
 .k-window .k-window-titlebar.k-header,
 .k-edit-form-container .k-edit-buttons {
     background: var(--textColorDefault40, #fffef9);
@@ -1453,11 +1508,65 @@ span.k-datetimepicker .k-select+.k-select {
 }
 
 /*Modais*/
+.modal-title {
+    margin: 0;
+    line-height: 1.42857143;
+    text-align: center;
+    color: var(--textColor40, #434343);
+    font-weight: 700;
+}
+
+.modal-content {
+    border-radius: 20px;
+    background: var(--backgroundColor10, #fffef9);
+}
+
+.modal-body {
+    position: relative;
+    padding: 15px;
+    text-align: center;
+    color: var(--textColor40, #434343);
+}
 
 .cronapp-icon.cronapp-error {
     color: var(--colorDanger40, #e34646);
 }
 
+.k-dialog-buttongroup .k-button {
+    background: var(--colorDanger40, #e34646);
+    color: var(--textColorDanger40, #fffef9);
+}
+
+.k-dialog-buttongroup .k-button:hover,
+.k-dialog-buttongroup .k-button:focus {
+    background: var(--colorDanger50, #d43131);
+    color: var(--textColorDanger50, #fffef9);
+    box-shadow: unset;
+}
+
+.k-dialog-buttongroup .k-button:active {
+    background: var(--colorDanger70, #7c2626);
+}
+
+#modalTemplateCancel.btn.btn-secondary:active {
+    background: var(--colorDefault70, #25183a);
+    border: unset;
+}
+
+.modal-footer .btn+.btn {
+    margin-bottom: 0;
+    margin-left: 5px;
+    background: var(--colorDanger40, #e34646);
+}
+
+.modal-footer .btn+.btn:hover {
+    background: var(--colorDanger50, #d43131);
+}
+
+.modal-footer .btn+.btn:active {
+    background: var(--colorDanger70, #7c2626);
+}
+
 #modalBodyConfirmDialog .title {
     font-size: var(--textMediumSize, 18px);
     font-weight: 700;
@@ -1465,6 +1574,12 @@ span.k-datetimepicker .k-select+.k-select {
     color: var(--textColor40, #434343);
 }
 
+.modal .modal-content .list-group-item {
+    border: 0;
+    padding: 10px 0;
+    text-align: justify;
+}
+
 .k-dialog.k-dialog-titleless .k-content {
     box-sizing: content-box;
     background: var(--textColorDefault40, #fffef9);
@@ -1475,7 +1590,6 @@ span.k-datetimepicker .k-select+.k-select {
     color: var(--colorDefault40, #442b69);
 }
 
-.k-scheduler-edit-form .k-edit-field .k-button:active,
 .k-edit-form-container .k-edit-buttons .k-primary:active,
 .k-scheduler-edit-form .k-edit-field .k-button.active,
 .k-edit-form-container .k-edit-buttons .k-primary.active,
@@ -1508,4 +1622,43 @@ button.btn.k-button.btn-block.btn-danger.btn-fab {
     border-color: transparent;
     color: var(--textColorDanger40, #fffef9);
     border-radius: 20px;
+}
+
+/*Fonts*/
+.h5 {
+    font-size: var(--textNormalSize, 12px);
+    color: var(--textColor40, #434343);
+}
+
+p {
+    font-size: var(--textNormalSize, 12px);
+    color: var(--textColor40, #434343);
+}
+
+/*Modal cookies*/
+.privacy-view .modal-cookies .form-group {
+    margin-bottom: 0;
+    margin-top: 20px;
+    text-align: justify;
+}
+
+#modalCookies .list-group p {
+    margin-top: 5px;
+    text-align: justify;
+}
+
+.privacy-view .modal-cookies .modal-header .close span {
+    font-size: var(--textMediumSize, 16px);
+    color: var(--textColor40, #434343);
+    padding: 0 10px;
+}
+
+#modalCookies p {
+    text-align: justify;
+    color: var(--textColor40, #434343);
+}
+
+span.k-widget.k-dropdown.cronDynamicSelect,
+span.k-widget.k-combobox.cronSelect.k-combobox-clearable {
+    border-radius: 20px;
 }