2
0
Fork 0
ff/themes/custom/source/css/_partial/aside.less

93 lines
2.2 KiB
Plaintext
Raw Normal View History

2020-01-03 17:07:50 +00:00
.aside {
display:none;
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
overflow:hidden;
background-color: rgba(0,0,0,0.3);
.aside-content {
position:absolute;
top:0;
right:0;
width:750rem/@baseFontSize;
transform:translateX(750rem/@baseFontSize);
transition:transform .75s;
height:100%;
background-color: rgba(0,0,0,.9);
padding:40rem/@baseFontSize 15rem/@baseFontSize;
.aside-avatar {
width:128rem/@baseFontSize;
height:128rem/@baseFontSize;
display:block;
border-radius:50%;
margin:0 auto;
overflow:hidden;
img {
width:128rem/@baseFontSize;
height:128rem/@baseFontSize;
}
}
.aside-author {
text-align:center;
font-family:"华文行楷",sans-serif;
font-size:40rem/@baseFontSize;
margin-top:20rem/@baseFontSize;
}
.aside-description {
text-align:center;
font-family:"华文行楷",sans-serif;
font-size:30rem/@baseFontSize;
margin-top:20rem/@baseFontSize;
}
.aside-contact {
margin-top:20rem/@baseFontSize;
li {
float:left;
width:220rem/@baseFontSize;
height:220rem/@baseFontSize;
margin:0 10rem/@baseFontSize;
border-radius:10rem/@baseFontSize;
background-color: rgba(255,255,255,.1);
text-align:center;
overflow:hidden;
position:relative;
span {
display:block;
width:100%;
height:100%;
line-height:220rem/@baseFontSize;
text-align:center;
}
span.fa {
font-size:30rem/@baseFontSize;
}
a {
position:absolute;
top:0;
left:0;
color: @colorFont;
display:block;
background-color: #CEBB3B;
width:100%;
height:100%;
line-height:220rem/@baseFontSize;
text-align:center;
transform:translateY(220rem/@baseFontSize);
overflow:hidden;
transition:transform .3s;
}
a.in {
transform:translateY(0);
}
img {
width:220rem/@baseFontSize;
}
}
}
}
.in {
transform:translateX(0);
}
}