cronapp-framework-js 3.0.0-SP.34 → 3.0.0-SP.36

package/components/crn-dynamic-file.components.json

@@ -8,7 +8,11 @@
   "category": [
       "INPUTS", "FORMS"
   ],
-  "templateURL": "src/main/webapp/node_modules/cronapp-framework-js/dist/components/templates/dynamicfile.template.html",
+  "autoWrapper": false,
+  "designTimeDynamic": true,
+  "designTimeHTMLURL": "src/main/webapp/node_modules/cronapp-framework-js/dist/components/templates/dynamicfile.designtime.html",
+  "designTimeSelector": ":self",
+  "templateURL": "src/main/webapp/node_modules/cronapp-framework-js/dist/components/templates/dynamicfile.template.html"
   "styles": [
     {
       "selector": "div#{id} label",
@@ -154,4 +158,4 @@
       "type": "event"
     }
   ]
-}
+}

package/components/templates/cron-grid.designtime.html

@@ -45,8 +45,8 @@
                 <span ng-if="item.dataType != 'Customized' && item.dataType != 'Command' && item.dataType != 'GroupedButtons'">{{item.headerText?parseProperty(item.headerText):''}}</span>
                 <a ng-if="item.dataType == 'Command' && (item.command == 'edit|destroy' || item.command == 'edit')" role="button" class="k-button k-button-icontext k-grid-edit" href="#"><span class="k-icon k-i-edit"></span> </a>
                 <a ng-if="item.dataType == 'Command' && (item.command == 'edit|destroy' || item.command == 'destroy')" role="button" class="k-button k-button-icontext k-grid-delete" href="#"><span class="k-icon k-i-close"></span> </a>
-                <a ng-if="item.dataType == 'Customized'" href="" class="k-button k-custom-command {{item.label != ''?'k-button-with-label':''}} k-grid-f06e"><span class="{{item.iconClass}}"></span>{{item.label?' ' + parseProperty(item.label):''}}</a>
-                <a ng-if="item.dataType == 'GroupedButtons'" ng-repeat="item2 in item.buttonColumns" href="" class="k-button k-custom-command {{item2.label != ''?'k-button-with-label':''}} k-grid-f06e"><span class="{{item2.iconClass}}"></span>{{item2.label?' ' + parseProperty(item2.label):''}}</a>
+                <a ng-if="item.dataType == 'Customized'" style="width:{{item.width}}px" href="" class="k-button k-custom-command {{item.label != ''?'k-button-with-label':''}} btn {{item.theme}} k-grid-f06e"><span class="{{item.iconClass}}"></span>{{item.label?' ' + parseProperty(item.label):''}}</a>
+                <a ng-if="item.dataType == 'GroupedButtons'" ng-repeat="item2 in item.buttonColumns" style="width:{{item2.width}}px" href="" class="k-button k-custom-command {{item2.label != ''?'k-button-with-label':''}} btn {{item2.theme}} k-grid-f06e"><span class="{{item2.iconClass}}"></span>{{item2.label?' ' + parseProperty(item2.label):''}}</a>
             </td>
         </tr>
         </tbody>

package/components/templates/dynamicfile.designtime.html

@@ -0,0 +1,5 @@
+<div id="file-${RANDOM}" dynamic-file="" ng-model="vars.dynamicfile${RANDOM}" class="dynamic-image-container" style="padding: 50px 0;" ng-required="false" ngf-max-size="5MB" ngf-accept="'*.*'">
+  <button id="file-${RANDOM}-button" class="btn" ngf-drop ngf-select ngf-change="cronapi.internal.uploadFile('vars.dynamicfile${RANDOM}', $file, 'uploadprogress${RANDOM}', undefined, $invalidFiles)" style="position: absolute; left: 0;">
+    <span>Clique ou arraste um arquivo</span>
+  </button>
+</div>

package/components/templates/dynamicfile.template.html

@@ -1,6 +1,6 @@
 <div class="form-group">
     <label for="file-${RANDOM}-button">Arquivo</label>
     <div id="file-${RANDOM}" dynamic-file="" ng-model="vars.dynamicfile${RANDOM}" class="dynamic-image-container" ng-required="false" max-file-size="5MB" accept-file="'*.*'">
-      {{"template.crud.clickOrDragAnFile" | translate}}
+      Clique ou arraste um arquivo
     </div>
-</div>
+</div>

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

@@ -20,7 +20,7 @@
 .k-button.k-default:hover,
 .btn.btn-default,
 .btn.btn-default:hover {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -33,7 +33,7 @@
 .btn.btn-default:active,
 .btn.btn-default.activated,
 .btn.btn-default.active {
-    background: var(--colorDefault50, #f0f0f0);
+    background: var(--colorDefault50, #eeeeee);
     border-color: var(--colorDefault60, #d2d2d2);
 }
 
@@ -58,7 +58,7 @@
 .btn.btn-primary:active,
 .btn.btn-primary.activated,
 .btn.btn-primary.active {
-    background: var(--colorPrimary50, #f0f0f0);
+    background: var(--colorPrimary50, #eeeeee);
     border-color: var(--colorPrimary60, #d2d2d2);
 }
 
@@ -77,7 +77,7 @@
 .btn.btn-info:active,
 .btn.btn-info.activated,
 .btn.btn-info.active {
-    background: var(--colorCalm50, #f0f0f0);
+    background: var(--colorCalm50, #eeeeee);
     border-color: var(--colorCalm60, #d2d2d2);
 }
 
@@ -102,7 +102,7 @@
 .btn.btn-danger:active,
 .btn.btn-danger.activated,
 .btn.btn-danger.active {
-    background: var(--colorDanger50, #f0f0f0);
+    background: var(--colorDanger50, #eeeeee);
     border-color: var(--colorDanger60, #d2d2d2);
 }
 
@@ -121,7 +121,7 @@
 .btn.btn-warning:active,
 .btn.btn-warning.activated,
 .btn.btn-warning.active {
-    background: var(--colorWarning50, #f0f0f0);
+    background: var(--colorWarning50, #eeeeee);
     border-color: var(--colorWarning60, #d2d2d2);
 }
 
@@ -140,7 +140,7 @@
 .btn.btn-success:active,
 .btn.btn-success.activated,
 .btn.btn-success.active {
-    background: var(--colorSuccess50, #f0f0f0);
+    background: var(--colorSuccess50, #eeeeee);
     border-color: var(--colorSuccess60, #d2d2d2);
 }
 
@@ -155,7 +155,7 @@
 .btn.btn-light:active,
 .btn.btn-light.activated,
 .btn.btn-light.active {
-    background: var(--colorLight50, #f0f0f0);
+    background: var(--colorLight50, #eeeeee);
     border-color: var(--colorLight60, #d2d2d2);
 }
 

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

@@ -86,7 +86,7 @@
     --colorDefault10: #fbfbfb;
     --colorDefault20: #f7f7f7;
     --colorDefault30: #f4f4f4;
-    --colorDefault40: #f0f0f0;
+    --colorDefault40: #eeeeee;
     --colorDefault50: #d2d2d2;
     --colorDefault60: #b0b0b0;
     --colorDefault70: #838383;
@@ -243,26 +243,26 @@
     --textColorDark70: #ffffff;
 
     /* 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;
@@ -270,7 +270,7 @@
     /* === Variables used exclusively in the color palette property === */
     /* Components - Button */
     --btnLink: var(--colorPrimary40, #158cba);
-    --btnDefault: var(--colorDefault40, #f0f0f0);
+    --btnDefault: var(--colorDefault40, #eeeeee);
     --btnPrimary: var(--colorPrimary40, #158cba);
     --btnSuccess: var(--colorSuccess40, #28b62c);
     --btnCalm: var(--colorCalm40, #75caeb);
@@ -340,7 +340,7 @@
     --borderCheckboxDark: var(--colorDark40, #555555);
 
     /* Components - Combobox */
-    --comboboxDefault: var(--colorDefault40, #f0f0f0);
+    --comboboxDefault: var(--colorDefault40, #eeeeee);
     --comboboxPrimary: var(--colorPrimary40, #158cba);
     --comboboxSuccess: var(--colorSuccess40, #28b62c);
     --comboboxCalm: var(--colorCalm40, #75caeb);
@@ -386,7 +386,7 @@
     --borderOptionDark: var(--colorDark40, #555555);
 
     /* Components - Panel */
-    --panelDefault: var(--colorPrimary40, #158cba);
+    --panelDefault: var(--colorDefault40, #eeeeee);
     --panelPrimary: var(--colorLight40, #f6f6f6);
     --panelSuccess: var(--colorSuccess40, #28b62c);
     --panelCalm: var(--colorCalm40, #75caeb);
@@ -397,7 +397,7 @@
     --panelRoyal: var(--colorRoyal40, #886aea);
     --panelDark: var(--colorDark40, #555555);
 
-    --borderPanelDefault: var(--colorPrimary40, #158cba);
+    --borderPanelDefault: var(--colorDefault50, #d2d2d2);
     --borderPanelPrimary: var(--colorLight50, #d7d7d7);
     --borderPanelSuccess: var(--colorSuccess40, #28b62c);
     --borderPanelCalm: var(--colorCalm40, #75caeb);
@@ -428,15 +428,15 @@ h6,
 }
 
 .color-default {
-    color: var(--colorDefault50, #d2d2d2);
+    color: var(--colorDefault40, #eeeeee);
 }
 
 .color-light {
-    color: var(--colorLight50, #d7d7d7);
+    color: var(--colorLight40, #f6f6f6);
 }
 
 .color-stable {
-    color: var(--colorStable50, #d9d9d9);
+    color: var(--colorStable40, #f8f8f8);
 }
 
 /* option - radio  */
@@ -444,17 +444,17 @@ h6,
 .k-radio:checked+.k-radio-label:before,
 .option-default .k-radio:checked+.k-radio-label:before,
 .option-default .k-radio-label:before {
-    border-color: var(--colorDefault50, #d2d2d2);
+    border-color: var(--colorDefault40, #eeeeee);
 }
 
 .option-light .k-radio:checked+.k-radio-label:before,
 .option-light .k-radio-label:before {
-    border-color: var(--colorLight50, #d7d7d7);
+    border-color: var(--colorLight40, #f6f6f6);
 }
 
 .option-default .k-radio-label:after,
 .option-default .k-radio:checked+.k-radio-label:after {
-    background: var(--colorDefault50, #d2d2d2);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -466,7 +466,7 @@ h6,
 
 .option-default .k-radio:focus+.k-radio-label::before,
 .option-default .k-radio:hover+.k-radio-label::before {
-    box-shadow: 0 0 5px 0 var(--colorDefault50, #d2d2d2);
+    box-shadow: 0 0 5px 0 var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -483,7 +483,7 @@ h6,
 
 .option-stable .k-radio-label:after,
 .option-stable .k-radio:checked+.k-radio-label:after {
-    background: var(--colorStable50, #d9d9d9);
+    background: var(--colorStable40, #f8f8f8);
     border-color: var(--colorStable50, #d9d9d9);
 }
 
@@ -579,7 +579,7 @@ h6,
 .checkbox-light .k-checkbox:indeterminate+.k-checkbox-label:before,
 .checkbox-light .k-checkbox:checked+.k-checkbox-label:after,
 .checkbox-light .k-checkbox:indeterminate+.k-checkbox-label:after {
-    background: var(--colorLight50, #d7d7d7);
+    background: var(--colorLight40, #f6f6f6);
     color: var(--textColorLight40, #222222);
 }
 
@@ -655,6 +655,10 @@ h6,
     color: var(--textColor40, #555555);
 }
 
+i.color-white.glyphicon.glyphicon-search::before {
+    color: var(--textColor40, #555555);
+}
+
 .k-grid .k-pager-numbers .k-state-selected {
     background: var(--colorPrimary50, #127ba3);
     color: var(--textColorPrimary40, #ffffff);
@@ -680,7 +684,7 @@ h6,
     background: transparent;
     border-style: solid;
     border-width: 1px 0 1px 1px;
-    border-color: var(--colorDefault40, #f0f0f0);
+    border-color: var(--colorDefault40, #eeeeee);
 }
 
 .bg-login2 #container-first {
@@ -785,8 +789,8 @@ a:hover {
 /* Banner */
 .jumbotron {
     background: var(--colorLight20, #fafafa);
-    border: 1px solid var(--colorDefault40, #f0f0f0);
-    border-top: 4px solid var(--colorDefault40, #f0f0f0);
+    border: 1px solid var(--colorDefault40, #eeeeee);
+    border-top: 4px solid var(--colorDefault40, #eeeeee);
 }
 
 .jumbotron .h1,
@@ -819,13 +823,13 @@ a:hover {
 }
 
 .dynamic-image-container .btn {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
     color: var(--textColor40, #555555);
 }
 
 .dynamic-image-container .btn:hover {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -854,7 +858,7 @@ a:hover {
 #modalPassword .modal-footer .k-button.k-danger,
 #modalPassword .modal-footer .btn.btn-danger {
     color: var(--textColorDefault40, #222222);
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
     border-color: var(--colorDefault50, #d2d2d2);
 }
 
@@ -869,7 +873,6 @@ a:hover {
 }
 
 /* Crud button */
-
 .active-bar .k-button.k-default,
 .active-bar .btn.btn-default {
     background: var(--colorSuccess40, #28b62c);
@@ -1129,7 +1132,7 @@ td.k-state-focused.k-state-selected {
 .k-listview>.k-state-focused,
 .k-state-focused,
 td.k-state-focused {
-    box-shadow: inset 0 0 7px 0 var(--colorDefault40, #f0f0f0);
+    box-shadow: inset 0 0 7px 0 var(--colorDefault40, #eeeeee);
 }
 
 .k-calendar .k-today.k-state-selected.k-state-hover,
@@ -1147,4 +1150,12 @@ td.k-state-focused {
 .k-popup .k-list .k-state-focused {
     box-shadow: inset 0 0 2px 0 var(--colorPrimary30, #7daecc), inset 0 0 7px 0 var(--colorPrimary40, #158cba);
     background: transparent;
+}
+
+.combobox-default .k-multiselect .k-button {
+    border-color: var(--colorDefault50, #d2d2d2);
+    background: var(--colorDefault40, #eeeeee);
+    color: var(--textColorDefault40, #ffffff);
+    padding-left: 13px;
+    padding-right: 25px;
 }

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

@@ -102,5 +102,5 @@
 }
 
 label.labelCollapsibleMenu {
-    background: var(--colorDefault40, #f0f0f0);
+    background: var(--colorDefault40, #eeeeee);
 }

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

@@ -1,7 +1,7 @@
 .panel {
     background: var(--backgroundColor40, #ffffff);
     box-shadow: none;
-    border: 1px solid var(--colorDefault40, #f0f0f0);
+    border: 1px solid var(--colorDefault40, #eeeeee);
     border-width: 0 1px 4px 1px;
 }
 
@@ -13,73 +13,77 @@
 
 /* Default */
 .panel-default .panel-heading {
-    color: var(--textColorPrimary40, #ffffff);
-    background: var(--colorPrimary40, #158cba);
+    background: var(--colorDefault40, #eeeeee);
+    color: var(--textColor40, #555555);
     border-color: transparent;
 }
 
 /* Primary */
 .panel-primary>.panel-heading {
-    color: var(--textColor40, #555555);
-    background: var(--colorLight40, #f6f6f6);
+    background: var(--colorPrimary40, #158cba);
+    color: var(--textColorPrimary40, #ffffff);
     border-color: transparent;
 }
 
 /* Sucess */
 .panel-success>.panel-heading {
-    color: var(--textColorSuccess40, #ffffff);
     background: var(--colorSuccess40, #28b62c);
+    color: var(--textColorSuccess40, #ffffff);
     border-color: transparent
 }
 
 /* Info */
 .panel-info>.panel-heading {
-    color: var(--textColorCalm40, #ffffff);
     background: var(--colorCalm40, #75caeb);
+    color: var(--textColorCalm40, #ffffff);
     border-color: transparent
 }
 
 /* Warning */
 .panel-warning>.panel-heading {
-    color: var(--textColorWarning40, #ffffff);
     background: var(--colorWarning40, #ff851b);
+    color: var(--textColorWarning40, #ffffff);
     border-color: transparent
 }
 
 /* Danger */
 .panel-danger>.panel-heading {
-    color: var(--textColorDanger40, #ffffff);
     background: var(--colorDanger40, #ff4136);
+    color: var(--textColorDanger40, #ffffff);
     border-color: transparent
 }
 
 /* Light */
 .panel-light>.panel-heading {
-    color: var(--textColor40, #555555);
     background: var(--colorLight40, #f6f6f6);
+    color: var(--textColor40, #555555);
     border-color: transparent
 }
 
 /* Stable */
 .panel-stable>.panel-heading,
 .panel-stable>.panel-footer {
-    color: var(--textColorStable40, #444444);
     background: var(--colorStable50, #d9d9d9);
+    color: var(--textColorStable40, #444444);
     border-color: transparent
 }
 
 /* Royal */
 .panel-royal>.panel-heading,
 .panel-royal>.panel-footer {
-    color: var(--textColorRoyal40, #ffffff);
     background: var(--colorRoyal40, #886aea);
+    color: var(--textColorRoyal40, #ffffff);
     border-color: transparent
 }
 
 /* Dark */
 .panel-dark>.panel-heading,
 .panel-dark>.panel-footer {
-    color: var(--textColorDark40, #ffffff);
     background: var(--colorDark40, #555555);
+    color: var(--textColorDark40, #ffffff);
     border-color: transparent
+}
+
+.panel-group .heading-arrow.panel-heading::after {
+    color: var(--textColor40, #555555);
 }