react-cascader-popover
Version:
react级联选择器/支持多选/单选
2 lines (1 loc) • 3.76 kB
CSS
.Popover{position:fixed;right:0;bottom:0;top:0;left:0;z-index:1300}.Popover-root{opacity:0;position:absolute;transition:opacity .1s ease-in}.Popover-root-hide{opacity:0}.Popover-root-show{opacity:1}.Popover-invisible{position:fixed;right:0;bottom:0;top:0;left:0;opacity:1;transition:opacity .3s linear}.svgIcon-root{fill:currentColor}.arrow-icon{width:15px;height:15px;color:#8190b8}.checkbox{width:20px;height:20px}.svgBox{display:flex;align-items:center}.indeterminate-checkbox,.checked-checkbox{color:#7a88fe}.load-icon{width:15px;height:15px;animation:rotate-loading .9s linear infinite}@keyframes rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cascader_popover{display:flex;border:1px solid #7a88fe;background:#fff;border-radius:10px;margin-top:5px;max-height:350px;height:300px;overflow-y:hidden}.cascader_popover_cell{padding:5px;border-left:1px solid #c0c7db;height:100%;overflow-y:auto}.cascader_popover_cell::-webkit-scrollbar{width:5px}.cascader_popover_cell::-webkit-scrollbar-track{background:#f5f5f5;border-radius:40px}.cascader_popover_cell::-webkit-scrollbar-thumb{border-radius:40px;background:#7a88fe}::-webkit-scrollbar-thumb:hover{cursor:"pointer"}.cascader_popover_cell*{scrollbar-width:thin;scrollbar-color:#7a88fe transparent}.cascader_popover_cell:first-child{border:0}.cascader_popover_cell_label_box{height:40px;background:#fff;border-radius:7px;padding:5px 5px 5px 10px;cursor:pointer;font-size:13px;display:flex;align-items:center;color:#242859;justify-content:space-between;box-sizing:border-box}.cascader_popover_cell_label_box_ac{background:#f7f8ff;color:#7a88fe;transition:all .3s linear}.cascader_popover_cell_label_box .label .icon{color:#8190b8;display:flex;align-items:center;margin-right:3px}.cascader_popover_cell_label_box .label{margin-right:10px;display:flex;align-items:center;font-size:13px}.cascader_popover_cell_label_box:hover .svgIcon-root{color:#7a88fe}.cascader_popover_cell_label_box:hover{background:#f7f8ff;color:#7a88fe;transition:all .3s linear}.cascader_popover_cell .MuiFormControlLabel-root .MuiCheckbox-indeterminate{color:#7a88fe}.cascader_popover_cell_label_box_arrow{display:flex;align-items:center;justify-content:center}.cascader_popover_cell_label_box_disabled{opacity:.7;color:#8190b8;background:transparent;height:40px;background:#fff;border-radius:7px;padding:5px 5px 5px 10px;font-size:13px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:no-drop}.cascader_popover_cell_label_box_disabled .svgIcon-root{color:#8190b8;display:flex;align-items:center;margin-right:3px;opacity:.7}.cascader_popover_cell_label_box_disabled .label{margin-right:10px;display:flex;align-items:center;font-size:13px}.searchList{border:1px solid #7a88fe;background:#fff;border-radius:10px;margin-top:5px;max-height:350px;height:300px;overflow-y:hidden}.searchList .label{margin-right:0}.cascader_search_box{margin-top:5px;height:35px;background:#fff;border-radius:5px;border:1px solid #7a88fe;box-sizing:border-box;display:flex;align-items:center;overflow:hidden;position:relative}.cascader_search_input{width:100%;padding:0 10px;border:0;height:90%;outline:0;position:absolute;box-sizing:border-box}.slash{margin:0 4px}.search_text_ac{color:red}.empty_data{width:150px;height:80px;display:flex;justify-content:center;align-items:center;border:1px solid #7a88fe;background:#fff;border-radius:10px;margin-top:5px;font-size:13px;color:#999;letter-spacing:3px;cursor:no-drop}.icon{color:#8190b8;display:flex;align-items:center;margin-right:3px}.cascader_popover_cell_label_disabled{margin-top:5px;height:35px;background:#fff;border-radius:5px;border:1px solid #7a88fe;box-sizing:border-box;display:flex;align-items:center;overflow:hidden;position:relative}