调整隐藏侧栏 CSS
This commit is contained in:
liuzhihang
parent
9ef9e87ac8
commit
06cfa58c23
|
|
@ -114,13 +114,13 @@ spec:
|
|||
- $formkit: select
|
||||
name: location
|
||||
label: 侧边栏位置
|
||||
value: "right"
|
||||
value: "right-aside"
|
||||
options:
|
||||
- value: "hide"
|
||||
- value: "hide-aside"
|
||||
label: "隐藏"
|
||||
- value: "right"
|
||||
- value: "right-aside"
|
||||
label: "右侧"
|
||||
- value: "left"
|
||||
- value: "left-aside"
|
||||
label: "左侧"
|
||||
- $formkit: textarea
|
||||
name: widgets
|
||||
|
|
|
|||
|
|
@ -1250,20 +1250,6 @@ blockquote footer cite::before {
|
|||
}
|
||||
}
|
||||
|
||||
.layout.hide-aside {
|
||||
max-width: 1000px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 2000px) {
|
||||
.layout.hide-aside {
|
||||
max-width: 1300px;
|
||||
}
|
||||
}
|
||||
|
||||
.layout.hide-aside > div {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
#recent-posts > .recent-post-item:not(:first-child) {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
|
@ -1958,21 +1944,6 @@ blockquote footer cite::before {
|
|||
animation: 1s ease 0s infinite normal none running more-btn-move;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 900px) {
|
||||
html.hide-aside .layout {
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
html.hide-aside .layout > .aside-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
html.hide-aside .layout > div:first-child {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.page .sticky_layout {
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
|
|
@ -3286,48 +3257,6 @@ ul {
|
|||
color: rgb(133, 133, 133);
|
||||
}
|
||||
|
||||
#rightside #rightside-config-hide {
|
||||
transition: transform 0.4s ease 0s;
|
||||
transform: translate(35px, 0px);
|
||||
}
|
||||
|
||||
#rightside #rightside-config-hide.show {
|
||||
transform: translate(0px, 0px) !important;
|
||||
}
|
||||
|
||||
#rightside > div > a,
|
||||
#rightside > div > button {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-color: var(--btn-bg);
|
||||
color: var(--btn-color);
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#rightside > div > a:hover,
|
||||
#rightside > div > button:hover {
|
||||
background-color: var(--btn-hover-color);
|
||||
}
|
||||
|
||||
#rightside #mobile-toc-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
#rightside #mobile-toc-button {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
#rightside #hide-aside-btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#sidebar #menu-mask {
|
||||
position: fixed;
|
||||
z-index: 102;
|
||||
|
|
@ -4671,10 +4600,6 @@ html {
|
|||
overflow-y: overlay;
|
||||
}
|
||||
|
||||
.layout.hide-aside {
|
||||
max-width: 1400px;
|
||||
}
|
||||
|
||||
[data-theme="dark"] img {
|
||||
filter: brightness(1);
|
||||
}
|
||||
|
|
@ -6305,32 +6230,6 @@ a.console_switchbutton {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#rightside {
|
||||
display: none;
|
||||
padding-right: 8px;
|
||||
position: fixed;
|
||||
right: -38px;
|
||||
bottom: 40px;
|
||||
z-index: 100;
|
||||
opacity: 0;
|
||||
transition: all 0.5s ease 0s;
|
||||
}
|
||||
|
||||
#rightside > div > a,
|
||||
#rightside > div > button {
|
||||
margin-bottom: 8px;
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
|
||||
#rightside > div > a:hover,
|
||||
#rightside > div > button {
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
|
||||
#rightside #rightside-config-hide {
|
||||
transform: translate(42px, 0px);
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: linear-gradient(180deg, var(--heo-card-bg-none) 0, var(--heo-card-bg) 25%);
|
||||
margin-top: 1rem;
|
||||
|
|
@ -7168,12 +7067,12 @@ span.fund_name {
|
|||
}
|
||||
|
||||
/* 当隐藏边栏时，显示 100% */
|
||||
.layout.hide > div:first-child {
|
||||
width: 100%;
|
||||
.layout.hide-aside > div:first-child {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* 侧边栏在左侧时，显示 100% */
|
||||
.layout.left > div:first-child {
|
||||
.layout.left-aside > div:first-child {
|
||||
-webkit-box-ordinal-group: 2;
|
||||
-moz-box-ordinal-group: 2;
|
||||
-o-box-ordinal-group: 2;
|
||||
|
|
@ -7183,7 +7082,7 @@ span.fund_name {
|
|||
}
|
||||
|
||||
/* 侧栏在左侧时，关闭左边距，打开右边距 */
|
||||
.layout.left .aside-content {
|
||||
.layout.left-aside .aside-content {
|
||||
padding-right: 15px;
|
||||
padding-left: 0px !important;
|
||||
}
|
||||
|
|
@ -8408,9 +8307,6 @@ span.recent-post-top-text {
|
|||
right: 0px;
|
||||
}
|
||||
|
||||
#rightside {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#web_bg {
|
||||
background: 0px 0px !important;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<div class="aside-content" id="aside-content" th:fragment="aside" th:if="${theme.config.sidebar.location != 'hide'}">
|
||||
<div class="aside-content" id="aside-content" th:fragment="aside" th:if="${theme.config.sidebar.location != 'hide-aside'}">
|
||||
|
||||
<!-- 个人信息卡片 -->
|
||||
<div th:replace="modules/widgets/profile :: profile"></div>
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main class="layout" id="content-inner">
|
||||
<main class="layout" id="content-inner" th:classappend="${theme.config.sidebar.location}">
|
||||
<div id="post">
|
||||
<!-- 文章内容 -->
|
||||
<article class="post-content line-numbers" id="article-container"
|
||||
|
|
@ -229,7 +229,7 @@
|
|||
|
||||
<!-- 侧栏 -->
|
||||
|
||||
<div class="aside-content" id="aside-content">
|
||||
<div class="aside-content" id="aside-content" th:if="${theme.config.sidebar.location != 'hide-aside'}">
|
||||
|
||||
<!-- 个人信息卡片 -->
|
||||
<div th:replace="modules/widgets/profile :: profile"></div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue