2023年政策修订增补工作正在进行中,欢迎参与!
Template:NoWorld/members.css
跳转到导航
跳转到搜索
/*以下样式用于“NoWorld”条目“组织成员”章节。*/
.main{
margin:15px;
flex-basis:420px;
position:relative;
}
.left{
width:220px;
height:340px;
padding:10px;
box-sizing:border-box;
overflow:hidden;
display:flex;
justify-content:center;
align-items:center;
transition-delay:86400s;
}
.left:hover{
background-color:#f9f9f9;
border-radius:20px 0 0 20px;
box-shadow:5px 5px 5px #888;
transition:3s;
transition-delay:0s;
}
.left:active{
background-color:#f5f5f5;
box-shadow:2px 2px 2px #888;
transition:0s;
}
.left:hover ~.right{
animation-play-state:running;
}
.left:hover ~.right>.article{
animation-play-state:running;
}
.noworldlost{
transition-delay:86400s;
}
.noworldlost:hover{
opacity:0;
transition:3s;
}
.right{
position:absolute;
top:0;
left:0;
z-index:-1;
opacity:0;
padding:20px;
width:220px;
height:340px;
box-sizing:border-box;
overflow:hidden;
background-color:#f9f9f9;
border-radius:0 20px 20px 0;
box-shadow:5px 5px 5px #888;
animation:right 1s ease 1;
animation-fill-mode:forwards;
animation-play-state:paused;
}
@keyframes right{
20% {transform:translate(225px,0);}
40% {transform:translate(260px,0);opacity:0.5;}
60% {transform:translate(220px,0);opacity:1;}
80% {transform:translate(240px,0);opacity:1;}
100% {transform:translate(225px,0);opacity:1;}
}
.article{
width:100%;
opacity:0;
position:relative;
left:5px;
width:100%;
animation:slidedown 2s cubic-bezier(0,0.51,0.83,0.52) 1s;
animation-fill-mode:forwards;
animation-play-state:paused;
}
@keyframes slidedown{
0% {top:0;}
33% {top:30%;opacity:0.33;}
67% {top:0;opacity:0.67;}
100% {top:5%;opacity:1;}
}/* [[Category:在模板名字空间下的CSS页面]] */