cronapp-framework-mobile-js 2.9.6-SP.20 → 2.9.6-SP.21

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

@@ -580,6 +580,12 @@ a.stable,
     color: var(--textColor10, #f0f0f0);
 }
 
+#menu-blue .item:hover,
+#menu-blue .item:active,
+#menu-blue .item.actived {
+    background: var(--backgroundColor30, #f4f4f4);
+}
+
 /* Button Positive */
 .button.button-positive {
     background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
@@ -587,7 +593,7 @@ a.stable,
 
 .button.button-positive:active,
 .button.button-positive.activated {
-    background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+    background: var(--colorPrimary70, #09467F);
 }
 
 /* Light - Outline */
@@ -637,16 +643,17 @@ a.stable,
     font-size: 12px;
 }
 
-#menu-blue .item:hover {
-    background: var(--backgroundColor30, #f4f4f4);
+.button.button-default {
+    background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
 }
 
 .button.button-default:hover {
     background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
 }
 
-.button.button-default:active {
-    background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
+.button.button-default:active,
+.button.button-default.activated {
+    background: var(--colorDefault60, #1c2025);
 }
 
 .login-mobile .button.button-light {
@@ -722,6 +729,7 @@ input::-ms-input-placeholder {
     background: var(--backgroundColor10, #CED0D2);
     color: var(--textColor70, #434343);
     border-radius: 20px;
+    border-bottom: 0;
 }
 
 .modal .item {
@@ -759,6 +767,10 @@ input[type="password"] {
     letter-spacing: 0px;
 }
 
+.button.button {
+    border-radius: 20px;
+}
+
 button#crn-button-signup {
     letter-spacing: 0px;
     border-radius: 0px;
@@ -806,11 +818,6 @@ button#crn-button-signup:hover {
     color: var(--textColor40, #f0f0f0);
 }
 
-.button.button-default {
-    background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
-    border-radius: 20px;
-}
-
 /*Secundary*/
 .button.button-positive {
     background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
@@ -820,6 +827,7 @@ button#crn-button-signup:hover {
     background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
     border-color: transparent;
     color: var(--textColorDefault40, #f0f0f0);
+    border-bottom: 0;
 }
 
 .button.button-positive.button-outline span {
@@ -828,6 +836,7 @@ button#crn-button-signup:hover {
 
 .button.button-positive.button-outline:active {
     background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+    border-bottom: 0;
 }
 
 .button.button-positive.button-outline i {
@@ -839,10 +848,15 @@ button#crn-button-signup:hover {
     background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
 }
 
+.button.button-balanced:active {
+    background: var(--colorSuccess70, #108D0D);
+}
+
 .button.button-balanced.button-outline {
     background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
     border-color: transparent;
     color: var(--textColorDefault40, #f0f0f0);
+    border-bottom: 0;
 }
 
 .button.button-balanced.button-outline span {
@@ -866,6 +880,7 @@ button#crn-button-signup:hover {
     background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
     border-color: transparent;
     color: var(--textColorDefault40, #f0f0f0);
+    border-bottom: 0;
 }
 
 .button.button-calm.button-outline span {
@@ -889,6 +904,7 @@ button#crn-button-signup:hover {
     background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
     border-color: transparent;
     color: var(--textColorDefault40, #f0f0f0);
+    border-bottom: 0;
 }
 
 .button.button-energized.button-outline span {
@@ -906,6 +922,7 @@ button#crn-button-signup:hover {
 /*Danger*/
 .button.button-assertive {
     background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
+    border-bottom: 0;
 }
 
 .button.button-assertive.button-outline {
@@ -929,6 +946,7 @@ button#crn-button-signup:hover {
 /*Light*/
 .button.button-light {
     background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
+    border-bottom: 0;
 }
 
 .button.button-light.button-outline {
@@ -952,6 +970,12 @@ button#crn-button-signup:hover {
 /*Stable*/
 .button.button-stable {
     background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
+    border-bottom: 0;
+}
+
+.button.button-stable:active,
+.button.button-stable.activated {
+    background: var(--colorStable50, #4D4D4D);
 }
 
 .button.button-stable.button-outline {
@@ -975,6 +999,12 @@ button#crn-button-signup:hover {
 /*Royal*/
 .button.button-royal {
     background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
+    border-bottom: 0;
+}
+
+.button.button-royal:active,
+.button.button-royal.activated {
+    background: var(--colorRoyal70, #1A2E43);
 }
 
 .button.button-royal.button-outline {
@@ -1002,10 +1032,19 @@ button#crn-button-signup:hover {
 
 }
 
+.button.button-dark:active,
+.button.button-dark.activated {
+    background: var(--colorDark50, #0A141E);
+    border-bottom: 0;
+    border-top: 0;
+}
+
 .button.button-dark.button-outline {
     background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
     border-color: transparent;
     color: var(--textColorDark40, #f0f0f0);
+    border-bottom: 0;
+    border-top: 0;
 }
 
 .button.button-dark.button-outline span {
@@ -1069,7 +1108,362 @@ button#crn-button-signup {
     color: var(--textColorDark40, #f0f0f0);
 }
 
-.item-icon-left .icon:before,
-.item-complex .item-content {
+/*Abas*/
+.crn-ion-segment-classic ul li a {
+    border-radius: 20px;
+}
+
+div.crn-ion-segment-classic ul.active-background-default li.active {
+    background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-positive li.active {
+    background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-balanced li.active {
+    background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-calm li.active {
+    background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-energized li.active {
+    background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-assertive li.active {
+    background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-light li.active {
+    background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-stable li.active {
+    background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-royal li.active {
+    background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
+}
+
+div.crn-ion-segment-classic ul.active-background-dark li.active {
+    background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
+}
+
+canvas {
+    background: var(--backgroundColor10, #CED0D2);
+}
+
+/* Cores icones*/
+.default {
+    color: var(--textColor40, #f0f0f0);
+}
+
+.positive {
+    color: var(--colorPrimary40, #197fdd);
+}
+
+.balanced {
+    color: var(--colorSuccess40, #2ffc2b);
+}
+
+.calm {
+    color: var(--colorCalm40, #44e1d8);
+}
+
+.energized {
+    color: var(--colorWarning40, #f58d11);
+}
+
+.assertive {
+    color: var(--colorDanger40, #f03a3a);
+}
+
+.light {
+    color: var(--colorLight40, #8da0b2);
+}
+
+.stable {
+    color: var(--colorStable40, #818181);
+}
+
+.royal {
+    color: var(--colorRoyal40, #0e3760);
+}
+
+.dark {
+    color: var(--colorDark40, #000000);
+}
+
+/* Cores Links*/
+.color-default {
+    color: var(--textColor40, #f0f0f0);
+}
+
+.color-positive {
+    color: var(--colorPrimary40, #197fdd);
+}
+
+.color-balanced {
+    color: var(--colorSuccess40, #2ffc2b);
+}
+
+.color-calm {
+    color: var(--colorCalm40, #44e1d8);
+}
+
+.color-energized {
+    color: var(--colorWarning40, #f58d11);
+}
+
+.color-assertive {
+    color: var(--colorDanger40, #f03a3a);
+}
+
+.color-light {
+    color: var(--colorLight40, #8da0b2);
+}
+
+.color-stable {
+    color: var(--colorStable40, #818181);
+}
+
+.color-royal {
+    color: var(--colorRoyal40, #0e3760);
+}
+
+.color-dark {
+    color: var(--colorDark40, #000000);
+}
+
+
+/*Cores Checkbox*/
+.checkbox input:before {
+    border-radius: 2px;
+}
+
+.checkbox-default input:checked:before {
+    color: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
+    border-color: var(--colorDefault40, #262c32);
+    border-radius: 2px;
+}
+
+.checkbox-positive input:checked:before {
+    color: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+    border-color: var(--colorPrimary40, #197fdd);
+    border-radius: 2px;
+}
+
+.checkbox-balanced input:checked:before {
+    color: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
+    border-color: var(--colorSuccess60, #22b920);
+    border-radius: 2px;
+}
+
+.checkbox-calm input:checked:before {
+    color: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
+    border-color: var(--colorCalm40, #44e1d8);
+    border-radius: 2px;
+}
+
+.checkbox-energized input:checked:before {
+    color: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
+    border-color: var(--colorWarning40, #f58d11);
+    border-radius: 2px;
+}
+
+.checkbox-assertive input:checked:before {
+    color: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
+    border-color: var(--colorDanger40, #f03a3a);
+    border-radius: 2px;
+}
+
+.checkbox-light input:checked:before {
+    color: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
+    border-color: var(--colorLight40, #8da0b2);
+    border-radius: 2px;
+}
+
+.checkbox-stable input:checked:before {
+    color: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
+    border-color: var(--colorStable40, #818181);
+    border-radius: 2px;
+}
+
+.checkbox-royal input:checked:before {
+    color: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
+    border-color: var(--colorRoyal40, #0e3760);
+    border-radius: 2px;
+}
+
+.checkbox-dark input:checked:before {
+    color: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
+    border-color: var(--colorDark40, #000000);
+    border-radius: 2px;
+}
+
+/*Toogle*/
+.toggle.toggle-default {
+    color: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
+}
+
+.toggle.toggle-positive {
+    color: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
+}
+
+.toggle.toggle-balanced {
+    color: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
+}
+
+.toggle.toggle-calm {
+    color: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
+}
+
+.toggle.toggle-energized {
+    color: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
+}
+
+.toggle.toggle-assertive {
+    color: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
+}
+
+.toggle.toggle-light {
+    color: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
+}
+
+.toggle.toggle-stable {
+    color: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
+}
+
+.toggle.toggle-royal {
+    color: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
+}
+
+.toggle.toggle-dark {
+    color: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
+}
+
+.k-combobox .k-dropdown-wrap .k-input,
+.k-combobox .k-dropdown-wrap .k-select {
+    background: var(--colorDark50, #0A141E);
+    color: var(--textColor40, #f0f0f0);
+}
+
+.tabs-striped .tabs,
+.tabs-striped.tabs-icon-default .tab-item.active,
+.tabs-striped .tabs .tab-item {
+    margin-top: 0px;
+    border-style: 0px;
+    border-width: 0px;
+    border-color: 0px;
+    padding: 0px;
+}
+
+.k-list .k-item {
+    background: var(--colorDark50, #0A141E);
     color: var(--textColorDark40, #f0f0f0);
+}
+
+.k-list .k-item:focus,
+.k-list .k-item:hover {
+    background: var(--backgroundColor10, #CED0D2);
+    color: var(--textColor70, #434343);
+}
+
+.k-list .k-item.k-state-selected {
+    background: var(--colorStable20, #c6c6c6);
+    color: var(--textColor70, #434343);
+}
+
+h5 {
+    font-size: 18px;
+}
+
+.k-dialog .k-dialog-titlebar:before {
+    margin-right: -35px;
+}
+
+.k-dialog-buttongroup {
+    width: 150px;
+    margin-left: 74px;
+    margin-bottom: 20px;
+}
+
+.k-dialog[data-dialog-type="success"] .k-dialog-titlebar,
+.k-dialog[data-dialog-type="success"] .k-dialog-title,
+.k-dialog[data-dialog-type="success"] .k-dialog-titlebar:before {
+    background-color: var(--backgroundColor30, #546270);
+    color: var(--colorSuccess40, #2ffc2b);
+    border: none;
+    border-radius: 30px;
+    margin-left: 45px;
+    margin-top: 20px;
+}
+
+.k-dialog-button-layout-stretched .k-primary:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
+    background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
+    color: var(--textColor40, #f0f0f0);
+    border-radius: 20px;
+    border: none;
+}
+
+.k-button.k-primary:hover {
+    background: var(--colorSuccess60, #22b920);
+    border-radius: 30px;
+    border: none;
+}
+
+.k-button.k-primary:active {
+    background: var(--colorSuccess70, #108D0D);
+    border-radius: 30px;
+    border: none;
+}
+
+.k-window {
+    background: var(--backgroundColor30, #546270);
+    border-radius: 30px;
+    border: none;
+    margin-top: 20px;
+}
+
+.k-window-content {
+    background: var(--backgroundColor30, #546270);
+    border-radius: 30px;
+    border: none;
+}
+
+.k-dialog[data-dialog-type="info"] .k-dialog-titlebar,
+.k-dialog[data-dialog-type="info"] .k-dialog-title,
+.k-dialog[data-dialog-type="info"] .k-dialog-titlebar:before {
+    background-color: var(--backgroundColor30, #546270);
+    color: var(--colorWarning40, #f58d11);
+    border-radius: 30px;
+    border: none;
+    margin-left: 37px;
+    margin-top: 20px;
+}
+
+.k-dialog[data-dialog-type="error"] .k-dialog-titlebar,
+.k-dialog[data-dialog-type="error"] .k-dialog-title,
+.k-dialog[data-dialog-type="error"] .k-dialog-titlebar:before {
+    background-color: var(--backgroundColor30, #546270);
+    color: var(--colorDanger40, #f03a3a);
+    border-radius: 30px;
+    border: none;
+    margin-left: 45px;
+    margin-top: 20px;
+}
+
+.k-dialog[data-dialog-type="warning"] .k-dialog-titlebar,
+.k-dialog[data-dialog-type="warning"] .k-dialog-title,
+.k-dialog[data-dialog-type="warning"] .k-dialog-titlebar:before {
+    background-color: var(--backgroundColor30, #546270);
+    color: var(--colorWarning40, #f58d11);
+    border-radius: 30px;
+    border: none;
+    margin-left: 45px;
+    margin-top: 20px;
 }