anian/halo-theme-pix
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

重写目录样式；适配新域名

Browse Source
This commit is contained in:
anian
2026-07-18 00:48:46 +08:00
parent 048e4336d1
commit 1953fa86c8
15 changed files with 380 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/assets/css/anian.css
+2 -5
View File
@@ -45,13 +45,13 @@
@media (min-width: 960px) and (max-width: 1359.98px) {
.listree-box {
margin-left: calc((100vw - 860px) / 2 + 284px);
margin-left: calc((100vw - 860px) / 2 + 284px + 50px);
}
}
@media (min-width: 1360px) {
.listree-box {
margin-left: calc((100vw - 1400px) / 2 + 291px);
margin-left: calc((100vw - 1400px) / 2 + 291px + 50px);
}
}
@@ -584,7 +584,6 @@
}
}
/* 豆瓣页：默认不显示翻页按钮，避免初始化前出现蓝色链接文本 */
#douban_pagination {
display: none;
padding: 30px;
@@ -620,7 +619,6 @@
justify-content: center;
}
/* 豆瓣页：内容区域左右间距与分类导航保持一致 */
.douban_page #douban_item {
padding: 0;
display: grid;
@@ -671,7 +669,6 @@
}
/* 强制网格单元同高并让卡片内部撑满单元，确保水平分割线对齐 */
.douban_page #douban_item {
align-items: stretch !important;
}
templates/assets/css/dark.css
+41
View File
@@ -129,6 +129,47 @@
background-color: var(--dark-ac-btn);
}
.dark .listree-box {
color: var(--light-color);
background: rgb(27 29 48 / 94%);
border-color: var(--dark-border);
box-shadow: 0 18px 48px rgb(0 0 0 / 28%);
}
.dark .toc_nav .listree-btn:hover,
.dark .toc_nav .listree-btn.is-active {
background: transparent;
box-shadow: none;
}
.dark .toc_nav .listree-btn.is-active i {
transform: rotate(90deg);
}
.dark #listree-ol ul {
border-left-color: var(--dark-border);
}
.dark #listree-ol li a {
color: var(--text-color);
}
.dark #listree-ol li a:hover {
color: var(--light-color);
background: rgb(255 255 255 / 7%);
}
.dark #listree-ol>li.current>a,
.dark #listree-ol>li ul li.current>a {
color: var(--dark-ac-btn);
border-left-color: var(--dark-ac-btn);
background: rgb(43 72 255 / 13%);
}
.dark #listree-ol::-webkit-scrollbar-thumb {
background: rgb(43 72 255 / 48%);
}
.dark .uk-dropdown{
background: var(--dark-border);
color: #666;
templates/assets/css/main.css
+157 -46
View File
@@ -313,6 +313,40 @@ header#masthead {
display: flex;
}
.toc_nav {
display: none;
}
body.toc-ready .toc_nav[aria-hidden="false"] {
display: block;
}
.toc_nav .listree-btn {
border-radius: 8px;
background: transparent;
box-shadow: none;
transition: transform .22s ease;
}
.toc_nav .listree-btn:hover,
.toc_nav .listree-btn.is-active {
background: transparent;
box-shadow: none;
}
.toc_nav .listree-btn:active {
transform: scale(.94);
}
.toc_nav .listree-btn i {
font-size: 20px;
transition: transform .22s ease;
}
.toc_nav .listree-btn.is-active i {
transform: rotate(90deg);
}
.uk-modal-close-full.uk-close {
bottom: 5%;
top: auto;
@@ -1334,6 +1368,7 @@ a.close_local {
.moment_cat_nav,
.posts_cat_nav,
.photos_cat_nav,
.douban_cat_nav,
.friends_cat_nav {
padding: 25px 40px;
border-bottom: 1px solid var(--pix-background);
@@ -1342,6 +1377,7 @@ a.close_local {
.moment_cat_nav ul,
.posts_cat_nav ul,
.photos_cat_nav ul,
.douban_cat_nav ul,
.friends_cat_nav ul {
display: flex;
align-items: center;
@@ -1356,6 +1392,7 @@ a.close_local {
.moment_cat_nav ul li,
.posts_cat_nav ul li,
.photos_cat_nav ul li,
.douban_cat_nav ul li,
.friends_cat_nav ul li {
list-style: none;
flex: none;
@@ -1364,6 +1401,7 @@ a.close_local {
.moment_cat_nav ul::-webkit-scrollbar,
.posts_cat_nav ul::-webkit-scrollbar,
.photos_cat_nav ul::-webkit-scrollbar,
.douban_cat_nav ul::-webkit-scrollbar,
.friends_cat_nav ul::-webkit-scrollbar {
display: none;
@@ -1374,6 +1412,7 @@ a.close_local {
.moment_cat_nav ul li a,
.posts_cat_nav ul li a,
.photos_cat_nav ul li a,
.douban_cat_nav ul li a,
.friends_cat_nav ul li a {
padding: 5px 10px;
background: #e1e9e5;
@@ -1388,6 +1427,7 @@ a.close_local {
.moment_cat_nav ul li a:hover,
.posts_cat_nav ul li a:hover,
.photos_cat_nav ul li a:hover,
.douban_cat_nav ul li a:hover,
.friends_cat_nav ul li a:hover {
background-color: var(--pix-theme);
color: #fff !important;
@@ -1396,6 +1436,7 @@ a.close_local {
.moment_cat_nav ul li a.active,
.posts_cat_nav ul li a.active,
.photos_cat_nav ul li a.active,
.douban_cat_nav ul li a.active,
.friends_cat_nav ul li a.active {
background: var(--pix-theme);
color: #fff !important;
@@ -2268,21 +2309,20 @@ a.go_top.show {
/* 手机端顶部导航栏回到顶部按钮 */
.tool_top {
position: fixed;
bottom: 10%;
opacity: 0;
transition: all 0.15s;
font-size: 26px;
transform: translateY(20px);
transform: translateY(8px);
transition: opacity 0.15s, transform 0.15s;
pointer-events: none;
color: #000000;
}
.tool_top.show {
opacity: 1;
transform: translateY(0px);
transform: translateY(0);
pointer-events: auto;
color: #000000;
}
.tool_top .tool_top_icon {
font-size: 25px;
}
.footer_nav_box .left_inner {
@@ -5974,76 +6014,147 @@ a.change i.ri-refresh-line {
/*toc*/
.listree-box {
display: none;
position: fixed;
z-index: 999;
top: 50%;
left: 0;
background-color: var(--toc-color);
color: #fff;
border-radius: 0 10px 10px 0;
}
h3.listree-titles {
float: right;
cursor: default;
padding: 20px 8px 9px 6px;
font-size: 1.01rem;
}
h3.listree-titles a.listree-btn {
color: #fff;
top: 10px;
left: 15px;
display: block;
width: 22px;
text-align: center;
width: 290px;
max-width: calc(100vw - 32px);
max-height: calc(100vh - 124px);
overflow: hidden;
color: #29372f;
background: rgb(255 255 255 / 92%);
border: 1px solid rgb(34 187 109 / 16%);
border-radius: 12px;
box-shadow: 0 18px 48px rgb(23 45 31 / 16%);
backdrop-filter: blur(.7rem);
-webkit-backdrop-filter: blur(.7rem);
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translate3d(-12px, 8px, 0) scale(.98);
transform-origin: top left;
transition: opacity .24s ease, visibility .24s ease, transform .24s ease;
}
.listree-box.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translate3d(0, 0, 0) scale(1);
}
#listree-ol {
max-height: 230px;
overflow: scroll;
display: block;
max-height: min(58vh, 420px);
overflow-y: auto;
overflow-x: hidden;
float: left;
height: 100%;
min-height: 100px;
line-height: 1.5;
margin: 20px 0px 20px -10px;
padding-right: 20px;
align-items: center;
border-right: 1px solid #eeeeef;
float: none;
height: auto;
min-height: 0;
line-height: 1.45;
margin: 0;
padding: 12px 10px 14px;
list-style: none;
border: 0;
}
#listree-ol li {
line-height: 1.8;
margin-bottom: 6px;
line-height: inherit;
margin: 2px 0;
list-style: none;
}
#listree-ol li a {
color: #fff;
display: block;
width: 100%;
box-sizing: border-box;
padding: 7px 10px 7px 12px;
color: #52685b;
border-left: 3px solid transparent;
border-radius: 8px;
font-size: 13px;
line-height: 1.45;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}
#listree-ol li a:hover {
color: #15251c;
background: rgb(34 187 109 / 8%);
transform: translateX(2px);
}
#listree-ol ul {
margin-top: 0px;
margin: 3px 0 3px 12px;
padding-left: 10px;
border-left: 1px solid rgb(34 54 41 / 10%);
list-style: none;
}
#listree-ol a.node-name--H1,
#listree-ol a.node-name--H2 {
font-weight: 600;
}
#listree-ol a.node-name--H4,
#listree-ol a.node-name--H5,
#listree-ol a.node-name--H6 {
font-size: 12px;
}
a#listree-click.current,
#listree-ol>li.current>a,
#listree-ol>li ul li.current>a {
color: #f2ff2c;
color: var(--toc-color);
border-left-color: var(--toc-color);
background: rgb(34 187 109 / 10%);
font-weight: 700;
}
.listree-box.is-open #listree-ol li {
animation: listreeItemIn .26s ease both;
}
#listree-ol::-webkit-scrollbar-track {
background-color: #fff;
background-color: transparent;
}
#listree-ol::-webkit-scrollbar-thumb {
background: rgb(199, 201, 204);
background: rgb(34 187 109 / 26%);
border-radius: 999px;
}
#listree-ol::-webkit-scrollbar {
width: 3px;
width: 4px;
}
@keyframes listreeItemIn {
from {
opacity: 0;
transform: translateX(-6px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
@media (prefers-reduced-motion: reduce) {
.toc_nav .listree-btn,
.toc_nav .listree-btn i,
.listree-box,
#listree-ol li a {
transition: none;
}
.listree-box.is-open #listree-ol li {
animation: none;
}
}
.dark .db--container {
@@ -6872,4 +6983,4 @@ a#listree-click.current,
font-family: 'MuYao';
src: url('/upload/mu-yao-sui-xin-shou-xie-ti.woff2') format('woff2');
font-display: swap;
}
}
templates/assets/css/mobile.css
+32 -15
View File
@@ -303,6 +303,7 @@
.moment_cat_nav,
.posts_cat_nav,
.photos_cat_nav,
.douban_cat_nav,
.friends_cat_nav {
padding: 15px;
}
@@ -742,30 +743,42 @@
}
/* 手机端文章目录调整 */
h3.listree-titles {
font-size: 0.8rem;
padding: 9px 0;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
.listree-box {
left: 40px;
right: 12px;
max-width: 85vw;
max-height: calc(100vh - 96px);
margin-left: 0;
border-radius: 12px;
transform: translate3d(0, -8px, 0) scale(.98);
transform-origin: top center;
}
#listree-ol li a {
font-size: 0.8rem;
.listree-box.is-open {
transform: translate3d(0, 0, 0) scale(1);
}
#listree-ol {
margin: 10px 0 15px -10px;
padding-right: 15px;
max-height: min(56vh, 420px);
margin: 0;
padding: 10px 8px 12px;
}
#listree-ol li {
line-height: 1.2;
margin-top: 6px;
line-height: inherit;
margin: 2px 0;
list-style: none;
}
#listree-ol li a {
font-size: 0.82rem;
padding: 7px 9px 7px 10px;
}
.toc_nav .listree-btn.is-active i {
transform: rotate(90deg);
}
/* 手机端底部音乐按钮颜色 */
.footer_menu a.playing-music,
.footer_menu a.playing-music i,
@@ -773,7 +786,11 @@
color: #4CAF50;
}
/* 手机端顶部工具按钮 */
.top_tool a {
padding: 6px;
display: flex;
}
}
}