You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
3.1 KiB
1 lines
3.1 KiB
.materialPicker{width:100%;height:100%}.materialPicker__surface{position:relative;width:100%;height:100%;padding:31px 32px 24px;box-sizing:border-box}.materialPicker__close{position:absolute;top:8px;right:9px;width:20px;height:20px;padding:0;border:0;background:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.materialPicker__close img{width:20px;height:20px;display:block;object-fit:cover}.materialPicker__topBar{display:flex;align-items:center;justify-content:space-between;gap:12px}.materialPicker__title{margin:0;color:#333;font-size:14px;font-weight:500;line-height:26px}.materialPicker__tools{display:flex;align-items:center;gap:10px}.materialPicker__search{width:228px;height:27px;box-sizing:border-box;border:1px solid #e5e6eb;border-radius:9px;background:#fff;display:flex;align-items:center;gap:5px;padding:0 9px}.materialPicker__searchIcon{width:20px;height:20px;object-fit:cover;display:block}.materialPicker__searchInput{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#999;font-size:14px;font-weight:500;line-height:26px}.materialPicker__searchInput::placeholder{color:#999}.materialPicker__searchInput:not(:placeholder-shown){color:#333}.materialPicker__categoryButton{min-width:115px;height:27px;box-sizing:border-box;border:1px solid #e5e6eb;border-radius:9px;background:#fff;padding:0 15px;display:flex;align-items:center;justify-content:space-between;gap:6px;cursor:pointer;color:#333;font-size:14px;font-weight:500;line-height:26px}.materialPicker__categoryButton img{width:15px;height:15px;object-fit:cover;transform:rotate(90deg);display:block}.materialPicker__categoryDropdown{min-width:120px;max-height:300px;overflow:auto;border:1px solid #e5e6eb;border-radius:9px;background:#fff;box-shadow:0 8px 24px #00000014;padding:6px;box-sizing:border-box}.materialPicker__categoryItem{width:100%;border:0;border-radius:7px;background:#fff;text-align:left;padding:6px 8px;font-size:14px;font-weight:500;line-height:22px;color:#333;cursor:pointer}.materialPicker__categoryItem--active{background:#f5f5f5}.materialPicker__grid{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.materialPicker__grid::-webkit-scrollbar{display:none}.materialPicker__grid{margin-top:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:15px}.materialPicker__card{position:relative;height:168px;border:2px solid #f0f0f0;border-radius:9px;background:#fff;overflow:hidden;cursor:pointer;padding:0}.materialPicker__cardImage{width:100%;height:100%;display:block;object-fit:cover}.materialPicker__useMask{position:absolute;left:10px;right:10px;bottom:10px;height:21px;border-radius:9px;background:#0003;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:500;line-height:26px;opacity:0;transition:opacity .15s ease}.materialPicker__card:hover .materialPicker__useMask{opacity:1}.material-picker-arco-modal .arco-modal{overflow:hidden}.material-picker-arco-modal .arco-modal-content{height:871px;max-height:80vh;padding:0;border-radius:9px;overflow:hidden}.material-picker-arco-modal .arco-modal-body{height:100%;padding:0;overflow:hidden}
|
|
|