2 lines
6.0 KiB
CSS
2 lines
6.0 KiB
CSS
|
.rtf{box-sizing:border-box;margin:25px;position:fixed;white-space:nowrap;z-index:9998;padding-left:0;list-style:none}.rtf.open .rtf--mb{box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.rtf.open .rtf--mb>ul{list-style:none;margin:0;padding:0}.rtf.open .rtf--ab__c:hover>span{transition:ease-in-out opacity .2s;opacity:.9}.rtf.open .rtf--ab__c>span.always-show{transition:ease-in-out opacity .2s;opacity:.9}.rtf.open .rtf--ab__c:nth-child(1){-webkit-transform:translateY(-60px) scale(1);transform:translateY(-60px) scale(1);transition-delay:.03s}.rtf.open .rtf--ab__c:nth-child(1).top{-webkit-transform:translateY(60px) scale(1);transform:translateY(60px) scale(1)}.rtf.open .rtf--ab__c:nth-child(2){-webkit-transform:translateY(-120px) scale(1);transform:translateY(-120px) scale(1);transition-delay:.09s}.rtf.open .rtf--ab__c:nth-child(2).top{-webkit-transform:translateY(120px) scale(1);transform:translateY(120px) scale(1)}.rtf.open .rtf--ab__c:nth-child(3){-webkit-transform:translateY(-180px) scale(1);transform:translateY(-180px) scale(1);transition-delay:.12s}.rtf.open .rtf--ab__c:nth-child(3).top{-webkit-transform:translateY(180px) scale(1);transform:translateY(180px) scale(1)}.rtf.open .rtf--ab__c:nth-child(4){-webkit-transform:translateY(-240px) scale(1);transform:translateY(-240px) scale(1);transition-delay:.15s}.rtf.open .rtf--ab__c:nth-child(4).top{-webkit-transform:translateY(240px) scale(1);transform:translateY(240px) scale(1)}.rtf.open .rtf--ab__c:nth-child(5){-webkit-transform:translateY(-300px) scale(1);transform:translateY(-300px) scale(1);transition-delay:.18s}.rtf.open .rtf--ab__c:nth-child(5).top{-webkit-transform:translateY(300px) scale(1);transform:translateY(300px) scale(1)}.rtf.open .rtf--ab__c:nth-child(6){-webkit-transform:translateY(-360px) scale(1);transform:translateY(-360px) scale(1);transition-delay:.21s}.rtf.open .rtf--ab__c:nth-child(6).top{-webkit-transform:translateY(360px) scale(1);transform:translateY(360px) scale(1)}.rtf--mb__c{padding:25px;margin:-25px}.rtf--mb__c *:last-child{margin-bottom:0}.rtf--mb__c:hover>span{transition:ease-in-out opacity .2s;opacity:.9}.rtf--mb__c>span.always-show{transition:ease-in-out opacity .2s;opacity:.9}.rtf--mb__c>span{opacity:0;transition:ease-in-out opacity .2s;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);margin-right:6px;margin-left:4px;background:rgba(0,0,0,.75);padding:2px 4px;border-radius:2px;color:#fff;font-size:13px;box-shadow:0 0 4px #00000024,0 4px 8px #00000047}.rtf--mb__c>span.right{right:100%}.rtf--mb{width:48px;height:48px;background:var(--btn-bg);z-index:9999;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px #00000024,0 4px 8px #00000047;cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:700;color:#f1f1f1;font-size:18px}.rtf--mb>*{transition:ease-in-out transform .2s}.rtf--ab__c{display:block;position:absolute;top:0;right:1px;padding:10px 0;margin:-10px 0;transition:ease-in-out transform .2s}.rtf--ab__c>span{opacity:0;transition:ease-in-out opacity .2s;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);margin-right:6px;background:rgba(0,0,0,.75);padding:2px 4px;border-radius:2px;color:#fff;font-size:13px;box-shadow:0 0 4px #00000024,0 4px 8px #00000047}.rtf--ab__c>span.right{right:100%}.rtf--ab__c:nth-child(1){-webkit-transform:translateY(-60px) scale(0);transform:translateY(-60px) scale(0);transition-delay:.21s}.rtf--ab__c:nth-child(1).top{-webkit-transform:translateY(60px) scale(0);transform:translateY(60px) scale(0)}.rtf--ab__c:nth-child(2){-webkit-transform:translateY(-120px) scale(0);transform:translateY(-120px) scale(0);transition-delay:.18s}.rtf--ab__c:nth-child(2).top{-webkit-transform:translateY(120px) scale(0);transform:translateY(120px) scale(0)}.rtf--ab__c:nth-child(3){-webkit-transform:translateY(-180px) scale(0);transform:translateY(-180px) scale(0);transition-delay:.15s}.rtf--ab__c:nth-child(3).top{-webkit-transform:transla
|