Bilibili-Evolved/min/screenshot.min.css
2019-05-19 13:23:39 +08:00

1 line
1.9 KiB
CSS

.video-take-screenshot{padding:0 6px 0 18px;height:100%;cursor:pointer}.video-take-screenshot span{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.video-take-screenshot i{font-size:20px;color:#fff;transform:scale(1);opacity:.9;transition:.4s cubic-bezier(.18,.89,.32,1.28)}.video-take-screenshot:hover i{transform:scale(1.05);opacity:1}.video-take-screenshot:active i{transform:scale(.95);opacity:1}.video-screenshot-list .video-screenshot-list *{transition:.2s ease-out}.video-screenshot-list{position:absolute;top:0;right:0;z-index:20000;padding:12px 0;pointer-events:none}.video-screenshot-list *{pointer-events:initial}.video-screenshot-list-enter{opacity:0;transform:translateX(-240px)}.video-screenshot-list-leave-to{opacity:0;transform:translateX(240px)}.video-screenshot-thumbnail img{max-width:240px;display:block;background-color:#000}.video-screenshot-thumbnail{margin:12px 24px;position:relative;transition:.35s cubic-bezier(.18,.89,.32,1.28);width:240px;height:135px;background-color:#000}@keyframes spinner{to{transform:translate(-50%,-50%) rotate(360deg)}}.video-screenshot-thumbnail .loading::before{content:"";box-sizing:border-box;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(0);width:24px;height:24px;border-radius:50%;border:3px solid #8888;border-top-color:var(--theme-color);animation:.6s linear infinite spinner}.video-screenshot-thumbnail.video-screenshot-list-leave-active{position:absolute;transition:.35s cubic-bezier(.6,-.28,.74,.05)}.video-screenshot-thumbnail .mask{position:absolute;opacity:0;top:0;left:0;width:100%;height:100%;background:#0008;display:flex;justify-content:space-around;align-items:center}.video-screenshot-thumbnail:hover .mask{opacity:1}.video-screenshot-thumbnail .mask button{background:#000a;color:#fff;border:none;border-radius:50%;font-size:24pt;cursor:pointer;width:48px;height:48px;outline:0!important}