1 line
2.1 KiB
CSS
1 line
2.1 KiB
CSS
.upload{display:flex;align-items:center;justify-content:center;flex-direction:column;border:2px dashed rgba(21,141,247,.3);border-radius:4px;height:120px;cursor:pointer}.upload .upload-placeholder{color:rgba(21,141,247,.5);font-style:italic;font-size:.875em}.upload.is-upload-hover,.upload:hover{border-color:rgba(21,141,247,.35);background-color:rgba(21,141,247,.05)}.upload.is-upload-error{border-color:rgba(238,36,85,.35);background-color:rgba(238,36,85,.05)}.upload-target{background-color:rgba(21,141,247,.02);border:1px solid rgba(21,141,247,.1);padding:4px 8px}.upload-target:empty{padding:0;border:none}.upload-target .upload-item{display:flex;font-size:.875em;border-bottom:1px solid rgba(17,17,19,.05);padding-top:4px;padding-bottom:4px}.upload-target .upload-item .close{margin-top:2px;margin-right:4px}.upload-target .upload-item em{font-style:normal;color:rgba(17,17,19,.5);font-size:.75em;margin-left:4px}.upload-target .upload-item:last-child{border-bottom-color:transparent}.upload-box{margin-right:-16px;margin-bottom:-16px}.upload-box:after{content:'';display:table;clear:both}.upload-box .upload-item{float:left;width:120px;height:120px;border:2px dashed rgba(21,141,247,.3);background-color:#fff;cursor:pointer;border-radius:6px;position:relative;font-size:0;line-height:0;margin-right:16px;margin-bottom:16px}.upload-box .upload-item.is-uploaded{border-style:solid;border-color:rgba(21,141,247,.35)}.upload-box .upload-item img{position:relative;z-index:2;object-fit:cover;height:100%;width:100%;border-radius:6px}.upload-box .upload-item .close{position:absolute;z-index:3;top:-4px;right:-8px;background-color:#ee2455;color:#fff;opacity:1}.upload-box .upload-item .close:hover{background-color:#111113}.upload-box .upload-item:after{position:absolute;z-index:1;top:50%;left:50%;margin-left:-12px;margin-top:-20px;content:'+';font-size:40px;line-height:1;font-weight:400;color:rgba(21,141,247,.5)}.upload-box .upload-item.is-upload-hover,.upload-box .upload-item:hover{border-color:rgba(21,141,247,.35);background-color:rgba(21,141,247,.05)}.upload-box .upload-item.is-upload-error{border-color:rgba(238,36,85,.35);background-color:rgba(238,36,85,.05)} |