| 1 |
- .layoutSet{padding:0 10px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;grid-gap:10px;margin-bottom:10px}.layoutSet>div{cursor:pointer;width:100%;height:25px;line-height:25px;padding:0 10px;font-size:13px;border-radius:30px;background-color:#ffffffa4}.layoutSet>div:hover{background-color:#fff}.childrenMenu{display:block;position:absolute;left:calc(100% + 6px);top:-5px;width:120px;background-color:#f0f8ff;border-radius:10px;padding:5px;font-size:14px;background:rgba(255,255,255,.5);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(40px)}.childrenMenu:after{position:absolute;z-index:0;content:" ";width:50px;background-color:transparent;top:0;height:50px;left:-25px}@keyframes fade-in{0%{transform:scale3d(0,0,1)}to{transform:scaleZ(1)}}.mouseMenu{position:fixed;width:140px;z-index:999;background-color:transparent;border-radius:10px;padding:5px;transform:scale3d(0,0,1);transform-origin:left top;animation:fade-in .2s forwards}.mouseMenu:before{content:"";position:absolute;width:100%;height:100%;top:0;border-radius:10px;left:0;background:rgba(255,255,255,.5);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(40px);z-index:-1}.mouseMenu .mhover{border-radius:8px;transition:background-color .2s}.mouseMenu .mhover:hover{background-color:#ffffff5e}.mouseMenu .mouseItem{position:relative;z-index:10;padding:0 10px;display:flex;align-items:center;min-height:35px;cursor:pointer}.mouseMenu .mouseItem>img{width:15px;height:15px}.mouseMenu .mouseItem>span{margin-left:5px;font-size:13px}
|
