cronapp-framework-js 2.9.0-SNAPSHOT.2 → 2.9.1-SNAPSHOT.2

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

@@ -249,7 +249,7 @@ h6 {
 }
 
 .fill .bg.ng-scope .container-full .container-fluid > .component-holder .login-view {
-    flex-direction: column-reverse;
+    flex-direction: column;
     background: var(--colorNeutral00);
     border-radius: var(--borderRadiusSmallest);
     padding: var(--distanceSmall);
@@ -675,7 +675,7 @@ div.fill > #main-nav-bar {
 
 #main-nav-bar .navbar-default .container-fluid #navbar .navbar-nav li a span.caret,
 #main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav li a span.caret {
-    margin-top: 7px;
+    margin-top: 10px;
     margin-left: auto;
     min-width: 16px;
     height: 7px;
@@ -717,7 +717,8 @@ div.fill > #main-nav-bar {
     display: none;
 }
 
-#main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav > li > a {
+#main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav > li > a,
+#main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav > li.open > a {
     background: var(--colorNeutral10);
     border-radius: var(--borderRadiusFull);
 }
@@ -725,8 +726,9 @@ div.fill > #main-nav-bar {
 #main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav li a img {
     margin-top: 2px;
     margin-left: 2px;
-    margin-right: calc(var(--distanceSmallest) + 6px);
-    border: 0;
+    margin-right: calc(var(--distanceSmallest) + 12px);
+    border: 1px solid var(--colorDefault40);
+    background: var(--colorDefault40);
 }
 
 #main-nav-bar .navbar-default .container-fluid #navbar2 .navbar-nav li a span {
@@ -825,11 +827,14 @@ div.fill > #main-nav-bar {
         padding: var(--menuItemPaddingSize);
     }
 
-    #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar .navbar-nav li a span.caret,
-    #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar2 .navbar-nav li a span.caret {
+    #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar .navbar-nav li a span.caret {
         margin-left: 8px;
     }
 
+    #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar2 .navbar-nav li a span.caret {
+        margin-left: 16px;
+    }
+
     #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar .navbar-nav li .dropdown-menu,
     #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar2 .navbar-nav li .dropdown-menu {
         background: var(--colorNeutral00);
@@ -847,7 +852,7 @@ div.fill > #main-nav-bar {
     #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar2 .navbar-nav > li > a,
     #main-nav-bar.crn-navigator-horizontal .navbar-default .container-fluid #navbar2 .navbar-nav li.open > a {
         padding: 5px;
-        margin-top: 7px;
+        margin-top: 12px;
         border-top-width: 0;
     }
 }
@@ -938,12 +943,12 @@ div.fill > #main-nav-bar {
 .k-button:active {
     position: relative;
     border-radius: var(--borderRadiusFull);
-    padding: 12px 35px;
+    padding: 7px 35px;
     border-width: 0;
     font-weight: 500;
     font-size: 18px;
     color: var(--colorNeutral00);
-    min-height: 56px;
+    min-height: auto;
     outline: 0;
     box-shadow: none;
 }
@@ -971,11 +976,41 @@ div#view-canvas .btn /* Force in the editor */ {
 .btn.disabled,
 .btn[disabled],
 .btn:disabled,
+.btn.btn-default.disabled,
+.btn.btn-default[disabled],
+.btn.btn-default:disabled,
 div#view-canvas .btn.disabled /* Force in the editor */ {
     background: var(--colorDefault10);
     color: var(--colorDefault30);
 }
 
+.btn.disabled span,
+.btn[disabled] span,
+.btn:disabled span,
+.btn.btn-default.disabled span,
+.btn.btn-default[disabled] span,
+.btn.btn-default:disabled span,
+.btn.disabled i,
+.btn[disabled] i,
+.btn:disabled i,
+.btn.btn-default.disabled i,
+.btn.btn-default[disabled] i,
+.btn.btn-default:disabled i,
+.btn.disabled:hover span,
+.btn[disabled]:hover span,
+.btn:disabled:hover span,
+.btn.btn-default.disabled:hover span,
+.btn.btn-default[disabled]:hover span,
+.btn.btn-default:disabled:hover span,
+.btn.disabled:hover i,
+.btn[disabled]:hover i,
+.btn:disabled:hover i,
+.btn.btn-default.disabled:hover i,
+.btn.btn-default[disabled]:hover i,
+.btn.btn-default:disabled:hover i {
+    color: var(--colorNeutral00);
+}
+
 .btn.btn-success,
 .btn.btn-success:focus,
 .btn.btn-success:focus:active,
@@ -992,6 +1027,15 @@ div#view-canvas .btn.btn-success.disabled/* Force in the editor */ {
     color: var(--colorSuccess20);
 }
 
+.btn.btn-success.disabled:hover span,
+.btn.btn-success[disabled]:hover span,
+.btn.btn-success:disabled:hover span,
+.btn.btn-success.disabled:hover i,
+.btn.btn-success[disabled]:hover i,
+.btn.btn-success:disabled:hover i {
+    color: var(--colorNeutral00);
+}
+
 .btn.btn-warning,
 .btn.btn-warning:focus,
 .btn.btn-warning:focus:active,
@@ -1005,7 +1049,16 @@ div#view-canvas .btn.btn-warning /* Force in the editor */ {
 .btn.btn-warning:disabled,
 div#view-canvas .btn.btn-warning.disabled/* Force in the editor */ {
     background: var(--colorWarning10);
-    color: var(--colorWarning20);
+    color: var(--colorWarning30);
+}
+
+.btn.btn-warning.disabled:hover span,
+.btn.btn-warning[disabled]:hover span,
+.btn.btn-warning:disabled:hover span,
+.btn.btn-warning.disabled:hover i,
+.btn.btn-warning[disabled]:hover i,
+.btn.btn-warning:disabled:hover i {
+    color: var(--colorNeutral00);
 }
 
 .btn.btn-danger,
@@ -1024,6 +1077,15 @@ div#view-canvas .btn.btn-danger.disabled/* Force in the editor */ {
     color: var(--colorDanger20);
 }
 
+.btn.btn-danger.disabled:hover span,
+.btn.btn-danger[disabled]:hover span,
+.btn.btn-danger:disabled:hover span,
+.btn.btn-danger.disabled:hover i,
+.btn.btn-danger[disabled]:hover i,
+.btn.btn-danger:disabled:hover i {
+    color: var(--colorNeutral00);
+}
+
 .btn.btn-info,
 .btn.btn-light,
 .btn.btn-link,
@@ -1041,23 +1103,45 @@ div#view-canvas .btn.btn-link /* Force in the editor */ {
     border-width: 1px;
     border-style: solid;
     background: var(--colorNeutral00);
-    padding: 10px 35px;
+    padding: 5px 35px;
 }
 
 .btn.btn-primary,
 .btn.btn-primary:focus,
 .btn.btn-primary:focus:active,
 .btn.btn-primary:active {
-    border: 0;
+    color: var(--colorDefault40);
+    border-color: var(--colorDefault40);
+}
+
+.btn.btn-primary:hover span,
+.btn.btn-primary:hover i {
     color: var(--colorDefault40);
 }
 
 .btn.btn-primary.disabled,
 .btn.btn-primary[disabled],
 .btn.btn-primary:disabled,
-div#view-canvas .btn.btn-primary.disabled, /* Force in the editor */ {
-    border-color: var(--colorNeutral20);
-    color: var(--colorNeutral10);
+div#view-canvas .btn.btn-primary.disabled /* Force in the editor */ {
+    background: var(--colorDefault10);
+    color: var(--colorDefault10);
+    border-color: var(--colorDefault20);
+}
+
+.btn.btn-primary.disabled:hover:before,
+.btn.btn-primary[disabled]:hover:before,
+.btn.btn-primary:disabled:hover:before,
+.btn.btn-primary.disabled:hover:before {
+    opacity: 0;
+}
+
+.btn.btn-primary.disabled:hover span,
+.btn.btn-primary[disabled]:hover span,
+.btn.btn-primary:disabled:hover span,
+.btn.btn-primary.disabled:hover i,
+.btn.btn-primary[disabled]:hover i,
+.btn.btn-primary:disabled:hover i {
+    color: var(--colorNeutral00);
 }
 
 .btn.btn-info,
@@ -1074,6 +1158,29 @@ div#view-canvas .btn.btn-primary.disabled, /* Force in the editor */ {
 div#view-canvas .btn.btn-info.disabled /* Force in the editor */ {
     border-color: var(--colorDefault20);
     color: var(--colorDefault20);
+    background: var(--colorNeutral00);
+}
+
+.btn.btn-info.disabled span,
+.btn.btn-info[disabled] span,
+.btn.btn-info:disabled span,
+.btn.btn-info.disabled i,
+.btn.btn-info[disabled] i,
+.btn.btn-info:disabled i,
+.btn.btn-info.disabled:hover span,
+.btn.btn-info[disabled]:hover span,
+.btn.btn-info:disabled:hover span,
+.btn.btn-info.disabled:hover i,
+.btn.btn-info[disabled]:hover i,
+.btn.btn-info:disabled:hover i {
+    color: var(--colorDefault20);
+}
+
+.btn.btn-info.disabled:hover:before,
+.btn.btn-info[disabled]:hover:before,
+.btn.btn-info:disabled:hover:before,
+.btn.btn-info.disabled:hover:before {
+    opacity: 0;
 }
 
 .btn.btn-light,
@@ -1092,6 +1199,28 @@ div#view-canvas .btn.btn-light.disabled /* Force in the editor */ {
     color: var(--colorNeutral40);
 }
 
+.btn.btn-light.disabled span,
+.btn.btn-light[disabled] span,
+.btn.btn-light:disabled span,
+.btn.btn-light.disabled i,
+.btn.btn-light[disabled] i,
+.btn.btn-light:disabled i,
+.btn.btn-light.disabled:hover span,
+.btn.btn-light[disabled]:hover span,
+.btn.btn-light:disabled:hover span,
+.btn.btn-light.disabled:hover i,
+.btn.btn-light[disabled]:hover i,
+.btn.btn-light:disabled:hover i {
+    color: var(--colorNeutral30);
+}
+
+.btn.btn-light.disabled:hover:before,
+.btn.btn-light[disabled]:hover:before,
+.btn.btn-light:disabled:hover:before,
+.btn.btn-light.disabled:hover:before {
+    opacity: 0;
+}
+
 .btn.btn-link,
 .btn.btn-link:focus,
 .btn.btn-link:focus:active,
@@ -1108,6 +1237,28 @@ div#view-canvas .btn.btn-link.disabled /* Force in the editor */ {
     color: var(--colorPrimary20);
 }
 
+.btn.btn-link.disabled span,
+.btn.btn-link[disabled] span,
+.btn.btn-link:disabled span,
+.btn.btn-link.disabled i,
+.btn.btn-link[disabled] i,
+.btn.btn-link:disabled i,
+.btn.btn-link.disabled:hover span,
+.btn.btn-link[disabled]:hover span,
+.btn.btn-link:disabled:hover span,
+.btn.btn-link.disabled:hover i,
+.btn.btn-link[disabled]:hover i,
+.btn.btn-link:disabled:hover i {
+    color: var(--colorDefault20);
+}
+
+.btn.btn-link.disabled:hover:before,
+.btn.btn-link[disabled]:hover:before,
+.btn.btn-link:disabled:hover:before,
+.btn.btn-link.disabled:hover:before {
+    opacity: 0;
+}
+
 .btn:before,
 .k-button:before {
     background: var(--colorNeutral00);
@@ -1161,6 +1312,12 @@ div#view-canvas .btn.btn-link.disabled /* Force in the editor */ {
 .btn span {
     margin-top: 2px;
     z-index: 0;
+    min-height: 30px;
+}
+
+.k-button i {
+    min-height: 32px;
+    padding-top: 8px;
 }
 
 .btn:hover i,
@@ -1174,11 +1331,6 @@ div#view-canvas .btn.btn-link.disabled /* Force in the editor */ {
     color: inherit;
 }
 
-.btn.btn-primary:hover i,
-.btn.btn-primary:hover span {
-    color: var(--colorDefault40);
-}
-
 .btn.btn-info:hover i,
 .btn.btn-info:hover span {
     color: var(--colorDefault40);
@@ -1197,13 +1349,14 @@ div#view-canvas .btn.btn-link.disabled /* Force in the editor */ {
 .k-button.k-button-icontext span {
     margin: 0;
     margin-left: -1px;
+    margin-top: 3px;
 }
 
 /* Labels */
 label {
     font-size: 18px;
     font-weight: 500;
-    margin-right: var(--distanceMedium);
+    width: 100%;
 }
 
 /* Forms - General */
@@ -1258,6 +1411,7 @@ textarea.k-textbox,
 .k-combobox .k-dropdown-wrap input::placeholder,
 .k-autocomplete input::placeholder {
     color: var(--colorNeutral70);
+    font-style: italic;
 }
 
 .form-control:hover,
@@ -1362,8 +1516,18 @@ textarea.k-textbox,
 }
 
 span.k-dropdown-wrap > span.k-select {
-    background: url("img/arrow-blue.svg") no-repeat center;
+    background-image: url("img/arrow-blue.svg");
+    background-repeat: no-repeat;
+    background-position: center;
     background-size: 50%;
+    border-radius: var(--borderRadiusFull);
+    height: 35px;
+    width: 35px;
+    margin: 2px 2px 0 0;
+}
+
+span.k-dropdown-wrap.k-state-hover > span.k-select:hover {
+    background-color: var(--colorDefault10);
 }
 
 span.k-dropdown-wrap > span.k-select .k-icon:before {
@@ -1418,7 +1582,7 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 
 .k-checkbox-label:before,
 .k-radio-label:before {
-    background: transparent;
+    background-color: var(--colorNeutral00);
     border-width: 1px;
     height: 24px;
     width: 24px;
@@ -1426,8 +1590,8 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 
 .k-checkbox:checked + .k-checkbox-label:before {
     color: var(--colorDefault40);
-    padding-top: 3px;
-    height: 18px;
+    padding-top: 5px;
+    height: 19px;
 }
 
 .k-checkbox-label:hover:before,
@@ -1449,7 +1613,7 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 .k-checkbox-label:active:before,
 .k-checkbox:indeterminate + .k-checkbox-label:before,
 .checkbox-blue .k-checkbox:indeterminate + .k-checkbox-label:before {
-    background-color: var(--colorDefault10);
+    background-color: var(--colorNeutral00);
     box-shadow: none;
 }
 
@@ -1539,6 +1703,7 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 
 *[id^="crn-input-password"] .cardinput .k-textbox.form-control {
     border: 1px solid var(--colorNeutral90);
+    padding-right: 35px;
 }
 
 *[id^="crn-input-password"] .cardinput .k-textbox.form-control:focus {
@@ -1546,7 +1711,33 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
     box-shadow: 0 0 0 3px var(--colorWarning50);
 }
 
+*[id^=crn-input-password] button {
+    margin-left: -55px;
+    position: relative;
+}
+
+*[id^=crn-input-password] button i:before {
+    color: var(--colorDefault40);
+}
+
 /* Form - Text Input Button */
+*[id^="crn-textinputbutton"] .crn-textinputbutton {
+    align-items: end;
+}
+
+*[id^="crn-textinputbutton"] .form-group {
+    margin-bottom: 0;
+}
+
+*[id^="crn-textinputbutton"] .form-control {
+    display: flex;
+    flex-direction: column;
+}
+
+*[id^="crn-textinputbutton"] .ng-scope {
+    margin-bottom: 0;
+}
+
 *[id^="crn-textinputbutton"] .btn i {
     margin-right: 0;
 }
@@ -1604,10 +1795,11 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
     border: 0;
 }
 
-*[id^="crn-accordion"] .panel .panel-heading div h1:after {
+*[id^="crn-accordion"] .panel .panel-heading div h1:before {
     font-family: 'Glyphicons Halflings';
     content: "\e080";
-    float: right;
+    float: left;
+    margin-right: 10px;
     transform: rotate(90deg);
 }
 
@@ -1868,6 +2060,28 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
     border-radius: var(--borderRadiusSmall);
 }
 
+*[id^="crn-datepicker"] div div:after,
+*[id^="crn-datetimepicker"] div div:after,
+*[id^="crn-timepicker"] div div:after {
+    font: normal normal normal 14px/1 FontAwesome;
+    content: "\f133";
+    margin-left: -30px;
+    position: relative;
+    font-size: 16px;
+    top: 2px;
+    color: var(--colorDefault40);
+}
+
+*[id^="crn-timepicker"] div div:after {
+    content: "\f017";
+}
+
+*[id^="crn-datepicker"] div div input.form-control,
+*[id^="crn-datetimepicker"] div div input.form-control,
+*[id^="crn-timepicker"] div div input.form-control {
+    padding-right: 35px;
+}
+
 /* Tabs */
 .ctn-tab {
     border-bottom: 1px solid var(--colorNeutral40);
@@ -2070,30 +2284,42 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 /* Drag File Upload */
 .dynamic-image-container {
     border-radius: var(--borderRadiusSmallest);
-    padding: var(--distanceMedium);
     text-align: center;
+    border-width: 1px;
+    border-color: var(--colorDefault40);
+}
+
+.dynamic-image-container > .ng-scope:before {
+    font-family: "Glyphicons Halflings";
+    content: "\e198";
+    margin-left: 12px;
+    top: 6px;
+    position: relative;
+    color: var(--colorDefault40);
 }
 
 .dynamic-image-container .btn {
     margin: 3px 0;
+    background-color: transparent;
+    color: var(--colorDefault40);
+    font-style: italic;
 }
 
 .dynamic-image-container .btn.ng-binding {
-    font-size: 23px;
+    font-size: 18px;
     white-space: normal;
     text-align: center;
-}
-
-.dynamic-image-container .btn.ng-binding:hover {
-    color: var(--colorNeutral00);
+    padding: 5px 15px;
 }
 
 .dynamic-image-container .btn.btn-info span {
     margin-top: 6px;
+    top: 4px;
 }
 
 .dynamic-image-container .start-camera-button-attribute {
     bottom: 0;
+    overflow: hidden;
 }
 
 /* Banner */
@@ -2238,8 +2464,6 @@ span.k-dropdown-wrap > span.k-select .k-icon:before {
 
 .k-grid .k-header.k-grid-toolbar {
     background: var(--colorNeutral20);
-    border-radius: var(--borderRadiusSmallest);
-    margin-bottom: var(--distanceSmall);
     padding: var(--distanceMedium);
 }
 
@@ -2296,6 +2520,7 @@ table.table thead th {
     margin: 0;
     white-space: normal;
     vertical-align: top;
+    color: var(--colorDefault40);
 }
 
 table.table thead th {
@@ -2333,6 +2558,7 @@ table.table.table-hover tbody tr:hover {
 .k-grid table thead th.k-header a.k-link {
     display: inline;
     padding: 0;
+    color: var(--colorDefault40);
 }
 
 .k-grid table thead th.k-header a.k-link .k-icon,
@@ -2395,6 +2621,7 @@ table.table.table-hover tbody tr:hover {
     min-height: 0;
     min-width: 0;
     margin-left: 3px;
+    background-color: transparent;
 }
 
 .k-grid table .k-button:first-child,
@@ -2404,6 +2631,7 @@ table.table.table-hover tbody tr:hover {
 
 .k-grid table .k-button span:before {
     left: -1px;
+    color: var(--colorDefault40);
 }
 
 .k-grid .k-grid-pager {
@@ -2413,6 +2641,7 @@ table.table.table-hover tbody tr:hover {
 .k-grid .k-grid-pager .k-state-selected {
     background: var(--colorDefault40);
     border-color:  var(--colorDefault40);
+    border-radius: var(--borderRadiusFull);
     box-shadow: none;
 }
 
@@ -2445,7 +2674,7 @@ table.table.table-hover tbody tr:hover {
 }
 
 .k-grid .k-grid-pager .k-link {
-    border-color: var(--colorDefault20);
+    border: 0;
     margin: 0;
 }
 
@@ -2497,6 +2726,10 @@ table.table.table-hover tbody tr:hover {
     background: var(--colorNeutral00);
 }
 
+.k-grid .k-dropdown .k-dropdown-wrap .k-input {
+    color: var(--colorDefault40);
+}
+
 @media (max-width: 576px) {
     .k-grid .k-pager-sizes.k-label {
         padding: 20px 0 0;
@@ -2525,7 +2758,7 @@ table.table.table-hover tbody tr:hover {
 }
 
 .k-scheduler .k-scheduler-toolbar {
-    background: var(--colorDefault10);
+    background: var(--colorNeutral00);
     padding: var(--distanceExtraSmall);
     border-bottom: 0;
 }
@@ -2540,14 +2773,15 @@ table.table.table-hover tbody tr:hover {
 .k-scheduler .k-scheduler-toolbar li:last-child,
 .k-scheduler .k-scheduler-toolbar li.k-state-default.k-state-selected,
 .k-scheduler .k-scheduler-toolbar li.k-state-default.k-state-hover {
-    border-radius: var(--borderRadiusSmallest);
+    border-radius: var(--borderRadiusFull);
+    border-color: var(--colorDefault40);
+    border-width: 1px;
 }
 
 .k-scheduler .k-scheduler-toolbar li,
 .k-scheduler .k-scheduler-toolbar li:first-child,
 .k-scheduler .k-scheduler-toolbar li:last-child {
     background: transparent;
-    border: 0;
     overflow: hidden;
 }
 
@@ -2569,7 +2803,7 @@ table.table.table-hover tbody tr:hover {
 .k-scheduler .k-scheduler-toolbar li.k-state-hover a,
 .k-scheduler .k-scheduler-toolbar li.k-state-hover a.k-link,
 .k-scheduler .k-scheduler-toolbar li.k-state-border-down a.k-link {
-    background: var(--colorDefault20);
+    background: var(--colorDefault10);
 }
 
 .k-scheduler .k-scheduler-toolbar li.k-state-selected a,
@@ -2583,6 +2817,11 @@ table.table.table-hover tbody tr:hover {
     width: calc(100% - 2px);
 }
 
+.k-scheduler .k-scheduler-layout .k-scheduler-header .k-scheduler-header-wrap > .k-scheduler-table th {
+    background-color: var(--colorNeutral10);
+    color: var(--colorDefault40);
+}
+
 .k-scheduler .k-scheduler-content .k-loading-mask {
     z-index: 0;
 }
@@ -2636,7 +2875,6 @@ table.table.table-hover tbody tr:hover {
 }
 
 *[id^="crn-rating"] .fa:before {
-    color: var(--colorDefault40);
 }
 
 /* Social Login */
@@ -2649,6 +2887,12 @@ table.table.table-hover tbody tr:hover {
 }
 
 /* Modal */
+.modal .modal-header .close {
+    color: var(--colorDefault40);
+    opacity: 1;
+    font-size: 32px;
+}
+
 .modal .modal-content {
     border-radius: var(--borderRadiusNone);
 }
@@ -2975,6 +3219,7 @@ div[id^="crn-signature-pad"] canvas {
 .k-link.k-pager-nav.k-state-disabled:hover {
     color: var(--colorDefault30);
     background: var(--colorNeutral10);
+    border-radius: var(--borderRadiusFull);
 }
 
 .k-icon.k-i-arrow-60-left:before,
@@ -2993,4 +3238,9 @@ div[id^="crn-signature-pad"] canvas {
 
 .k-i-arrow-end-right:before {
     content: "\e077";
+}
+
+/* User Grid Search Input */
+#crn-datasource-filter-general .form-group input {
+    width: 100%;
 }