diff --git a/packages/common/src/styles/slick-bootstrap.scss b/packages/common/src/styles/slick-bootstrap.scss index 3d6f695c1..a85d4a331 100644 --- a/packages/common/src/styles/slick-bootstrap.scss +++ b/packages/common/src/styles/slick-bootstrap.scss @@ -442,6 +442,8 @@ ul { overflow-y: var(--slick-frozen-overflow-right, $slick-frozen-overflow-right) !important; } .input-group { + display: flex; + > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-left: 0; &.ui-slider-horizontal { @@ -449,7 +451,17 @@ ul { } } + .input-group-append, + .input-group-prepend { + display: inline-flex; + width: auto; + } + .input-group-addon { + input { + flex: 1 1 auto; + width: 1%; + } .input-group-text { height: 100%; } diff --git a/packages/common/src/styles/slick-editors.scss b/packages/common/src/styles/slick-editors.scss index 74b3cc8f1..10be4d6a6 100644 --- a/packages/common/src/styles/slick-editors.scss +++ b/packages/common/src/styles/slick-editors.scss @@ -68,6 +68,13 @@ .flatpickr.input-group { height: var(--slick-date-editor-height, $slick-date-editor-height); .input-group-btn { + &.input-group-append { + .btn { + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + margin-left: -1px; + } + } .btn { background-color: #eeeeee; border: 1px solid #cccccc; diff --git a/packages/common/src/styles/slick-plugins.scss b/packages/common/src/styles/slick-plugins.scss index b9c2d4328..85b128f36 100644 --- a/packages/common/src/styles/slick-plugins.scss +++ b/packages/common/src/styles/slick-plugins.scss @@ -809,6 +809,12 @@ input.search-filter { // Date Picker Filter // ---------------------------------------------- +.search-filter.form-group { + .input-group.flatpickr input.form-control { + border-bottom-left-radius: 0px; + border-top-left-radius: 0px; + } +} .search-filter .flatpickr { input.form-control { border-left: none;