cronapp-framework-js 2.9.2 → 2.9.3-SP.2

package/css/themes/custom/slate/custom-slate.css

@@ -265,18 +265,42 @@
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
 
+    /* === Variables used exclusively in the color palette property === */
     /* Components - Button */
-    --btnLink: var(--colorPrimary40, #7a8288);
-    --btnDefault: var(--colorDefault40, #3a3f44);
-    --btnPrimary: var(--colorPrimary40, #7a8288);
-    --btnSuccess: var(--colorSuccess40, #62c462);
-    --btnCalm: var(--colorCalm40, #5bc0de);
-    --btnWarning: var(--colorWarning40, #f89406);
-    --btnDanger: var(--colorDanger40, #ee5f5b);
-    --btnLight: var(--colorLight40, #e9ecef);
-    --btnStable: var(--colorStable40, #f8f8f8);
-    --btnRoyal: var(--colorRoyal40, #886aea);
-    --btnDark: var(--colorDark40, #272b30);
+    --btnLink: var(--textColorDefault40, #ffffff);
+    --btnDefault: linear-gradient(var(--colorDefault40, #3a3f44), var(--colorDefault40, #3a3f44) 60%, var(--colorDefault50, #33373c));
+    --btnPrimary: linear-gradient(var(--colorPrimary60, #595f64), var(--colorPrimary60, #595f64) 40%, var(--colorPrimary50, #6b7277));
+    --btnSuccess: linear-gradient(var(--colorSuccess40, #62c462), var(--colorSuccess40, #62c462) 60%, var(--colorSuccess50, #56ac56));
+    --btnCalm: linear-gradient(var(--colorCalm40, #5bc0de), var(--colorCalm40, #5bc0de) 60%, var(--colorCalm50, #50a8c2));
+    --btnWarning: linear-gradient(var(--colorWarning40, #f89406), var(--colorWarning40, #f89406) 60%, var(--colorWarning50, #d98205));
+    --btnDanger: linear-gradient(var(--colorDanger40, #ee5f5b), var(--colorDanger40, #ee5f5b) 60%, var(--colorDanger50, #d05350));
+    --btnLight: linear-gradient(var(--colorLight40, #e9ecef), var(--colorLight40, #e9ecef) 60%, var(--colorLight50, #cccfd1));
+    --btnStable: linear-gradient(var(--colorStable40, #f8f8f8), var(--colorStable40, #f8f8f8) 60%, var(--colorStable50, #d9d9d9));
+    --btnRoyal: linear-gradient(var(--colorRoyal40, #886aea), var(--colorRoyal40, #886aea) 60%, var(--colorRoyal50, #775dcd));
+    --btnDark: linear-gradient(var(--colorDark40, #272b30), var(--colorDark40, #272b30) 60%, var(--colorDark50, #22262a));
+
+    --textColorDefault: var(--textColorDefault40, #ffffff);
+    --textColorPrimary: var(--textColorPrimary40, #ffffff);
+    --textColorSuccess: var(--textColorSuccess40, #ffffff);
+    --textColorCalm: var(--textColorCalm40, #ffffff);
+    --textColorWarning: var(--textColorWarning40, #ffffff);
+    --textColorDanger: var(--textColorDanger40, #ffffff);
+    --textColorLight: var(--textColorLight40, #000000);
+    --textColorStable: var(--textColorStable40, #444444);
+    --textColorRoyal: var(--textColorRoyal40, #ffffff);
+    --textColorDark: var(--textColorDark40, #ffffff);
+
+    --borderBtnLink: transparent;
+    --borderBtnDefault: var(--colorDefault70, #202325);
+    --borderBtnPrimary: var(--colorPrimary70, #43474a);
+    --borderBtnSuccess: var(--colorSuccess70, #366b36);
+    --borderBtnCalm: var(--colorCalm70, #32697a);
+    --borderBtnWarning: var(--colorWarning70, #885103);
+    --borderBtnDanger: var(--colorDanger70, #823432);
+    --borderBtnLight: var(--colorLight70, #808183);
+    --borderBtnStable: var(--colorStable70, #888888);
+    --borderBtnRoyal: var(--colorRoyal70, #4a3a80);
+    --borderBtnDark: var(--colorDark70, #15181a);
 
     /* Components - Text color */
     --colorDefault: var(--colorDefault30, #858789);
@@ -302,6 +326,17 @@
     --checkboxRoyal: var(--colorRoyal40, #886aea);
     --checkboxDark: var(--colorDark30, #808182);
 
+    --borderCheckboxDefault: var(--colorDefault30, #858789);
+    --borderCheckboxPrimary: var(--colorPrimary40, #7a8288);
+    --borderCheckboxSuccess: var(--colorSuccess40, #62c462);
+    --borderCheckboxCalm: var(--colorCalm40, #5bc0de);
+    --borderCheckboxWarning: var(--colorWarning40, #f89406);
+    --borderCheckboxDanger: var(--colorDanger40, #ee5f5b);
+    --borderCheckboxLight: var(--colorLight40, #e9ecef);
+    --borderCheckboxStable: var(--colorStable40, #f8f8f8);
+    --borderCheckboxRoyal: var(--colorRoyal40, #886aea);
+    --borderCheckboxDark: var(--colorDark30, #808182);
+
     /* Components - Combobox */
     --comboboxDefault: var(--colorDefault40, #3a3f44);
     --comboboxPrimary: var(--colorPrimary40, #7a8288);
@@ -314,6 +349,17 @@
     --comboboxRoyal: var(--colorRoyal40, #886aea);
     --comboboxDark: var(--colorDark40, #272b30);
 
+    --borderComboboxDefault: var(--colorDefault50, #33373c);
+    --borderComboboxPrimary: var(--colorPrimary50, #6b7277);
+    --borderComboboxSuccess: var(--colorSuccess50, #56ac56);
+    --borderComboboxCalm: var(--colorCalm50, #50a8c2);
+    --borderComboboxWarning: var(--colorWarning50, #d98205);
+    --borderComboboxDanger: var(--colorDanger50, #d05350);
+    --borderComboboxLight: var(--colorLight50, #cccfd1);
+    --borderComboboxStable: var(--colorStable50, #d9d9d9);
+    --borderComboboxRoyal: var(--colorRoyal50, #775dcd);
+    --borderComboboxDark: var(--colorDark50, #22262a);
+
     /* Components - Radio input */
     --optionDefault: var(--colorDefault30, #858789);
     --optionPrimary: var(--colorPrimary40, #7a8288);
@@ -326,6 +372,17 @@
     --optionRoyal: var(--colorRoyal40, #886aea);
     --optionDark: var(--colorDark30, #808182);
 
+    --borderOptionDefault: var(--colorDefault30, #858789);
+    --borderOptionPrimary: var(--colorPrimary40, #7a8288);
+    --borderOptionSuccess: var(--colorSuccess40, #62c462);
+    --borderOptionCalm: var(--colorCalm40, #5bc0de);
+    --borderOptionWarning: var(--colorWarning40, #f89406);
+    --borderOptionDanger: var(--colorDanger40, #ee5f5b);
+    --borderOptionLight: var(--colorLight40, #e9ecef);
+    --borderOptionStable: var(--colorStable40, #f8f8f8);
+    --borderOptionRoyal: var(--colorRoyal40, #886aea);
+    --borderOptionDark: var(--colorDark30, #808182);
+
     /* Components - Panel */
     --panelDefault: var(--colorPrimary40, #7a8288);
     --panelPrimary: var(--colorDefault40, #3a3f44);
@@ -337,6 +394,20 @@
     --panelStable: var(--colorStable40, #f8f8f8);
     --panelRoyal: var(--colorRoyal40, #886aea);
     --panelDark: var(--colorDark30, #808182);
+
+    --borderPanelLink: transparent;
+    --borderPanelDefault: transparent;
+    --borderPanelPrimary: transparent;
+    --borderPanelSuccess: transparent;
+    --borderPanelCalm: transparent;
+    --borderPanelWarning: transparent;
+    --borderPanelDanger: transparent;
+    --borderPanelLight: transparent;
+    --borderPanelStable: transparent;
+    --borderPanelRoyal: transparent;
+    --borderPanelDark: transparent;
+
+    /* === End - Variables used exclusively in the color palette property === */
 }
 
 .color-default {
@@ -427,17 +498,12 @@ a:hover {
 /* Page login */
 .bg,
 .siginPanel,
-.bg-login #container-second,
 .login-view {
     background: var(--backgroundLogin40, #ffffff);
 }
 
-.bg-login #container-second h1,
-.bg-login #container-second p,
-#crn-botao-cadastre,
-.login-view .sign-up,
-.crn-anchor-signup-back {
-    color: var(--textColor40, #555555);
+.bg-login #container-first h1 {
+    color: var(--textColorPrimary40, #ffffff);
 }
 
 .bg-login #container-first .btn-login-mutual,
@@ -459,10 +525,40 @@ a:hover {
     color: var(--textColorPrimary40, #ffffff);
 }
 
+.bg-login #container-first .img-login[src="node_modules/cronapp-framework-js/img/cronapp-logo-login.png"],
 .login-view img[src="node_modules/cronapp-framework-js/img/cronapp-logo-login.png"] {
     filter: brightness(0) invert(1);
 }
 
+.bg-login #container-second {
+    background: linear-gradient(-140deg, var(--colorDefault20, #b3b4b5), var(--colorDefault30, #858789), var(--colorDefault40, #3a3f44), var(--colorDefault50, #33373c), var(--colorDefault60, #2a2e32));
+}
+
+.bg-login #container-first #crn-botao-signup {
+    color: var(--colorPrimary40, #7a8288);
+}
+
+.bg-login #container-first #crn-botao-signup:hover {
+    color: var(--colorPrimary50, #6b7277);
+}
+
+.bg-login #container-first {
+    background: var(--colorDefault50, #33373c);
+    border-style: solid;
+    border-width: 1px 0 1px 1px;
+    border-color: var(--colorDefault50, #33373c);
+    box-shadow: none;
+}
+
+#bg-signup1.bg-login1 #container-first {
+    box-shadow: none;
+}
+
+.bg-login2 #container-first {
+    border-width: 0;
+    background: transparent;
+}
+
 /* Input */
 .k-autocomplete .k-input,
 .k-multiselect-wrap,
@@ -661,20 +757,7 @@ a:hover {
 .k-checkbox:hover+.k-checkbox-label:before,
 .k-checkbox:checked+.k-checkbox-label:after,
 .k-checkbox:indeterminate+.k-checkbox-label:after,
-.k-checkbox-label:before,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:indeterminate+.k-checkbox-label:before,
-.checkbox-default .k-checkbox-label:hover:before,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:hover:before,
-.checkbox-default .k-checkbox:checked:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox-label:active:before,
-.checkbox-default .k-checkbox:active+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:focus+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:after,
-.checkbox-default .k-checkbox:indeterminate+.k-checkbox-label:after,
-.checkbox-default .k-checkbox-label:before {
+.k-checkbox-label:before {
     border-color: var(--colorDefault30, #858789);
 }
 
@@ -683,24 +766,14 @@ a:hover {
 .k-checkbox:checked:hover+.k-checkbox-label:before,
 .k-checkbox:hover+.k-checkbox-label:before,
 .k-checkbox:focus+.k-checkbox-label:before,
-.k-checkbox:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox-label:hover:before,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:hover:before,
-.checkbox-default .k-checkbox:checked:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:hover+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:focus+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:hover+.k-checkbox-label:before {
+.k-checkbox:hover+.k-checkbox-label:before {
     box-shadow: 0 0 5px 0 var(--colorDefault20, #b3b4b5);
 }
 
 .k-checkbox:checked+.k-checkbox-label:before,
 .k-checkbox:indeterminate+.k-checkbox-label:before,
 .k-checkbox:checked+.k-checkbox-label:after,
-.k-checkbox:indeterminate+.k-checkbox-label:after,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:indeterminate+.k-checkbox-label:before,
-.checkbox-default .k-checkbox:checked+.k-checkbox-label:after,
-.checkbox-default .k-checkbox:indeterminate+.k-checkbox-label:after {
+.k-checkbox:indeterminate+.k-checkbox-label:after {
     background: var(--colorDefault30, #858789);
     color: var(--textColorDefault40, #ffffff);
 }
@@ -1065,8 +1138,6 @@ td.k-state-focused.k-state-selected {
     color: var(--textColorPrimary40, #ffffff);
 }
 
-.k-scheduler-edit-form .k-edit-field .k-button,
-.k-edit-form-container .k-edit-buttons .k-primary,
 .k-scheduler .k-state-selected>.k-link,
 .k-scheduler .k-scheduler-toolbar .k-state-selected,
 .k-scheduler .k-today.k-state-selected,
@@ -1118,8 +1189,6 @@ td.k-state-focused.k-state-selected {
     box-shadow: inset 0 0 10px 3px var(--colorDefault40, #3a3f44);
 }
 
-.k-scheduler-edit-form .k-edit-field .k-button,
-.k-edit-form-container .k-edit-buttons .k-primary,
 .k-scheduler .k-scheduler-toolbar .k-state-selected,
 .k-scheduler .k-today.k-state-selected,
 .k-scheduler-navigation .k-nav-prev .k-link,
@@ -1132,48 +1201,52 @@ td.k-state-focused.k-state-selected {
 
 .k-scheduler-navigation .k-nav-prev .k-link:hover,
 .k-scheduler div.k-scheduler-footer .k-link:hover,
-.k-scheduler div.k-scheduler-footer ul li:hover,
-.k-scheduler-edit-form .k-edit-field .k-button:hover,
-.k-edit-form-container .k-edit-buttons .k-primary:hover {
+.k-scheduler div.k-scheduler-footer ul li:hover{
     background: linear-gradient(var(--colorPrimary60, #595f64), var(--colorPrimary60, #595f64) 40%, var(--colorPrimary50, #6b7277));
     box-shadow: none;
     border-color: var(--colorPrimary40, #7a8288);
     color: var(--textColorPrimary40, #ffffff);
 }
 
-.k-edit-form-container .k-edit-buttons .k-scheduler-cancel {
-    background: linear-gradient(var(--colorDanger40, #ee5f5b), var(--colorDanger40, #ee5f5b) 60%, var(--colorDanger50, #d05350));
-    border-color: var(--colorDanger40, #ee5f5b);
-    color: var(--textColorDanger40, #ffffff);
+.k-scheduler-table .k-today,
+.k-today>.k-scheduler-datecolumn,
+.k-today>.k-scheduler-groupcolumn {
+    background: var(--colorDefault50, #33373c);
 }
 
-.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:hover {
-    background: linear-gradient(var(--colorDanger60, #ae4643), var(--colorDanger60, #ae4643) 40%, var(--colorDanger50, #d05350));
-    box-shadow: none;
-    border-color: var(--colorDanger40, #ee5f5b);
-    color: var(--textColorDanger40, #ffffff);
+.k-scheduler-monthview .k-scheduler-table .k-today {
+    background: var(--colorPrimary40, #7a8288);
+    color: var(--textColorPrimary40, #ffffff);
 }
 
-.k-edit-form-container .k-edit-buttons .k-primary {
-    background: linear-gradient(var(--colorSuccess40, #62c462), var(--colorSuccess40, #62c462) 60%, var(--colorSuccess50, #56ac56));
-    border-color: var(--colorSuccess40, #62c462);
-    color: var(--textColorSuccess40, #ffffff);
+.k-edit-form-container .k-edit-buttons,
+.k-window .k-window-titlebar.k-header {
+    border-color: var(--backgroundColor70, #15181a);
 }
 
-.k-edit-form-container .k-edit-buttons .k-primary:hover {
-    background: linear-gradient(var(--colorSuccess60, #489048), var(--colorSuccess60, #489048) 40%, var(--colorSuccess50, #56ac56));
-    box-shadow: none;
-    border-color: var(--colorSuccess40, #62c462);
-    color: var(--textColorSuccess40, #ffffff);
+/* Input with icon */
+.layout-template-modern {
+    background: var(--colorNeutral00, #ffffff);
+    border-radius: var(--borderRadiusSmallest, 5px);
+    padding: 0;
+    border: 1px solid var(--backgroundColor50, #dddddd);
 }
 
-.k-scheduler-table .k-today,
-.k-today>.k-scheduler-datecolumn,
-.k-today>.k-scheduler-groupcolumn {
-    background: var(--colorDefault50, #33373c);
+.layout-template-modern:focus-within {
+    background: var(--colorNeutral00, #ffffff);
+    outline: 0;
+    border-color: var(--colorCalm40, #5bc0de);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px var(--colorCalm40, #5bc0de);
 }
 
-.k-scheduler-monthview .k-scheduler-table .k-today {
-    background: var(--colorPrimary40, #7a8288);
-    color: var(--textColorPrimary40, #ffffff);
+.layout-template-modern input.k-textbox:hover,
+.layout-template-modern input.k-textbox {
+    padding-left: 0;
+    box-shadow: none;
+}
+
+div[data-component^='crn-textinputicon'] .layout-template-modern .k-button,
+div[data-component^='crn-textinputicon'] .layout-template-modern .k-button:hover {
+    border: 0;
+    color: var(--colorDefault40, #3b448e);
 }

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

@@ -1,87 +1,85 @@
 .panel {
     background: var(--backgroundColor40, #ffffff);
     box-shadow: none;
-    border: 1px solid var(--colorDefault70, #fafafa);
+    border: 1px solid #000;
 }
 
-.panel-heading,
-.panel-footer {
-    border: 0;
-    border-bottom: 1px solid;
+.panel-heading {
+    border-bottom: 1px solid #000;
 }
 
 .panel-footer {
     color: var(--textColorDefault40, #ffffff);
     background: var(--colorDefault40, #3a3f44);
-    border-color: var(--colorDefault70, #202325);
+    border-top: 1px solid #000;
 }
 
 /* Default */
 .panel-default .panel-heading {
     color: var(--textColorPrimary40, #ffffff);
     background: var(--colorPrimary40, #7a8288);
-    border-color: var(--colorPrimary70, #43474a);
+    border-color: #000;
 }
 
 /* Primary */
 .panel-primary .panel-heading {
     color: var(--textColorDefault40, #ffffff);
     background: var(--colorDefault40, #3a3f44);
-    border-color: var(--colorDefault70, #202325);
+    border-color: #000;
 }
 
 /* Success */
 .panel-success .panel-heading {
     color: var(--textColorSuccess40, #ffffff);
     background: var(--colorSuccess40, #73a839);
-    border-color: var(--colorSuccess70, #202325);
+    border-color: #000;
 }
 
 /* Info */
 .panel-info .panel-heading {
     color: var(--textColorCalm40, #ffffff);
     background: var(--colorCalm40, #5bc0de);
-    border-color: var(--colorInfo70, #32697a);
+    border-color: #000;
 }
 
 /* Warning */
 .panel-warning .panel-heading {
     color: var(--textColorWarning40, #ffffff);
     background: var(--colorWarning40, #f89406);
-    border-color: var(--colorWarning70, #885103);
+    border-color: #000;
 }
 
 /* Danger */
 .panel-danger .panel-heading {
     color: var(--textColorDanger40, #ffffff);
     background: var(--colorDanger40, #ee5f5b);
-    border-color: var(--colorDanger70, #823432);
+    border-color: #000;
 }
 
 /* Light */
 .panel-light .panel-heading {
     color: var(--textColorLight40, #444444);
     background: var(--colorLight40, #e9ecef);
-    border-color: var(--colorLight70, #000000);
+    border-color: #000;
 }
 
 /* Stable */
-.panel-stable>.panel-heading{
+.panel-stable>.panel-heading {
     color: var(--textColorStable40, #444444);
     background: var(--colorStable40, #f8f8f8);
-    border-color: transparent
+    border-color: #000;
 }
 
 /* Royal */
 .panel-royal>.panel-heading {
     color: var(--textColorRoyal40, #ffffff);
     background: var(--colorRoyal40, #886aea);
-    border-color: transparent
+    border-color: #000;
 }
 
 /* Dark */
 .panel-dark>.panel-heading {
     color: var(--textColorDark40, #ffffff);
     background: var(--colorDark30, #272b30);
-    border-color: transparent
+    border-color: #000;
 }

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

@@ -1,3 +1,7 @@
+.k-scheduler-edit-form .k-edit-field .k-button,
+.k-edit-form-container .k-edit-buttons .k-primary,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel,
 .btn,
 .k-button {
     background: var(--colorDefault40, #474949);
@@ -48,6 +52,8 @@
 }
 
 /* Primary */
+.k-scheduler-edit-form .k-edit-field .k-button,
+.k-edit-form-container .k-edit-buttons .k-primary,
 .k-button.k-primary,
 .btn.btn-primary {
     background: linear-gradient(var(--colorPrimary30, #899cb7), var(--colorPrimary40, #446e9b) 50%, var(--colorPrimary50, #3c6088));
@@ -55,6 +61,10 @@
     color: var(--textColorPrimary40, #ffffff);
 }
 
+.k-scheduler-edit-form .k-edit-field .k-button:hover,
+.k-edit-form-container .k-edit-buttons .k-primary:hover,
+.k-scheduler-edit-form .k-edit-field .k-button:focus,
+.k-edit-form-container .k-edit-buttons .k-primary:focus,
 .k-button.k-primary:focus,
 .k-button.k-primary:hover,
 .btn.btn-primary:focus,
@@ -63,6 +73,8 @@
     background: linear-gradient(var(--colorPrimary30, #899cb7), var(--colorPrimary50, #3c6088) 50%, var(--colorPrimary60, #325172));
 }
 
+.k-scheduler-edit-form .k-edit-field .k-button:active,
+.k-edit-form-container .k-edit-buttons .k-primary:active,
 .k-button.k-primary.active,
 .k-button.k-primary:active,
 .btn.btn-primary.active,
@@ -127,6 +139,8 @@
 
 
 /* Danger */
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel,
 .k-button.k-danger,
 .btn.btn-danger {
     background: linear-gradient(var(--colorDanger30, #da7b7b), var(--colorDanger40, #cd0200) 50%, var(--colorDanger50, #b30200));
@@ -134,6 +148,10 @@
     color: var(--textColorDanger40, #ffffff);
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:hover,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:hover,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:focus,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:focus,
 .k-button.k-danger:focus,
 .k-button.k-danger:hover,
 .btn.btn-danger:focus,
@@ -142,6 +160,8 @@
     background: linear-gradient(var(--colorDanger30, #da7b7b), var(--colorDanger50, #b30200) 50%, var(--colorDanger60, #960100));
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:active,
 .k-button.k-danger.active,
 .k-button.k-danger:active,
 .btn.btn-danger.active,