cronapp-framework-js 3.2.1 → 4.0.0

package/css/themes/custom/dsgov/custom-dsgov.css

@@ -1303,4 +1303,30 @@ div[id^="crn-signature-pad"] canvas {
 
 #cron-breadcrumbs{
     background: transparent;
-}
+}
+
+/* wizard */
+.ctn-wizard .nav-wizard > li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #1351b4);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard > li.active .step-circle,
+.ctn-wizard .nav-wizard > li.completed .step-circle {
+    background-color: var(--colorDefault40, #1351b4);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .nav-wizard > li.active .step-title,
+.ctn-wizard .nav-wizard > li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorPrimary40, #1351b4);
+}

package/css/themes/custom/flatly/custom-flatly.css

@@ -1006,4 +1006,46 @@ textarea.k-textbox,
 
 .cardinput{
     padding: 0;
-}
+}
+
+/*wizard */
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorSuccess40, #18bc9c);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorSuccess40, #18bc9c);
+    color: var(--textColorSuccess40, #ffffff);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorSuccess40, #ffffff);
+    color: var(--colorSuccess40, #18bc9c);
+    border-radius: 50%;
+    border: 2px solid var(--colorSuccess40, #18bc9c);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorSuccess40, #18bc9c);
+}

package/css/themes/custom/fuse/custom-fuse.css

@@ -1245,4 +1245,33 @@ div[data-component="crn-grid"] .k-grid-header th.k-header {
 
 #cron-breadcrumbs{
     background: transparent;
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard > li.active .step-circle,
+.ctn-wizard .nav-wizard > li.completed .step-circle {
+    background-color: var(--colorDefault40, #3b448e);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--colorDefault40, #3b448e);
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #3b448e);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard > li.active .step-title,
+.ctn-wizard .nav-wizard > li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorDefault40, #3b448e);
+}

package/css/themes/custom/journal/custom-journal.css

@@ -1061,4 +1061,46 @@ input::placeholder,
 
 .cardinput {
     padding: 0;
-}
+}
+
+/* wizard*/
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--textColor30, #7f7f7f);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--textColor30, #7f7f7f);
+    color: var(--textColorPrimary40, #ffffff);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorPrimary40, #ffffff);
+    color: var(--textColor30, #7f7f7f);
+    border-radius: 50%;
+    border: 2px solid var(--textColor30, #7f7f7f);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColor30, #7f7f7f);
+}

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

@@ -1158,4 +1158,46 @@ td.k-state-focused {
     color: var(--textColorDefault40, #ffffff);
     padding-left: 13px;
     padding-right: 25px;
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--textColorLight30, #1e1e1e);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorLight50, #d7d7d7);
+    color: var(--textColorLight30, #1e1e1e);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorLight40, #ffffff);
+    color: var(--textColorLight30, #1e1e1e);
+    border-radius: 50%;
+    border: 2px solid var(--textColorLight30, #1e1e1e);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColorLight30, #1e1e1e);
+}

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

@@ -1147,4 +1147,39 @@ div[data-component^='crn-textinputicon'] .k-button {
 
 #cron-breadcrumbs{
     background: transparent;
-}
+}
+
+/*Wizzard*/
+.ctn-wizard .step-circle {
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--colorDefault40, #3b448e);
+    border: 2px solid var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title,
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle,
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorDefault40, #3b448e);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #3b448e);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+.ctn-wizard .nav-wizard>li.active.invalid-step .step-circle::after {
+    border-color: var(--colorDanger40: #ce3a36);
+}

package/css/themes/custom/paper/custom-paper.css

@@ -1463,4 +1463,46 @@ td.k-state-focused {
     background: var(--colorDark40, #444444);
     border-color: transparent;
     color: var(--textColorDark40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--textColorDefault40, #444444);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--textColorDefault40, #444444);
+    color: var(--textColorDefault30, #ffffff);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault30, #ffffff);
+    color: var(--textColorDefault40, #444444);
+    border-radius: 50%;
+    border: 2px solid var(--textColorDefault40, #444444);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColorDefault40, #444444);
+}

package/css/themes/custom/readable/custom-readable.css

@@ -1300,4 +1300,46 @@ td.k-state-focused {
     background: var(--colorDark40, #444444);
     border-color: var(--colorDark50, #3c3c3c);
     color: var(--textColorDark40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColorDefault40, #333333);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault30, #ffffff);
+    color: var(--textColorDefault40, #333333);
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault50, #dfdfdf);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--textColorDefault40, #333333);
+    color: var(--textColorDefault30, #ffffff);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault50, #dfdfdf);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}

package/css/themes/custom/sandstone/custom-sandstone.css

@@ -1020,4 +1020,46 @@ td.k-state-focused.k-state-selected,
 
 .bootstrap-datetimepicker-widget.dropdown-menu.top:after {
     border-top-color: var(--backgroundColor40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColor40, #393939);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--textColor40, #393939);
+    border-radius: 50%;
+    border: 2px solid var(--textColor40, #393939);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--textColor40, #393939);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--textColor40, #393939); 
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}

package/css/themes/custom/simplex/custom-simplex.css

@@ -972,4 +972,45 @@ td.k-state-focused.k-state-selected,
 
 .bootstrap-datetimepicker-widget.dropdown-menu.top:after {
     border-top-color: var(--backgroundColor40, #fcfcfc);
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorDefault40, #474949);
+    color: var(--textColorDefault40, #ffffff);
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorDefault40, #474949);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #474949);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: #ffffff;
+    color: var(--colorDefault40, #474949);
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #474949);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}

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

@@ -1253,4 +1253,46 @@ td.k-state-focused.k-state-selected {
 .k-scheduler-monthview .k-scheduler-table .k-today {
     background: var(--colorPrimary40, #7a8288);
     color: var(--textColorPrimary40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--colorDefault70, #202325);
+    border-radius: 50%;
+    border: 2px solid var(--textColorDefault40, #7a8288);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--textColorDefault40, #7a8288);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorDefault70, #202325);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--textColorDefault40, #7a8288);
+}

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

@@ -924,4 +924,46 @@ td.k-state-focused.k-state-selected,
 
 .bootstrap-datetimepicker-widget.dropdown-menu.top:after {
     border-top-color: var(--backgroundColor40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--colorDefault30, #8a8b8b);
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault30, #8a8b8b);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault30, #8a8b8b);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorDefault30, #8a8b8b);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorDefault30, #8a8b8b);
+}

package/css/themes/custom/superhero/custom-superhero.css

@@ -1604,4 +1604,45 @@ p.ng-binding.ng-scope,
     background: var(--colorDark40, #20374c);
     border-color: var(--colorDark50, #1c3043);
     color: var(--textColorDark40, #ffffff);
-}
+}
+
+/*wizard*/
+.ctn-wizard .nav-wizard>li.active .step-title, 
+.ctn-wizard .nav-wizard>li.completed .step-title {
+    font-weight: bold;
+    color: var(--colorDefault40, #4e5d6c);
+
+.ctn-wizard .nav-wizard>li.active .step-circle::after {
+    content: '';
+    position: absolute;
+    top: -7px;
+    left: -7px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #4e5d6c);
+    z-index: -1;
+    transition: border-color 0.3s ease;
+}
+
+.ctn-wizard .nav-wizard>li.active .step-circle, 
+.ctn-wizard .nav-wizard>li.completed .step-circle {
+    background-color: var(--colorDefault40, #4e5d6c);
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.ctn-wizard .step-circle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--textColorDefault40, #ffffff);
+    color: var(--colorDefault40, #4e5d6c);
+    border-radius: 50%;
+    border: 2px solid var(--colorDefault40, #4e5d6c);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 5px auto;
+    position: relative;
+    z-index: 1;
+    transition: background-color 0.3s ease, color 0.3s ease;
+}

package/css/themes/custom/theme-general/notification.css

@@ -4,6 +4,7 @@
     box-shadow: none;
     background: var(--colorDefault40, #3b448e);
     font-family: var(--fontFamily, Arial, sans-serif);
+    z-index: 99999;
 }
 
 .ui-notification.success {

package/css/themes/custom/theme-general/theme-general.css

@@ -625,3 +625,95 @@ input[exibir-icone="false"]::-webkit-calendar-picker-indicator {
   color: #000; /* Suporte para Edge */
 }
 
+.nav-wizard a {
+    text-decoration: none;
+    color: inherit;
+}
+
+.nav-wizard a:hover,
+.nav-wizard a:focus {
+    text-decoration: none;
+}
+
+.is-invalid {
+    border-color: #dc3545;
+}
+
+.invalid-feedback {
+    color: #dc3545;
+    margin-top: 0.25rem;
+    font-size: 0.875em;
+}
+
+.btn-disabled-wizard {
+  color: #a1a1a1 !important;
+  border-color: #ccc !important;
+  background-color: #fff !important;
+  background-image: none !important;
+  pointer-events: none;
+  cursor: not-allowed;
+}
+
+/* step ativo */
+.ctn-wizard .nav-wizard>li.step-active .step-circle {
+  background-color: var(--colorDefault40, #3b448e);
+  color: var(--textColorDefault40, #ffffff);
+  border: 2px solid var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .nav-wizard>li.step-active .step-title {
+  font-weight: bold;
+  color: var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .nav-wizard>li.step-completed .step-circle {
+  background-color: var(--colorDefault40, #3b448e);
+  color: var(--textColorDefault40, #ffffff);
+  border: 2px solid var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .nav-wizard>li.step-invalid .step-circle {
+  background-color: var(--textColorDefault40, #ffffff);
+  color: var(--colorDanger40, #dc3545);
+  border: 2px solid var(--colorDanger40, #dc3545);
+}
+
+.ctn-wizard .nav-wizard>li:not(.step-completed):not(.step-invalid):not(.step-active) .step-circle {
+  background-color: var(--textColorDefault40, #ffffff);
+  color: var(--colorDefault40, #3b448e);
+  border: 2px solid var(--colorDefault40, #3b448e);
+}
+
+.ctn-wizard .step-circle {
+  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
+}
+
+input[exibir-icone="true"]::-webkit-calendar-picker-indicator {
+  display: block !important;
+}
+
+input[exibir-icone="false"]::-webkit-calendar-picker-indicator {
+  display: none !important;
+}
+
+.input-icon-wrapper {
+    position: absolute;
+    right: 6.5rem;
+    pointer-events: auto;
+    margin-top: -2.5rem;    
+    overflow: hidden;
+}
+
+.dark-placeholder::placeholder {
+  color: #000;
+  opacity: 1;
+}
+
+.dark-placeholder:-ms-input-placeholder {
+  color: #000; /* Suporte para IE */
+}
+
+.dark-placeholder::-ms-input-placeholder {
+  color: #000; /* Suporte para Edge */
+}
+