@farris/ui-vue/components/field-search-box/index.css

Farris Vue, a Farris Design based Vue3 component library.

.f-field-search-box .clear-search-fields{width:28px;height:28px;display:flex;align-items:center;justify-content:center;min-width:28px;margin-left:3px;border-radius:3px;cursor:pointer;border:0px}.f-field-search-box .search-input-box{flex:1;position:relative;min-width:100px;height:24px;margin:0;padding:0;float:left;overflow:hidden}.f-field-search-box .search-input-box .f-button-edit .input-group{border:0!important}.f-field-search-box .search-input-box .search-tag-item,.f-field-search-box .search-input-box .f-icon-close.search-box_delete-keys{cursor:pointer}.f-field-search-box .condition-panel{width:380px;min-height:110px;position:fixed;background-color:#fff;border-radius:6px;border:1px solid #e0dfdf;z-index:99999999;box-shadow:4px 4px 5px #d0d0d0;padding:14px 24px 18px}.f-field-search-box .condition-panel .btn-search-submit{padding-left:22px;padding-right:22px;margin-left:8px}.f-field-search-box .condition-panel .number-input-wrapper .sub-input-spliter{color:#5a5e66;margin:0 4px;font-size:12px}.f-field-search-box .condition-panel .checkbox-wrapper .custom-control{display:flex}.f-field-search-box .condition-panel .checkbox-wrapper .custom-control .custom-control-label{flex-shrink:1;flex-grow:1;flex-basis:0;overflow:hidden;padding-left:26px;line-height:30px}.f-field-search-box .condition-panel .checkbox-wrapper .custom-control .custom-control-label:hover{background-color:var(--f-aid-02)}.f-field-search-box .condition-panel .checkbox-wrapper .custom-control .custom-control-label:before{position:absolute;top:7px;left:6px}.f-field-search-box .condition-panel .checkbox-wrapper .custom-control.custom-checkbox{padding-right:0}.f-field-search-box .condition-panel .f-filter-panel-date-tags .panel-date-tag.active{background:rgba(var(--f-theme-03-rgb),.1);border:1px solid rgba(var(--f-theme-03-rgb),.3)}.f-field-search-box .search-tag-item{max-width:200px;height:20px;margin:3px 4px 3px 0!important;cursor:default;background:var(--f-aid-04)!important;border:1px solid var(--f-aid-05)!important}.f-field-search-box .search-tag-item:hover{color:var(--f-theme-05)!important}.f-field-search-box .search-tag-item .search-tag{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.f-field-search-box .search-tag-item .f-icon-close{cursor:pointer;right:2px;font-size:12px}.f-field-search-box .f-cmp-inputgroup--multi-wrapper{min-height:26px;padding:0 5px;flex-wrap:wrap}.search-fields-panel .search-fields-list{background-color:#fff}.search-fields-panel .search-fields-list li{padding:5px 8px;cursor:pointer;border-radius:6px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.search-fields-panel .search-fields-list li:hover,.search-fields-panel .search-fields-list li.active{background-color:#f5f5f5}.search-fields-panel .search-fields-list li span.search-field-title{min-width:50px;text-align:justify;text-align-last:justify;width:53px;overflow:hidden;text-overflow:ellipsis}