hexo-theme-quiet/source/css/pages/about.less

77 lines
1.2 KiB
Plaintext

.about{
&-header-background{
display: flex;
flex-shrink: 0;
background: linear-gradient(to top, #f1f5fb, #f9fcff);
&-content{
display: flex;
flex-basis: 721px;
padding: 196px 40px 160px;
margin: 0 auto;
h1 {
display: flex;
margin-top: 40px;
font-size: 30px;
font-weight: 500;
color: #12183a;
flex: 1;
flex-direction: column;
span {
display: flex;
font-size: 15px;
margin-top: 10px;
color: #898F9F;
}
}
img {
display: flex;
flex: 0;
width: 88px;
height: 88px;
border-radius: 50%;
margin-top: 30px;
margin-right: 30px;
}
}
}
&-content{
.content-style();
&-info {
width: 100%;
box-sizing: border-box;
padding: 60px 150px;
transition: all 0.4s ease-in-out;
p {
font-size: 1.55rem;
margin-bottom: 20px;
font-weight: 500;
line-height: 1.2;
margin-top: 20px;
}
}
img {
display: flex;
width: 100%;
height: 100%;
}
}
}
@media screen and (max-width: 800px) {
.about{
&-content {
&-info {
padding: 40px 50px;
}
}
}
}
@media screen and (max-width: 600px) {
.about{
&-content {
&-info {
padding: 40px 20px;
}
}
}
}