cronapp-framework-mobile-js 1.0.4

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

@@ -0,0 +1,50 @@
+.item,
+.item-select select {
+    border-color: var(--backgroundColor60, #7c7c7c);
+    background: var(--backgroundColor40, #ffffff);
+    color: var(--textColor, #111111);
+}
+
+.item-input {
+    background: var(--backgroundColor40, #ffffff);
+    color: var(--textColor, #111111);
+}
+
+.item-input input,
+.item-input textarea {
+    color: var(--textColor, #111111);
+    font-size: var(--textNormalSize, 14px);
+}
+
+.item-input input::placeholder,
+.item-input textarea::placeholder {
+    color: var(--colorNeutral50, #B9B9B9);
+    font-size: var(--textNormalSize, 14px);
+}
+
+.input-label {
+    color: var(--textColor, #111111);
+    font-size: var(--textNormalSize, 14px);
+}
+
+.item-input-wrapper {
+    background: var(--backgroundColor40, #ffffff);
+}
+
+textarea,
+input[type="text"],
+input[type="password"],
+input[type="datetime"],
+input[type="datetime-local"],
+input[type="date"],
+input[type="month"],
+input[type="time"],
+input[type="week"],
+input[type="number"],
+input[type="email"],
+input[type="url"],
+input[type="search"],
+input[type="tel"],
+input[type="color"] {
+    color: var(--textColor, #111111);
+}

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

@@ -0,0 +1,317 @@
+.login-bg {
+    background: -webkit-linear-gradient(45deg, var(--colorDefault50) 0, var(--colorDefault40, #3b448e) 76%, var(--colorDefault40, #3b448e) 95%);
+}
+
+.login-bg .cron-margin-top-ios {
+    margin-top: inherit;
+}
+
+.login-bg .scroll {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+    flex-direction: column;
+    width: 100%;
+}
+
+.login-mobile input[type="email"]::-webkit-input-placeholder,
+.login-mobile input[type="text"]::-webkit-input-placeholder,
+.login-mobile input[type="password"]::-webkit-input-placeholder {
+    color: var(--textColorDefault40, #ffffff);
+    background: transparent;
+}
+
+.menu-view .bar.bar-positive,
+.login-bg .bar.bar-positive {
+    border-color: var(--colorDefault40, #3b448e);
+    background: linear-gradient(0deg, var(--colorDefault40, #3b448e), var(--colorDefault40, #3b448e) 50%, transparent 50%);
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .item h2,
+.login-bg .item h2 {
+    margin: 0 0 2px 0;
+    font-size: var(--textNormalSize, 14px);
+    font-weight: normal;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .item h3,
+.login-bg .item h3 {
+    margin: 0 0 2px 0;
+    font-size: var(--textNormalSize, 14px);
+    font-weight: normal;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .item-icon-left .icon,
+.login-bg .item-icon-left .icon {
+    left: 20px;
+    border-radius: var(--borderRadiusFull, 99999px);
+    border: 1px solid;
+    width: 35px;
+    height: 35px;
+    top: 6px;
+    color: var(--textColorDefault40, #ffffff);
+    border-color: var(--textColorDefault40, #ffffff);
+}
+
+.menu-view .item-icon-left,
+.login-bg .item-icon-left,
+ul.nav>a>div,
+ul.nav>li>a>div,
+div.nav>a>div {
+    padding-left: 26px;
+    margin-left: 20px;
+    min-height: auto;
+}
+
+div.nav>a.item-avatar-left>div.item-content {
+    padding: 16px;
+}
+
+.menu-view [nav-bar-transition="ios"] [nav-bar="active"] .bar,
+[nav-bar-transition="ios"] [nav-bar="entering"] .bar,
+.login-bg [nav-bar-transition="ios"] [nav-bar="active"] .bar,
+[nav-bar-transition="ios"] [nav-bar="entering"] .bar {
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .button .icon:before,
+.button.icon:before,
+.button.icon-left:before,
+.button.icon-right:before,
+.login-bg .button .icon:before,
+.button.icon:before,
+.button.icon-left:before,
+.button.icon-right:before {
+    display: inline-block;
+    padding: 0 0 1px 0;
+    vertical-align: inherit;
+    font-size: var(--textExtraBigSize, 23px);
+    line-height: 41px;
+    pointer-events: none;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .bar .title,
+.login-bg .bar .title {
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0;
+    z-index: 0;
+    overflow: hidden;
+    margin: 0 10px;
+    min-width: 30px;
+    height: 43px;
+    text-align: center;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: var(--textMediumSize, 16px);
+    font-weight: 500;
+    line-height: 44px;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view label.item.item-input,
+.login-bg label.item.item-input {
+    border-top: 0;
+    display: block;
+    border-left: 0;
+    border-right: 0;
+    border-radius: var(--borderRadiusNone, 0);
+}
+
+.menu-view fieldset,
+.login-bg fieldset {
+    margin: 0 2px;
+    padding: 0.35em 0.625em 0.75em;
+    border: 0px solid var(--colorNeutral40, #C7C7C7);
+}
+
+.menu-view .bar-header button i,
+.login-bg .bar-header button i {
+    font-size: var(--textSmallSize, 12px);
+    color: var(--colorNeutral220, #000000);
+}
+
+.menu-view .bar-header .header-item .right-buttons .button i::before,
+.bar-header .header-item .left-buttons .button i::before,
+.login-bg .bar-header .header-item .right-buttons .button i::before,
+.bar-header .header-item .left-buttons .button i::before {
+    font-size: var(--textExtraBigSize, 23px);
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+.menu-view .user-avatar,
+.login-bg .user-avatar {
+    float: left;
+    font-size: 52px;
+    color: var(--colorNeutral00, #FFFFFF);
+    width: 45px;
+    height: auto;
+    padding: 0px;
+}
+
+.menu-view .user-avatar i {
+    color: var(--textColorDefault40, #ffffff);
+}
+
+.menu-view .input-default input,
+.login-bg .input-default input {
+    border-bottom: 1px solid var(--colorNeutral60, #ACACAC);
+    transition: 400ms;
+    color: var(--colorPrimary10, #d8e0fc);
+    margin-top: 5px;
+    margin-bottom: 15px;
+}
+
+.menu-view .input-default input:focus,
+.login-bg .input-default input:focus {
+    border-bottom: 1px solid var(--colorDefault40, #3b448e);
+    transition: 400ms;
+    color: var(--colorDefault40, #3b448e);
+}
+
+.menu-view .input-default .item-input i,
+.login-bg .input-default .item-input i {
+    border-radius: var(--borderRadiusFull, 99999px);
+    border: 1px solid var(--colorNeutral60, #ACACAC);
+    padding: 6px 7px 6px 7px;
+    font-size: var(--textSmallSize, 12px);
+}
+
+.menu-view .item-input,
+.login-bg .item-input {
+    padding: 6px 0 5px 0px;
+}
+
+.menu-view .item,
+.login-bg .item {
+    border-color: transparent;
+    background: transparent;
+    color: var(--colorDark40, #444444);
+    position: relative;
+    z-index: 2;
+    display: block;
+    margin: -1px;
+    padding: 0px;
+    border-width: 1px;
+    border-style: solid;
+    font-size: var(--textMediumSize, 16px);
+}
+
+.login-bg input:-webkit-autofill {
+    box-shadow: 0 0 0px 1000px var(--colorPrimary20) inset;
+    -webkit-box-shadow: 0 0 0px 1000px var(--colorPrimary20) inset;
+}
+
+.login-mobile .button.button-positive {
+    border-color: var(--colorPrimary40, #387ef5);
+    background: transparent;
+    color: var(--colorNeutral00, #FFFFFF);
+    border-radius: var(--borderRadiusSmallest, 5px);
+    transition: 400ms;
+    margin-top: 20px;
+    margin: 0 auto;
+}
+
+.login-mobile .button {
+    padding: 0;
+    border: 1px solid var(--colorNeutral00, #FFFFFF);
+    text-transform: uppercase;
+    letter-spacing: 6px;
+}
+
+.logo {
+    width: 250px;
+    margin-bottom: 0;
+    filter: none;
+}
+
+.login-mobile {
+    padding: 19px 30px;
+    border-radius: var(--borderRadiusExtraSmall, 10px);
+    background: transparent;
+}
+
+.login-mobile label {
+    background: transparent;
+}
+
+.login-mobile label input {
+    background: transparent;
+}
+
+.login-mobile input {
+    border-bottom: 1px solid var(--colorNeutral00, #FFFFFF);
+    transition: 700ms;
+    color: var(--colorNeutral00, #FFFFFF);
+    background: transparent;
+}
+
+.login-mobile input:focus {
+    border-bottom: 1px solid var(--colorPrimary10, #d8e0fc);
+    transition: 700ms;
+    background: transparent;
+}
+
+.login-mobile .item-input {
+    padding-bottom: 16px;
+    margin-bottom: 10px;
+}
+
+.login-mobile label {
+    border: 0;
+}
+
+.login-mobile .placeholder-icon:first-child {
+    padding-right: 0;
+}
+
+.login-mobile .placeholder-icon {
+    color: var(--textColorDefault40, #ffffff);
+    font-size: var(--textNormalSize, 14px);
+    border-radius: var(--borderRadiusFull, 99999px);
+    border: 1px solid var(--colorNeutral00, #FFFFFF);
+    text-align: center;
+    padding: 11px 5px 0px 0px;
+    margin-right: 7px;
+    width: 40px;
+    height: 40px;
+}
+
+.login-mobile label.item.item-input {
+    padding: 10px;
+    border: 0px solid var(--colorNeutral30, #D5D5D5);
+}
+
+.login-bg label.item.item-input {
+    padding: 10px;
+}
+
+.login-bg a {
+    text-decoration: none;
+}
+
+a#reset-password-login {
+    text-align: right;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+a#button-signup {
+    color: var(--colorNeutral00, #FFFFFF);
+    text-align: center;
+    margin-top: 10px;
+}
+
+.menu-view .button.button-positive{
+    border-color: #ffffff;
+    background: #ffffff;
+    color: var(--colorPrimary40, #387ef5);
+    border-radius: 7px;
+    transition: 400ms;
+}

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

@@ -0,0 +1,135 @@
+.modal .modal-content .list-group-item {
+    border: 0;
+    padding: 10px 0;
+}
+
+.modal .modal-content .list-group-item {
+    border: 0;
+    padding: 10px 0;
+}
+
+.modal .modal-content .k-textbox {
+    width: 100%;
+}
+
+.modal .modal-content .list-group {
+    display: contents;
+}
+
+#modalBodyConfirmDialog {
+    text-align: center;
+}
+
+#modalBodyConfirmDialog .subtitle,
+#modalBodyConfirmDialog .title {
+    color: var(--textColor40, #393939);    
+    white-space: pre-wrap
+}
+
+#modalBodyConfirmDialog .title {
+    font-size: var(--textExtraBigSize, 18px);
+    font-weight: bold;
+    line-height: 1;
+}
+
+#modalBodyConfirmDialog .subtitle {
+    margin: 10px 0px;
+    font-size: var(--textNormalSize, 14px);
+    font-weight: 300;
+    line-height: 1.3;
+}
+
+.k-dialog .k-content {
+    border-radius: 0px;
+}
+
+.k-window {
+    background: var(--backgroundColor40, #f1f1f1);
+    border-color: var(--backgroundColor50, #dfdfdf);
+}
+
+.k-dialog .k-dialog-buttongroup.k-dialog-button-layout-normal {
+    border-radius: 0;
+    justify-content: center;
+    border-color: var(--backgroundColor50, #dfdfdf);
+}
+
+.k-button.k-primary.k-state-hover, .k-button.k-primary:hover {
+    border-color: var(--colorPrimary40, #ff6b58);
+    color: var(--textColorPrimary40, #fff);
+    background-color: var(--colorPrimary40, #ff6b58);
+    background-image: linear-gradient(var(--colorPrimary10, rgba(255,146,88,.0)), var(--colorPrimary20, rgba(255,146,88,.2)));
+  }
+  
+  .k-dialog-button-layout-stretched .k-primary:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
+      color: var(--colorPrimary40, #ff6b58);
+  }
+  
+  .k-button.k-primary.k-state-active, .k-button.k-primary:active {
+      border-color: var(--colorPrimary40, #ff6b58);
+      color: var(--textColorPrimary40, #fff);
+      background-color: var(--colorPrimary40, #ff6b58);
+      background-image: linear-gradient(var(--colorPrimary10, rgba(255,138,88,.2)), var(--colorPrimary20, rgba(255,138,88,0)));
+      box-shadow: inset 0 2px 2px 0 rgb(0 0 0 / 6%);
+  }
+  
+  .k-dialog-button-layout-stretched .k-button.k-primary.k-state-focused, .k-dialog-button-layout-stretched .k-button.k-primary:focus {
+      box-shadow: inset 0 0 0 2px var(--colorPrimary10, rgb(255 99 88 / 30%));
+  }
+
+  .k-dialog .k-dialog-titlebar .k-dialog-title {
+    font-size: large;
+  }
+
+  .k-dialog .k-dialog-titlebar:before {
+    content: "\e403";
+    font-family: "WebComponentsIcons";
+    margin-right: 5px;
+    font-size: large;
+  }
+
+  .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(--colorDanger40, #ff6358);
+    color: var(--textColorDanger40, #fff);
+  }
+
+  .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(--colorSuccess40, #ff6358);
+    color: var(--textColorSuccess40, #fff);
+  }
+
+  .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(--colorWarning40, #ff6358);
+    color: var(--textColorWarning40, #fff);
+  }
+
+  .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(--colorPrimary40, #ff6358);
+    color: var(--textColorPrimary40, #fff);
+  }
+
+  .k-window-titlebar {
+    background-clip: padding-box;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+    padding: 12px 16px;
+    border-width: 0 0 1px;
+    border-style: solid;
+    white-space: nowrap;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    -ms-flex-align: center;
+    align-items: center;
+  }

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

@@ -0,0 +1,79 @@
+.range.range-default input:before {
+    background: var(--colorDefault40, #3b448e);
+}
+
+.range.range-default input::-ms-fill-lower {
+    background: var(--colorDefault40, #3b448e);
+}
+
+.range.range-light input:before {
+    background: var(--colorLight40, #ffffff);
+}
+
+.range.range-light input::-ms-fill-lower {
+    background: var(--colorLight40, #ffffff);
+}
+
+.range.range-stable input:before {
+    background: var(--colorStable40, #f8f8f8);
+}
+
+.range.range-stable input::-ms-fill-lower {
+    background: var(--colorStable40, #f8f8f8);
+}
+
+.range.range-positive input:before {
+    background: var(--colorPrimary40, #387ef5);
+}
+
+.range.range-positive input::-ms-fill-lower {
+    background: var(--colorPrimary40, #387ef5);
+}
+
+.range.range-calm input:before {
+    background: var(--colorCalm40, #11c1f3);
+}
+
+.range.range-calm input::-ms-fill-lower {
+    background: var(--colorCalm40, #11c1f3);
+}
+
+.range.range-balanced input:before {
+    background: var(--colorSuccess40, #33cd5f);
+}
+
+.range.range-balanced input::-ms-fill-lower {
+    background: var(--colorSuccess40, #33cd5f);
+}
+
+.range.range-assertive input:before {
+    background: var(--colorDanger40, #ef473a);
+}
+
+.range.range-assertive input::-ms-fill-lower {
+    background: var(--colorDanger40, #ef473a);
+}
+
+.range.range-energized input:before {
+    background: var(--colorWarning40, #ffc900);
+}
+
+.range.range-energized input::-ms-fill-lower {
+    background: var(--colorWarning40, #ffc900);
+}
+
+.range.range-royal input:before {
+    background: var(--colorRoyal40, #886aea);
+}
+
+.range.range-royal input::-ms-fill-lower {
+    background: var(--colorRoyal40, #886aea);
+}
+
+.range.range-dark input:before {
+    background: var(--colorDark40, #444444);
+}
+
+.range.range-dark input::-ms-fill-lower {
+    background: var(--colorDark40, #444444);
+}

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

@@ -0,0 +1,62 @@
+#crn-input-inline-passwordConfirmation,
+#crn-input-inline-passwordNew {
+    border: none;
+    text-align: left;
+    border-bottom: 1px solid var(--colorNeutral40, #C7C7C7);
+    margin-bottom: 5px;
+}
+
+#crn-container-445023 {
+    padding: 1px;
+}
+
+button#button-reset-password {
+    letter-spacing: 0px;
+    border-radius: 6px;
+    margin: 0px;
+}
+
+a#crn-button-voltarLogin {
+    padding-left: 14px;
+    padding-right: 14px;
+    background: var(--colorNeutral00, #FFFFFF);
+    float: right;
+}
+
+#ion-header {
+    border: none;
+}
+
+#reset-password-label {
+    color: var(--textColor40, #393939);
+}
+
+#crn-heading-reset {
+    font-weight: bold;
+    color: var(--textColor40, #393939);
+}
+
+#crn-container-445023 {
+    padding: 1px;
+}
+
+button#button-reset-password {
+    letter-spacing: 0px;
+    border-radius: 6px;
+    margin: 0px;
+}
+
+a#crn-button-voltarLogin {
+    padding-left: 14px;
+    padding-right: 14px;
+    background: var(--colorNeutral00, #FFFFFF);
+    float: right;
+}
+
+#ion-header {
+    border: none;
+}
+
+#crn-input-resetPassowordEmail{
+    margin-top: 10px;
+}

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

@@ -0,0 +1,39 @@
+.containerMobile {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+    flex-direction: column;
+    width: 100%;
+}
+
+#crn-title-signup {
+    text-align: center;
+    font-weight: bold;
+    color: var(--colorNeutral00, #FFFFFF);
+}
+
+#crn-container-445023 {
+    padding: 1px;
+}
+
+button#crn-button-signup {
+    letter-spacing: 0px;
+    border-radius: 6px;
+    margin: 0px;
+    height: 47px;
+}
+
+#go-back-login {
+    text-align: center;
+    color: var(--colorNeutral00, #FFFFFF);
+    margin-top: 10px;
+}
+
+#ion-header {
+    border: none;
+}
+
+#crn-form-signup {
+    width: 100%;
+}