liwei-blog/stylesheets/media-fixed.scss

111 lines
1.9 KiB
SCSS

// 处理移动端响应
@media screen and (max-width: 600px) {
.header {
.header-menu {
display: none;
}
.header-menu-mobile {
display: flex;
}
}
.sidebar {
.widget {
max-height: unset;
}
}
.index {
.article {
.article-inner {
flex-direction: column;
.article-feature {
flex: 0 0 auto;
margin-bottom: 10px;
margin-right: 0;
}
.article-body {
.article-title {
font-size: 22px;
}
}
}
}
}
.footer {
.footer-inner {
flex-direction: column;
.footer-info {
padding: 20px 0 10px;
}
.footer-powered {
line-height: 1;
padding-bottom: 20px;
}
}
}
.post {
.article {
.share {
bottom: 3rem;
right: 2rem;
top: auto;
z-index: 999;
}
}
}
.tweet {
margin-bottom: 20px;
}
.ad-post,
.intersection-observer-ad {
display: none;
}
}
@media screen and(max-width: 800px) {
.main {
.inner {
padding-right: 0;
}
}
.sidebar {
border-radius: 8px;
margin: 0 auto 20px;
position: relative;
right: auto !important;
top: auto !important;
transition: all 0.2s;
width: 100%;
}
.index {
margin-bottom: 20px;
}
.post {
margin-bottom: 20px;
}
.archives-wrap {
margin-bottom: 20px;
}
}
// 处理宽屏响应
@media screen and (max-width: 1140px) {
.sidebar {
right: 20px;
}
}