From 59cf1a13e8406b64d7999a6c204d3af4ba679fb7 Mon Sep 17 00:00:00 2001 From: UPToZ Date: Sat, 13 Apr 2024 14:27:42 +0800 Subject: [PATCH] =?UTF-8?q?1.=E4=BF=AE=E6=94=B9=E4=BE=A7=E6=A0=8F=E4=B8=AD?= =?UTF-8?q?=E7=9A=84=E5=B9=BF=E5=91=8A=E5=9B=BE=E7=89=87=E4=B8=BA=E5=9C=86?= =?UTF-8?q?=E8=A7=92=EF=BC=8C=E5=B9=B6=E5=A2=9E=E5=8A=A0=E4=BA=86=E4=B8=8A?= =?UTF-8?q?=E8=BE=B9=E8=B7=9D=E3=80=82=202.=E7=BB=99=E4=BE=A7=E6=A0=8F?= =?UTF-8?q?=E4=B8=AD=E7=9A=84=E5=B9=BF=E5=91=8A=E5=8C=BA=E5=86=85=E7=9A=84?= =?UTF-8?q?=E2=80=9C=E5=B9=BF=E5=91=8A=E2=80=9D=E5=AD=97=E6=A0=B7=E5=89=8D?= =?UTF-8?q?=E9=9D=A2=E5=A2=9E=E5=8A=A0=E4=BA=86=E4=B8=80=E4=B8=AA=E5=B0=8F?= =?UTF-8?q?=E5=9B=BE=E6=A0=87=E3=80=82=203.=E7=BB=99=E9=A6=96=E9=A1=B5?= =?UTF-8?q?=E7=9A=84=E7=99=BB=E5=BD=95=E4=BA=8C=E7=BA=A7=E8=8F=9C=E5=8D=95?= =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=BA=86=E8=BE=B9=E6=A1=86=EF=BC=8C=E5=90=8C?= =?UTF-8?q?=E6=97=B6=E5=87=8F=E5=B0=8F=E4=BA=86=E5=AE=BD=E5=BA=A6=EF=BC=8C?= =?UTF-8?q?=E5=B9=B6=E4=B8=94=E5=A2=9E=E5=8A=A0=E4=BA=86=E4=B8=8A=E8=BE=B9?= =?UTF-8?q?=E8=B7=9D=E3=80=82=204.=E5=A2=9E=E5=8A=A0=E5=BF=BD=E7=95=A5?= =?UTF-8?q?=E6=96=87=E4=BB=B6=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 + templates/assets/zhheo/zhheoblog.css | 21614 ++++++++++--------- templates/modules/widgets/aside/adbox.html | 37 +- 3 files changed, 10883 insertions(+), 10769 deletions(-) diff --git a/.gitignore b/.gitignore index d702569..a1b21a9 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ release +/release/ diff --git a/templates/assets/zhheo/zhheoblog.css b/templates/assets/zhheo/zhheoblog.css index fbd51d0..ccb897c 100644 --- a/templates/assets/zhheo/zhheoblog.css +++ b/templates/assets/zhheo/zhheoblog.css @@ -1,247 +1,247 @@ @charset "UTF-8"; :root { - --heo-white: #fff; - --heo-white-op: rgba(255, 255, 255, 0.2); - --heo-black: #000; - --heo-black-op: rgba(0, 0, 0, 0.2); - --heo-none: #00000000; - --heo-gray: #999999; - --heo-gray-op: #9999992b; - --heo-vip: #e5a80d; - --heo-main: var(--heo-theme); - --heo-main-op: var(--heo-theme-op); - --heo-main-op-deep: var(--heo-theme-op-deep); - --heo-main-op-light: var(--heo-theme-op-light); - --heo-main-none: var(--heo-theme-none); - --heo-shadow-theme: 0 8px 12px -3px var(--heo-theme-op); - --heo-shadow-blackdeep: 0 2px 16px -3px rgba(0, 0, 0, 0.15); - --heo-shadow-main: 0 8px 12px -3px var(--heo-main-op); - --heo-shadow-blue: 0 8px 12px -3px rgba(40, 109, 234, 0.2); - --heo-shadow-white: 0 8px 12px -3px rgba(255, 255, 255, 0.2); - --heo-shadow-black: 0 0 12px 4px rgba(0, 0, 0, 0.05); - --heo-shadow-yellow: 0px 38px 77px -26px rgba(255, 201, 62, 0.12); - --heo-shadow-red: 0 8px 12px -3px #ee7d7936; - --heo-shadow-green: 0 8px 12px -3px #87ee7936; - --heo-logo-color: linear-gradient(215deg, #4584ff 0%, #cf0db9 100%); - --heo-snackbar-time: 5s; - --style-border: 1px solid var(--heo-card-border); - --style-border-always: 1px solid var(--heo-card-border); - --style-border-hover: 1px solid var(--heo-main); - --style-border-hover-always: 1px solid var(--heo-main); - --style-border-dashed: 1px dashed var(--heo-theme-op); - --heo-radius-full: 50px; + --heo-white: #fff; + --heo-white-op: rgba(255, 255, 255, 0.2); + --heo-black: #000; + --heo-black-op: rgba(0, 0, 0, 0.2); + --heo-none: #00000000; + --heo-gray: #999999; + --heo-gray-op: #9999992b; + --heo-vip: #e5a80d; + --heo-main: var(--heo-theme); + --heo-main-op: var(--heo-theme-op); + --heo-main-op-deep: var(--heo-theme-op-deep); + --heo-main-op-light: var(--heo-theme-op-light); + --heo-main-none: var(--heo-theme-none); + --heo-shadow-theme: 0 8px 12px -3px var(--heo-theme-op); + --heo-shadow-blackdeep: 0 2px 16px -3px rgba(0, 0, 0, 0.15); + --heo-shadow-main: 0 8px 12px -3px var(--heo-main-op); + --heo-shadow-blue: 0 8px 12px -3px rgba(40, 109, 234, 0.2); + --heo-shadow-white: 0 8px 12px -3px rgba(255, 255, 255, 0.2); + --heo-shadow-black: 0 0 12px 4px rgba(0, 0, 0, 0.05); + --heo-shadow-yellow: 0px 38px 77px -26px rgba(255, 201, 62, 0.12); + --heo-shadow-red: 0 8px 12px -3px #ee7d7936; + --heo-shadow-green: 0 8px 12px -3px #87ee7936; + --heo-logo-color: linear-gradient(215deg, #4584ff 0%, #cf0db9 100%); + --heo-snackbar-time: 5s; + --style-border: 1px solid var(--heo-card-border); + --style-border-always: 1px solid var(--heo-card-border); + --style-border-hover: 1px solid var(--heo-main); + --style-border-hover-always: 1px solid var(--heo-main); + --style-border-dashed: 1px dashed var(--heo-theme-op); + --heo-radius-full: 50px; } ::selection { - background: var(--heo-fontcolor); - color: var(--heo-background); + background: var(--heo-fontcolor); + color: var(--heo-background); } [data-theme=light] { - --heo-theme: #425AEF; - --heo-theme-op: #4259ef23; - --heo-theme-op-deep: #4259efdd; - --heo-theme-op-light: #4259ef0d; - --heo-theme-none: #4259ef01; - --heo-blue: #425AEF; - --heo-red: #f04a63; - --heo-pink: #FF7C7C; - --heo-green: #57bd6a; - --heo-yellow: #c28b00; - --heo-yellow-op: #d99c001a; - --heo-orange: #e38100; - --heo-fontcolor: #363636; - --heo-background: #f7f9fe; - --heo-reverse: #000; - --heo-maskbg: rgba(255, 255, 255, 0.6); - --heo-maskbgdeep: rgba(255, 255, 255, 0.85); - --heo-hovertext: var(--heo-main); - --heo-ahoverbg: #F7F7FA; - --heo-lighttext: var(--heo-main); - --heo-secondtext: rgba(60, 60, 67, 0.8); - --heo-scrollbar: rgba(60, 60, 67, 0.4); - --heo-card-btn-bg: #edf0f7; - --heo-post-blockquote-bg: #fafcff; - --heo-post-tabs-bg: #f2f5f8; - --heo-secondbg: #f7f7f9; - --heo-shadow-nav: 0 5px 12px -5px rgba(102, 68, 68, 0.05); - --heo-card-bg: #fff; - --heo-card-bg-op: var(--heo-black-op); - --heo-card-bg-none: rgba(255, 255, 255, 0); - --heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0); - --heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0); - --heo-card-border: #e3e8f7; - --heo-shadow-border: 0 8px 16px -4px #2c2d300c; - --style-border-forever: 2px solid var(--heo-main); + --heo-theme: #425AEF; + --heo-theme-op: #4259ef23; + --heo-theme-op-deep: #4259efdd; + --heo-theme-op-light: #4259ef0d; + --heo-theme-none: #4259ef01; + --heo-blue: #425AEF; + --heo-red: #f04a63; + --heo-pink: #FF7C7C; + --heo-green: #57bd6a; + --heo-yellow: #c28b00; + --heo-yellow-op: #d99c001a; + --heo-orange: #e38100; + --heo-fontcolor: #363636; + --heo-background: #f7f9fe; + --heo-reverse: #000; + --heo-maskbg: rgba(255, 255, 255, 0.6); + --heo-maskbgdeep: rgba(255, 255, 255, 0.85); + --heo-hovertext: var(--heo-main); + --heo-ahoverbg: #F7F7FA; + --heo-lighttext: var(--heo-main); + --heo-secondtext: rgba(60, 60, 67, 0.8); + --heo-scrollbar: rgba(60, 60, 67, 0.4); + --heo-card-btn-bg: #edf0f7; + --heo-post-blockquote-bg: #fafcff; + --heo-post-tabs-bg: #f2f5f8; + --heo-secondbg: #f7f7f9; + --heo-shadow-nav: 0 5px 12px -5px rgba(102, 68, 68, 0.05); + --heo-card-bg: #fff; + --heo-card-bg-op: var(--heo-black-op); + --heo-card-bg-none: rgba(255, 255, 255, 0); + --heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0); + --heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0); + --heo-card-border: #e3e8f7; + --heo-shadow-border: 0 8px 16px -4px #2c2d300c; + --style-border-forever: 2px solid var(--heo-main); } [data-theme=dark] { - --heo-theme: #ffc848; - --heo-theme-op: #f2b94b23; - --heo-theme-op-deep: #f2b94bdd; - --heo-theme-none: #f2b94b00; - --heo-blue: #0084FF; - --heo-red: #FF3842; - --heo-pink: #d44040; - --heo-green: #3e9f50; - --heo-yellow: #ffc93e; - --heo-yellow-op: #ffc93e30; - --heo-orange: #ff953e; - --heo-fontcolor: #F7F7FA; - --heo-background: #18171d; - --heo-reverse: #fff; - --heo-maskbg: rgba(0, 0, 0, 0.6); - --heo-maskbgdeep: rgba(0, 0, 0, 0.85); - --heo-hovertext: #0A84FF; - --heo-ahoverbg: #fff; - --heo-lighttext: var(--heo-theme); - --heo-secondtext: #a1a2b8; - --heo-scrollbar: rgba(200, 200, 223, 0.4); - --heo-card-btn-bg: #30343f; - --heo-post-blockquote-bg: #000; - --heo-post-tabs-bg: #121212; - --heo-secondbg: #21232a; - --heo-shadow-nav: 0 5px 20px 0px rgba(28, 28, 28, 0.4); - --heo-card-bg: #1d1e22; - --heo-card-bg-op: var(--heo-white-op); - --heo-card-bg-none: #1d1b2600; - --heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0); - --heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0); - --heo-card-border: #3d3d3f; - --heo-shadow-border: 0 8px 16px -4px #00000050; - --style-border: 1px solid var(--heo-card-border); - --style-border-always: 1px solid var(--heo-card-border); - --style-border-hover: 1px solid var(--heo-lighttext); - --style-border-dashed: 1px dashed var(--heo-theme-op); - --style-border-forever: 2px solid var(--heo-lighttext); + --heo-theme: #ffc848; + --heo-theme-op: #f2b94b23; + --heo-theme-op-deep: #f2b94bdd; + --heo-theme-none: #f2b94b00; + --heo-blue: #0084FF; + --heo-red: #FF3842; + --heo-pink: #d44040; + --heo-green: #3e9f50; + --heo-yellow: #ffc93e; + --heo-yellow-op: #ffc93e30; + --heo-orange: #ff953e; + --heo-fontcolor: #F7F7FA; + --heo-background: #18171d; + --heo-reverse: #fff; + --heo-maskbg: rgba(0, 0, 0, 0.6); + --heo-maskbgdeep: rgba(0, 0, 0, 0.85); + --heo-hovertext: #0A84FF; + --heo-ahoverbg: #fff; + --heo-lighttext: var(--heo-theme); + --heo-secondtext: #a1a2b8; + --heo-scrollbar: rgba(200, 200, 223, 0.4); + --heo-card-btn-bg: #30343f; + --heo-post-blockquote-bg: #000; + --heo-post-tabs-bg: #121212; + --heo-secondbg: #21232a; + --heo-shadow-nav: 0 5px 20px 0px rgba(28, 28, 28, 0.4); + --heo-card-bg: #1d1e22; + --heo-card-bg-op: var(--heo-white-op); + --heo-card-bg-none: #1d1b2600; + --heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0); + --heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0); + --heo-card-border: #3d3d3f; + --heo-shadow-border: 0 8px 16px -4px #00000050; + --style-border: 1px solid var(--heo-card-border); + --style-border-always: 1px solid var(--heo-card-border); + --style-border-hover: 1px solid var(--heo-lighttext); + --style-border-dashed: 1px dashed var(--heo-theme-op); + --style-border-forever: 2px solid var(--heo-lighttext); } @media screen and (max-width: 768px) { - :root { - --style-border: 1px solid var(--heo-none); - --style-border-hover: 1px solid var(--heo-none) - } + :root { + --style-border: 1px solid var(--heo-none); + --style-border-hover: 1px solid var(--heo-none) + } } @keyframes barrageIn { - 0% { - transform: translateY(20px); - opacity: 0; - } + 0% { + transform: translateY(20px); + opacity: 0; + } - 100% { - transform: translateY(0px); - opacity: 1; - } + 100% { + transform: translateY(0px); + opacity: 1; + } } @keyframes barrageOut { - 0% { - transform: translateY(0px); - opacity: 1; - } + 0% { + transform: translateY(0px); + opacity: 1; + } - 100% { - transform: translateY(20px); - opacity: 0; - } + 100% { + transform: translateY(20px); + opacity: 0; + } } i.haofont { - line-height: 1; + line-height: 1; } .todolist-item i.haofont { - display: var(--fa-display, inline-block); + display: var(--fa-display, inline-block); } #page #post-comment p a:not(.headerlink):not(.fancybox) { - text-decoration: none; - border-bottom: 2px solid var(--heo-lighttext); - font-weight: 700; - padding: 0 4px; - border-radius: 4px 4px 0 0 + text-decoration: none; + border-bottom: 2px solid var(--heo-lighttext); + font-weight: 700; + padding: 0 4px; + border-radius: 4px 4px 0 0 } #page p a:hover { - text-decoration: none + text-decoration: none } /* 旧版css */ html { - line-height: 1.15; - text-size-adjust: 100%; + line-height: 1.15; + text-size-adjust: 100%; } main { - display: block; + display: block; } h1 { - font-size: 2em; - margin: 0.67em 0px; + font-size: 2em; + margin: 0.67em 0px; } hr { - box-sizing: content-box; - height: 0px; - overflow: visible; + box-sizing: content-box; + height: 0px; + overflow: visible; } pre { - font-family: monospace, monospace; - font-size: 1em; + font-family: monospace, monospace; + font-size: 1em; } a { - background-color: transparent; - color: var(--heo-fontcolor); - text-decoration: none; - transition: all .3s ease-out 0s; - overflow-wrap: break-word; - -webkit-user-drag: none; + background-color: transparent; + color: var(--heo-fontcolor); + text-decoration: none; + transition: all .3s ease-out 0s; + overflow-wrap: break-word; + -webkit-user-drag: none; } abbr[title] { - border-bottom: none; - text-decoration: underline dotted; + border-bottom: none; + text-decoration: underline dotted; } b, strong { - font-weight: bolder; + font-weight: bolder; } code, kbd, samp { - font-family: monospace, monospace; - font-size: 1em; + font-family: monospace, monospace; + font-size: 1em; } small { - font-size: 80%; + font-size: 80%; } sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; } sub { - bottom: -0.25em; + bottom: -0.25em; } sup { - top: -0.5em; + top: -0.5em; } img { - border-style: none; + border-style: none; } button, @@ -249,100 +249,100 @@ input, optgroup, select, textarea { - font-family: inherit; - font-size: 100%; - line-height: 1.15; - margin: 0px; + font-family: inherit; + font-size: 100%; + line-height: 1.15; + margin: 0px; } button, input { - overflow: visible; + overflow: visible; } button, select { - text-transform: none; + text-transform: none; } [type="button"], [type="reset"], [type="submit"], button { - appearance: button; + appearance: button; } fieldset { - padding: 0.35em 0.75em 0.625em; + padding: 0.35em 0.75em 0.625em; } legend { - box-sizing: border-box; - color: inherit; - display: table; - max-width: 100%; - padding: 0px; - white-space: normal; + box-sizing: border-box; + color: inherit; + display: table; + max-width: 100%; + padding: 0px; + white-space: normal; } progress { - vertical-align: baseline; + vertical-align: baseline; } textarea { - overflow: auto; + overflow: auto; } [type="checkbox"], [type="radio"] { - box-sizing: border-box; - padding: 0px; + box-sizing: border-box; + padding: 0px; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { - height: auto; + height: auto; } [type="search"] { - appearance: textfield; - outline-offset: -2px; + appearance: textfield; + outline-offset: -2px; } [type="search"]::-webkit-search-decoration { - appearance: none; + appearance: none; } ::-webkit-file-upload-button { - appearance: button; - font: inherit; + appearance: button; + font: inherit; } summary { - display: list-item; + display: list-item; } template { - display: none; + display: none; } [hidden] { - display: none; + display: none; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span, -#aside-content .card-info .card-info-data > .card-info-data-item a .headline, +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span, +#aside-content .card-info .card-info-data>.card-info-data-item a .headline, #pagination .next_info, #pagination .prev_info, #sidebar #sidebar-menus .menus_items .site-page, -#sidebar #sidebar-menus .site-data .data-item .data-item-link > a > div, -.flink#article-container .flink-list > .flink-list-item a .flink-item-desc, -.flink#article-container .flink-list > .flink-list-item a .flink-item-name, +#sidebar #sidebar-menus .site-data .data-item .data-item-link>a>div, +.flink#article-container .flink-list>.flink-list-item a .flink-item-desc, +.flink#article-container .flink-list>.flink-list-item a .flink-item-name, .limit-one-line { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } @@ -355,434 +355,434 @@ template { #post .post-copyright::before, #post .post-outdate-notice::before, .fontawesomeIcon { - display: inline-block; - font-weight: 600; - font-style: normal; - font-variant: normal; - font-family: "Font Awesome 5 Free"; - text-rendering: auto; - -webkit-font-smoothing: antialiased; + display: inline-block; + font-weight: 600; + font-style: normal; + font-variant: normal; + font-family: "Font Awesome 5 Free"; + text-rendering: auto; + -webkit-font-smoothing: antialiased; } .card-announcement-animation { - color: red; - animation: 0.8s linear 0s infinite normal none running announ_animation; + color: red; + animation: 0.8s linear 0s infinite normal none running announ_animation; } .scroll-down-effects { - animation: 1.5s ease 0s infinite normal none running scroll-down-effect; + animation: 1.5s ease 0s infinite normal none running scroll-down-effect; } .reward-main { - animation: slide-in .3s ease 0s 1 normal none running + animation: slide-in .3s ease 0s 1 normal none running } @-webkit-keyframes scroll-down-effect { - 0% { - top: 0px; - opacity: 0.4; - } + 0% { + top: 0px; + opacity: 0.4; + } - 50% { - top: -16px; - opacity: 1; - filter: none; - } + 50% { + top: -16px; + opacity: 1; + filter: none; + } - 100% { - top: 0px; - opacity: 0.4; - } + 100% { + top: 0px; + opacity: 0.4; + } } @keyframes scroll-down-effect { - 0% { - top: 0px; - opacity: 0.4; - } + 0% { + top: 0px; + opacity: 0.4; + } - 50% { - top: -16px; - opacity: 1; - filter: none; - } + 50% { + top: -16px; + opacity: 1; + filter: none; + } - 100% { - top: 0px; - opacity: 0.4; - } + 100% { + top: 0px; + opacity: 0.4; + } } @-webkit-keyframes header-effect { - 0% { - opacity: 0; - transform: translateY(-50px); - } + 0% { + opacity: 0; + transform: translateY(-50px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @keyframes header-effect { - 0% { - opacity: 0; - transform: translateY(-50px); - } + 0% { + opacity: 0; + transform: translateY(-50px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @-webkit-keyframes headerNoOpacity { - 0% { - transform: translateY(-50px); - } + 0% { + transform: translateY(-50px); + } - 100% { - transform: translateY(0px); - } + 100% { + transform: translateY(0px); + } } @keyframes headerNoOpacity { - 0% { - transform: translateY(-50px); - } + 0% { + transform: translateY(-50px); + } - 100% { - transform: translateY(0px); - } + 100% { + transform: translateY(0px); + } } @-webkit-keyframes bottom-top { - 0% { - opacity: 0; - margin-top: 50px; - } + 0% { + opacity: 0; + margin-top: 50px; + } - 100% { - opacity: 1; - filter: none; - margin-top: 0px; - } + 100% { + opacity: 1; + filter: none; + margin-top: 0px; + } } @keyframes bottom-top { - 0% { - opacity: 0; - margin-top: 50px; - } + 0% { + opacity: 0; + margin-top: 50px; + } - 100% { - opacity: 1; - filter: none; - margin-top: 0px; - } + 100% { + opacity: 1; + filter: none; + margin-top: 0px; + } } @-webkit-keyframes titlescale { - 0% { - opacity: 0; - transform: scale(0.7); - } + 0% { + opacity: 0; + transform: scale(0.7); + } - 100% { - opacity: 1; - filter: none; - transform: scale(1); - } + 100% { + opacity: 1; + filter: none; + transform: scale(1); + } } @keyframes titlescale { - 0% { - opacity: 0; - transform: scale(0.7); - } + 0% { + opacity: 0; + transform: scale(0.7); + } - 100% { - opacity: 1; - filter: none; - transform: scale(1); - } + 100% { + opacity: 1; + filter: none; + transform: scale(1); + } } @-webkit-keyframes search_close { - 0% { - opacity: 1; - filter: none; - transform: scale(1); - } + 0% { + opacity: 1; + filter: none; + transform: scale(1); + } - 100% { - opacity: 0; - transform: scale(0.7); - } + 100% { + opacity: 0; + transform: scale(0.7); + } } @keyframes search_close { - 0% { - opacity: 1; - filter: none; - transform: scale(1); - } + 0% { + opacity: 1; + filter: none; + transform: scale(1); + } - 100% { - opacity: 0; - transform: scale(0.7); - } + 100% { + opacity: 0; + transform: scale(0.7); + } } @-webkit-keyframes to_show { - 0% { - opacity: 0; - } + 0% { + opacity: 0; + } - 100% { - opacity: 1; - filter: none; - } + 100% { + opacity: 1; + filter: none; + } } @keyframes to_show { - 0% { - opacity: 0; - } + 0% { + opacity: 0; + } - 100% { - opacity: 1; - filter: none; - } + 100% { + opacity: 1; + filter: none; + } } @-webkit-keyframes to_hide { - 0% { - opacity: 1; - filter: none; - } + 0% { + opacity: 1; + filter: none; + } - 100% { - opacity: 0; - } + 100% { + opacity: 0; + } } @keyframes to_hide { - 0% { - opacity: 1; - filter: none; - } + 0% { + opacity: 1; + filter: none; + } - 100% { - opacity: 0; - } + 100% { + opacity: 0; + } } @-webkit-keyframes ribbon_to_show { - 0% { - opacity: 0; - } + 0% { + opacity: 0; + } - 100% { - opacity: 0.6; - } + 100% { + opacity: 0.6; + } } @keyframes ribbon_to_show { - 0% { - opacity: 0; - } + 0% { + opacity: 0; + } - 100% { - opacity: 0.6; - } + 100% { + opacity: 0.6; + } } @-webkit-keyframes avatar_turn_around { - 0% { - transform: rotate(0deg); - } + 0% { + transform: rotate(0deg); + } - 100% { - transform: rotate(360deg); - } + 100% { + transform: rotate(360deg); + } } @keyframes avatar_turn_around { - 0% { - transform: rotate(0deg); - } + 0% { + transform: rotate(0deg); + } - 100% { - transform: rotate(360deg); - } + 100% { + transform: rotate(360deg); + } } @-webkit-keyframes sub_menus { - 0% { - opacity: 0; - transform: translateY(10px); - } + 0% { + opacity: 0; + transform: translateY(10px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @keyframes sub_menus { - 0% { - opacity: 0; - transform: translateY(10px); - } + 0% { + opacity: 0; + transform: translateY(10px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @-webkit-keyframes donate_effcet { - 0% { - opacity: 0; - transform: translateY(-20px); - } + 0% { + opacity: 0; + transform: translateY(-20px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @keyframes donate_effcet { - 0% { - opacity: 0; - transform: translateY(-20px); - } + 0% { + opacity: 0; + transform: translateY(-20px); + } - 100% { - opacity: 1; - filter: none; - transform: translateY(0px); - } + 100% { + opacity: 1; + filter: none; + transform: translateY(0px); + } } @-webkit-keyframes announ_animation { - 0%, - 100% { - transform: scale(1); - filter: blur(0px); - } + 0%, + 100% { + transform: scale(1); + filter: blur(0px); + } - 50% { - transform: scale(1.2); - filter: blur(20px); - } + 50% { + transform: scale(1.2); + filter: blur(20px); + } } @keyframes announ_animation { - 0%, - 100% { - transform: scale(1); - filter: blur(0px); - } + 0%, + 100% { + transform: scale(1); + filter: blur(0px); + } - 50% { - transform: scale(1.2); - filter: blur(20px); - } + 50% { + transform: scale(1.2); + filter: blur(20px); + } } @-webkit-keyframes sidebarItem { - 0% { - transform: translateX(200px); - } + 0% { + transform: translateX(200px); + } - 100% { - transform: translateX(0px); - } + 100% { + transform: translateX(0px); + } } @keyframes sidebarItem { - 0% { - transform: translateX(200px); - } + 0% { + transform: translateX(200px); + } - 100% { - transform: translateX(0px); - } + 100% { + transform: translateX(0px); + } } @keyframes heo-spin { - 0% { - transform: rotate(0) - } + 0% { + transform: rotate(0) + } - 100% { - transform: rotate(360deg) - } + 100% { + transform: rotate(360deg) + } } :root { - --global-font-size: 16px; - --global-bg: #fff; - --font-color: #4c4948; - --hr-border: #97bcfb; - --hr-before-color: #6ea2f9; - --search-bg: #f6f8fa; - --search-input-color: #4c4948; - --search-result-title: #4c4948; - --preloader-bg: #37474f; - --preloader-color: #fff; - --tab-border-color: #f0f0f0; - --tab-botton-bg: #f0f0f0; - --tab-botton-color: #1f2d3d; - --tab-button-hover-bg: #dcdcdc; - --tab-button-active-bg: #fff; - --card-bg: #fff; - --sidebar-bg: #f6f8fa; - --btn-hover-color: #ff7242; - --btn-color: #fff; - --btn-bg: #307af6; - --text-bg-hover: #307af6; - --light-grey: #eee; - --white: #fff; - --text-highlight-color: #1f2d3d; - --blockquote-color: #6a737d; - --blockquote-bg: rgba(73, 177, 245, 0.1); - --reward-pop: #f5f5f5; - --toc-link-color: #666261; - --card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.06); - --card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.15); + --global-font-size: 16px; + --global-bg: #fff; + --font-color: #4c4948; + --hr-border: #97bcfb; + --hr-before-color: #6ea2f9; + --search-bg: #f6f8fa; + --search-input-color: #4c4948; + --search-result-title: #4c4948; + --preloader-bg: #37474f; + --preloader-color: #fff; + --tab-border-color: #f0f0f0; + --tab-botton-bg: #f0f0f0; + --tab-botton-color: #1f2d3d; + --tab-button-hover-bg: #dcdcdc; + --tab-button-active-bg: #fff; + --card-bg: #fff; + --sidebar-bg: #f6f8fa; + --btn-hover-color: #ff7242; + --btn-color: #fff; + --btn-bg: #307af6; + --text-bg-hover: #307af6; + --light-grey: #eee; + --white: #fff; + --text-highlight-color: #1f2d3d; + --blockquote-color: #6a737d; + --blockquote-bg: rgba(73, 177, 245, 0.1); + --reward-pop: #f5f5f5; + --toc-link-color: #666261; + --card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.06); + --card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.15); } html { - height: 100%; - font-size: 20px; + height: 100%; + font-size: 20px; } body { - position: relative; - min-height: 100%; - background: var(--heo-background); - color: var(--heo-fontcolor); - font-size: var(--global-font-size); - font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"; - line-height: 2; - -webkit-tap-highlight-color: transparent; - margin: 0px; + position: relative; + min-height: 100%; + background: var(--heo-background); + color: var(--heo-fontcolor); + font-size: var(--global-font-size); + font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"; + line-height: 2; + -webkit-tap-highlight-color: transparent; + margin: 0px; } input::placeholder { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } @@ -792,10 +792,10 @@ h3, h4, h5, h6 { - position: relative; - margin: 1rem 0px 0.7rem; - color: var(--text-highlight-color); - font-weight: 700; + position: relative; + margin: 1rem 0px 0.7rem; + color: var(--text-highlight-color); + font-weight: 700; } h1 code, @@ -804,63 +804,63 @@ h3 code, h4 code, h5 code, h6 code { - font-size: inherit !important; + font-size: inherit !important; } * { - box-sizing: border-box; + box-sizing: border-box; } hr { - position: relative; - margin: 2rem auto; - border: 2px dashed var(--hr-border); + position: relative; + margin: 2rem auto; + border: 2px dashed var(--hr-border); } .table-wrap { - overflow-x: scroll; - margin: 0px 0px 1rem; + overflow-x: scroll; + margin: 0px 0px 1rem; } table { - display: table; - width: 100%; - border-spacing: 0px; - border-collapse: collapse; - empty-cells: show; + display: table; + width: 100%; + border-spacing: 0px; + border-collapse: collapse; + empty-cells: show; } table thead { - background: rgba(153, 169, 191, 0.1); + background: rgba(153, 169, 191, 0.1); } table td, table th { - padding: 0.3rem 0.6rem; - border: 1px solid var(--light-grey); - vertical-align: middle; + padding: 0.3rem 0.6rem; + border: 1px solid var(--light-grey); + vertical-align: middle; } ::selection { - background: rgb(0, 121, 255); - color: rgb(247, 247, 247); + background: rgb(0, 121, 255); + color: rgb(247, 247, 247); } .fa-spin { - animation: heo-spin 1.2s linear infinite; - opacity: .6 + animation: heo-spin 1.2s linear infinite; + opacity: .6 } button { - padding: 0px; - outline: 0px; - border: none; - background: 0px 0px; - cursor: pointer; + padding: 0px; + outline: 0px; + border: none; + background: 0px 0px; + cursor: pointer; } a:hover { - color: var(--heo-lighttext) + color: var(--heo-lighttext) } #aside-content .author-info__description, @@ -868,1318 +868,1320 @@ a:hover { #site-name, #site-subtitle, #site-title { - font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; + font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; } .is-center { - text-align: center; + text-align: center; } .copy-true { - user-select: all; + user-select: all; } .pull-left { - float: left; + float: left; } .pull-right { - float: right; + float: right; } .button--animated { - position: relative; - z-index: 1; - transition: color 1s ease 0s; + position: relative; + z-index: 1; + transition: color 1s ease 0s; } .button--animated::before { - position: absolute; - inset: 0px; - z-index: -1; - background: var(--btn-hover-color); - content: ""; - transition: transform 0.5s ease-out 0s; - transform: scaleX(0); - transform-origin: 0px 50%; + position: absolute; + inset: 0px; + z-index: -1; + background: var(--btn-hover-color); + content: ""; + transition: transform 0.5s ease-out 0s; + transform: scaleX(0); + transform-origin: 0px 50%; } .button--animated:hover::before { - transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66); - transform: scaleX(1); + transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66); + transform: scaleX(1); } img { - max-width: 100%; - transition: all 0.2s ease 0s; - border-style: none + max-width: 100%; + transition: all 0.2s ease 0s; + border-style: none } img:not([src]), img[src=""] { - opacity: 0; + opacity: 0; } .img-alt { - margin: -0.5rem 0px 0.5rem; - color: rgb(133, 133, 133); + margin: -0.5rem 0px 0.5rem; + color: rgb(133, 133, 133); } .img-alt:hover { - text-decoration: none !important; + text-decoration: none !important; } :root { - --hl-color: #eff; - --hl-bg: #212121; - --hltools-bg: #1c1c1c; - --hltools-color: rgba(238, 255, 255, 0.8); - --hlnumber-bg: #212121; - --hlnumber-color: rgba(238, 255, 255, 0.5); - --hlscrollbar-bg: #121212; - --hlexpand-bg: linear-gradient(180deg, rgba(33, 33, 33, 0.6), rgba(33, 33, 33, 0.9)); + --hl-color: #eff; + --hl-bg: #212121; + --hltools-bg: #1c1c1c; + --hltools-color: rgba(238, 255, 255, 0.8); + --hlnumber-bg: #212121; + --hlnumber-color: rgba(238, 255, 255, 0.5); + --hlscrollbar-bg: #121212; + --hlexpand-bg: linear-gradient(180deg, rgba(33, 33, 33, 0.6), rgba(33, 33, 33, 0.9)); } blockquote { - margin: 0px 0px 1rem; - padding: 0.1rem 0.8rem; - border-left: 0.2rem solid rgb(73, 177, 245); - background-color: var(--blockquote-bg); - color: var(--blockquote-color); + margin: 0px 0px 1rem; + padding: 0.1rem 0.8rem; + border-left: 0.2rem solid rgb(73, 177, 245); + background-color: var(--blockquote-bg); + color: var(--blockquote-color); } blockquote a { - word-break: break-all; + word-break: break-all; } blockquote p { - padding: 0.5rem 0px; - margin: 0px !important; + padding: 0.5rem 0px; + margin: 0px !important; } blockquote footer { - padding: 0px 0px 0.5rem; + padding: 0px 0px 0.5rem; } blockquote footer cite::before { - padding: 0px 0.3em; - content: "—"; + padding: 0px 0.3em; + content: "—"; } #article-container .gutter { - user-select: none; + user-select: none; } #article-container .gist table { - width: auto; + width: auto; } #article-container .gist table td { - border: none; + border: none; } @-webkit-keyframes code-expand-key { - 0% { - opacity: 0.6; - } + 0% { + opacity: 0.6; + } - 50% { - opacity: 0.1; - } + 50% { + opacity: 0.1; + } - 100% { - opacity: 0.6; - } + 100% { + opacity: 0.6; + } } @keyframes code-expand-key { - 0% { - opacity: 0.6; - } + 0% { + opacity: 0.6; + } - 50% { - opacity: 0.1; - } + 50% { + opacity: 0.1; + } - 100% { - opacity: 0.6; - } + 100% { + opacity: 0.6; + } } @keyframes slide-in { - from { - transform: translateY(20px); - opacity: 0 - } + from { + transform: translateY(20px); + opacity: 0 + } - to { - transform: translateY(0); - opacity: 1 - } + to { + transform: translateY(0); + opacity: 1 + } } @keyframes slide-in-op { - from { - opacity: 0 - } + from { + opacity: 0 + } - to { - opacity: 1 - } + to { + opacity: 1 + } } .article-sort { - margin-left: 0.5rem; - padding-left: 1rem; - border-left: 2px solid rgb(146, 185, 250); + margin-left: 0.5rem; + padding-left: 1rem; + border-left: 2px solid rgb(146, 185, 250); } .article-sort-title { - position: relative; - margin-left: 0.5rem; - padding-bottom: 1rem; - padding-left: 1rem; - font-size: 1.72em; + position: relative; + margin-left: 0.5rem; + padding-bottom: 1rem; + padding-left: 1rem; + font-size: 1.72em; } .article-sort-title:hover::before { - border-color: rgb(255, 114, 66); + border-color: rgb(255, 114, 66); } .article-sort-title::before { - position: absolute; - top: calc((100% - 1.8rem) / 2); - left: -0.45rem; - z-index: 1; - width: 0.5rem; - height: 0.5rem; - border: 0.25rem solid rgb(48, 122, 246); - border-radius: 0.5rem; - background: var(--card-bg); - content: ""; - line-height: 0.5rem; - transition: all 0.2s ease-in-out 0s; + position: absolute; + top: calc((100% - 1.8rem) / 2); + left: -0.45rem; + z-index: 1; + width: 0.5rem; + height: 0.5rem; + border: 0.25rem solid rgb(48, 122, 246); + border-radius: 0.5rem; + background: var(--card-bg); + content: ""; + line-height: 0.5rem; + transition: all 0.2s ease-in-out 0s; } .article-sort-title::after { - position: absolute; - bottom: 0px; - left: 0px; - z-index: 0; - width: 0.1rem; - height: 1.5em; - background: rgb(146, 185, 250); - content: ""; + position: absolute; + bottom: 0px; + left: 0px; + z-index: 0; + width: 0.1rem; + height: 1.5em; + background: rgb(146, 185, 250); + content: ""; } .article-sort-item { - position: relative; - display: flex; - -webkit-box-align: center; - align-items: center; - margin: 0px 0px 1rem 0.5rem; - transition: all 0.2s ease-in-out 0s; + position: relative; + display: flex; + -webkit-box-align: center; + align-items: center; + margin: 0px 0px 1rem 0.5rem; + transition: all 0.2s ease-in-out 0s; } .article-sort-item:hover::before { - border-color: rgb(255, 114, 66); + border-color: rgb(255, 114, 66); } .article-sort-item::before { - position: absolute; - left: calc(-1rem - 17px); - width: 0.3rem; - height: 0.3rem; - border: 0.15rem solid rgb(48, 122, 246); - border-radius: 0.3rem; - background: var(--card-bg); - content: ""; - transition: all 0.2s ease-in-out 0s; + position: absolute; + left: calc(-1rem - 17px); + width: 0.3rem; + height: 0.3rem; + border: 0.15rem solid rgb(48, 122, 246); + border-radius: 0.3rem; + background: var(--card-bg); + content: ""; + transition: all 0.2s ease-in-out 0s; } .article-sort-item.no-article-cover { - height: 80px; + height: 80px; } .article-sort-item.no-article-cover .article-sort-item-info { - padding: 0px; + padding: 0px; } .article-sort-item.year { - font-size: 1.43em; + font-size: 1.43em; } .article-sort-item.year:hover::before { - border-color: rgb(48, 122, 246); + border-color: rgb(48, 122, 246); } .article-sort-item.year::before { - border-color: rgb(255, 114, 66); + border-color: rgb(255, 114, 66); } .article-sort-item-time { - color: rgb(133, 133, 133); - font-size: 95%; + color: rgb(133, 133, 133); + font-size: 95%; } .article-sort-item-time time { - padding-left: 0.3rem; - cursor: default; + padding-left: 0.3rem; + cursor: default; } .article-sort-item-title { - color: var(--heo-fontcolor); - font-size: 1.1em; - transition: all 0.3s ease 0s; - -webkit-line-clamp: 2; + color: var(--heo-fontcolor); + font-size: 1.1em; + transition: all 0.3s ease 0s; + -webkit-line-clamp: 2; } .article-sort-item-img { - overflow: hidden; - width: 80px; - height: 80px; + overflow: hidden; + width: 80px; + height: 80px; } .article-sort-item-img img { - width: 100%; - height: 100%; - transition: all 0.6s ease 0s; - object-fit: cover; + width: 100%; + height: 100%; + transition: all 0.6s ease 0s; + object-fit: cover; } .article-sort-item-img img:hover { - transform: scale(1.1); + transform: scale(1.1); } .article-sort-item-info { - -webkit-box-flex: 1; - flex: 1 1 0%; - padding: 0px 0.8rem; + -webkit-box-flex: 1; + flex: 1 1 0%; + padding: 0px 0.8rem; } #page .category-lists { - padding: 1rem 0px 1.5rem; + padding: 1rem 0px 1.5rem; } @media screen and (max-width: 768px) { - #page .category-lists { - padding: 0px; - } + #page .category-lists { + padding: 0px; + } } #page .category-lists .category-title { - font-size: 2.57em; + font-size: 2.57em; } @media screen and (max-width: 768px) { - #page .category-lists .category-title { - font-size: 2em; - } + #page .category-lists .category-title { + font-size: 2em; + } } #page .category-lists .category-list a { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } #page .category-lists .category-list a:hover { - color: rgb(48, 122, 246); + color: rgb(48, 122, 246); } #page .category-lists .category-list .category-list-count { - margin-left: 0.4rem; - color: rgb(133, 133, 133); + margin-left: 0.4rem; + color: rgb(133, 133, 133); } #page .category-lists .category-list .category-list-count::before { - content: "("; + content: "("; } #page .category-lists .category-list .category-list-count::after { - content: ")"; + content: ")"; } #page .category-lists ul { - margin-top: 0.4rem; - padding: 0px 0px 0px 1rem; - list-style: none; - counter-reset: li 0; + margin-top: 0.4rem; + padding: 0px 0px 0px 1rem; + list-style: none; + counter-reset: li 0; } #page .category-lists ul ul { - padding-left: 0.2rem; + padding-left: 0.2rem; } #page .category-lists ul li { - position: relative; - margin: 0.3rem 0px; - padding: 0.12em 0.4em 0.12em 1.4em; + position: relative; + margin: 0.3rem 0px; + padding: 0.12em 0.4em 0.12em 1.4em; } #page .category-lists ul li::before { - position: absolute; - left: 0px; - cursor: pointer; - transition: all 0.3s ease-out 0s; - top: 0.7em; - width: 0.43em; - height: 0.43em; - border: 0.215em solid rgb(48, 122, 246); - border-radius: 0.43em; - background: 0px 0px; - content: ""; + position: absolute; + left: 0px; + cursor: pointer; + transition: all 0.3s ease-out 0s; + top: 0.7em; + width: 0.43em; + height: 0.43em; + border: 0.215em solid rgb(48, 122, 246); + border-radius: 0.43em; + background: 0px 0px; + content: ""; } #page .category-lists ul li:hover::before { - border-color: rgb(255, 114, 66); + border-color: rgb(255, 114, 66); } @media screen and (max-width: 768px) { - ._3f01c8f5a4546beb05aa576fb01cb512_banner { - display: none; - } + ._3f01c8f5a4546beb05aa576fb01cb512_banner { + display: none; + } } @media screen and (min-width: 770px) { - ._3f01c8f5a4546beb05aa576fb01cb512_banner { - --image: none; - --bg-color: transparent; - --close-color: #666; - height: 60px; - background-image: var(--image); - background-color: var(--bg-color); - background-repeat: no-repeat; - background-position: center center; - background-size: auto 100% - } + ._3f01c8f5a4546beb05aa576fb01cb512_banner { + --image: none; + --bg-color: transparent; + --close-color: #666; + height: 60px; + background-image: var(--image); + background-color: var(--bg-color); + background-repeat: no-repeat; + background-position: center center; + background-size: auto 100% + } - ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_link { - display: block; - width: 100%; - height: 100%; - cursor: pointer - } + ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_link { + display: block; + width: 100%; + height: 100%; + cursor: pointer + } - ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_link img{ - display: flex; - height: 60px; - } + ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_link img { + display: flex; + height: 60px; + } - ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_close { - position: absolute; - top: 10px; - right: 12px; - width: 40px; - height: 40px; - cursor: pointer - } + ._3f01c8f5a4546beb05aa576fb01cb512_banner ._3f01c8f5a4546beb05aa576fb01cb512_close { + position: absolute; + top: 10px; + right: 12px; + width: 40px; + height: 40px; + cursor: pointer + } } .layout { - display: flex; - margin: 0px auto; - padding: 2rem 15px; - max-width: 1200px; + display: flex; + margin: 0px auto; + padding: 2rem 15px; + max-width: 1200px; } @media screen and (max-width: 900px) { - .layout { - -webkit-box-orient: vertical; - flex-direction: column; - } + .layout { + -webkit-box-orient: vertical; + flex-direction: column; + } } @media screen and (max-width: 768px) { - .layout { - padding: 1rem 5px; - } + .layout { + padding: 1rem 5px; + } } @media screen and (min-width: 2000px) { - .layout { - max-width: 1500px; - } + .layout { + max-width: 1500px; + } } @media screen and (max-width: 768px) { - .layout > div:first-child:not(.recent-posts) { - padding: 1.8rem 0.7rem !important; - } + .layout>div:first-child:not(.recent-posts) { + padding: 1.8rem 0.7rem !important; + } } -.layout > div:first-child { - width: 75%; - transition: all 0.3s ease 0s; +.layout>div:first-child { + width: 75%; + transition: all 0.3s ease 0s; } @media screen and (max-width: 1200px) { - .layout > div:first-child { - width: 100% !important - } + .layout>div:first-child { + width: 100% !important + } } .layout.hide-aside { - max-width: 1000px; + max-width: 1000px; } @media screen and (min-width: 2000px) { - .layout.hide-aside { - max-width: 1300px; - } + .layout.hide-aside { + max-width: 1300px; + } } -.layout.hide-aside > div { - width: 100% !important; +.layout.hide-aside>div { + width: 100% !important; } .flink#article-container .flink-desc { - margin: 0.2rem 0px 0.5rem; + margin: 0.2rem 0px 0.5rem; } .flink#article-container .flink-list { - overflow: auto; - padding: 10px 10px 0px; - text-align: center; + overflow: auto; + padding: 10px 10px 0px; + text-align: center; } -.flink#article-container .flink-list > .flink-list-item { - position: relative; - float: left; - overflow: hidden; - margin: 15px 7px; - width: calc(25% - 12px); - height: 90px; - border-radius: 5px; - line-height: 17px; - transform: translateZ(0px); - transition: all 0.3s ease 0s; +.flink#article-container .flink-list>.flink-list-item { + position: relative; + float: left; + overflow: hidden; + margin: 15px 7px; + width: calc(25% - 12px); + height: 90px; + border-radius: 5px; + line-height: 17px; + transform: translateZ(0px); + transition: all 0.3s ease 0s; } -.flink#article-container .flink-list.mini > .flink-list-item { - height: 60px; +.flink#article-container .flink-list.mini>.flink-list-item { + height: 60px; } @media screen and (max-width: 1200px) { - .flink#article-container .flink-list > .flink-list-item { - width: calc(25% - 12px) !important; - } + .flink#article-container .flink-list>.flink-list-item { + width: calc(25% - 12px) !important; + } } @media screen and (max-width: 1024px) { - .flink#article-container .flink-list > .flink-list-item { - width: calc(33.3333% - 12px) !important; - } + .flink#article-container .flink-list>.flink-list-item { + width: calc(33.3333% - 12px) !important; + } } @media screen and (max-width: 768px) { - .flink#article-container .flink-list > .flink-list-item { - width: calc(50% - 12px) !important; - } + .flink#article-container .flink-list>.flink-list-item { + width: calc(50% - 12px) !important; + } } @media screen and (max-width: 600px) { - .flink#article-container .flink-list > .flink-list-item { - width: calc(100% - 12px) !important; - } + .flink#article-container .flink-list>.flink-list-item { + width: calc(100% - 12px) !important; + } } -.flink#article-container .flink-list > .flink-list-item:hover { - background: rgb(0, 108, 242); - transform: scale(1.05); +.flink#article-container .flink-list>.flink-list-item:hover { + background: rgb(0, 108, 242); + transform: scale(1.05); } -.flink#article-container .flink-list > .flink-list-item a { - color: var(--heo-fontcolor); - text-decoration: none; +.flink#article-container .flink-list>.flink-list-item a { + color: var(--heo-fontcolor); + text-decoration: none; } -.flink#article-container .flink-list > .flink-list-item a img { - float: left; - margin: 15px 10px; - width: 60px; - height: 60px; - border-radius: 35px; - transition: all 0.3s ease 0s; +.flink#article-container .flink-list>.flink-list-item a img { + float: left; + margin: 15px 10px; + width: 60px; + height: 60px; + border-radius: 35px; + transition: all 0.3s ease 0s; } -.flink#article-container .flink-list.mini > .flink-list-item a img { - width: 30px; - height: 30px; - min-width: 30px; - min-height: 30px; +.flink#article-container .flink-list.mini>.flink-list-item a img { + width: 30px; + height: 30px; + min-width: 30px; + min-height: 30px; } -.flink#article-container .flink-list > .flink-list-item a .img-alt { - display: none; +.flink#article-container .flink-list>.flink-list-item a .img-alt { + display: none; } -.flink#article-container .flink-list > .flink-list-item a .flink-item-name { - display: block; - padding: 0px 10px 0px 0px; - font-weight: 700; - font-size: 1.43em; - max-width: calc(100% - 12px); - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; +.flink#article-container .flink-list>.flink-list-item a .flink-item-name { + display: block; + padding: 0px 10px 0px 0px; + font-weight: 700; + font-size: 1.43em; + max-width: calc(100% - 12px); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } -.flink#article-container .flink-list > .flink-list-item a .flink-item-desc { - display: block; - padding: 4px 10px 0px 0px; - height: 50px; - font-size: 0.93em; +.flink#article-container .flink-list>.flink-list-item a .flink-item-desc { + display: block; + padding: 4px 10px 0px 0px; + height: 50px; + font-size: 0.93em; } -.flink#article-container .flink-list.mini > .flink-list-item a .flink-item-desc { - display: none; +.flink#article-container .flink-list.mini>.flink-list-item a .flink-item-desc { + display: none; } .flink#article-container .site-card-group { - display: flex; - flex-wrap: wrap; - -webkit-box-pack: start; - justify-content: flex-start; - margin: -8px; - -webkit-box-align: stretch; - align-items: stretch; + display: flex; + flex-wrap: wrap; + -webkit-box-pack: start; + justify-content: flex-start; + margin: -8px; + -webkit-box-align: stretch; + align-items: stretch; } .flink#article-container .site-card { - margin: 8px; - width: calc(20% - 16px); - display: block; - line-height: 1.4; - height: 100%; + margin: 8px; + width: calc(20% - 16px); + display: block; + line-height: 1.4; + height: 100%; } @media screen and (max-width: 1200px) { - .flink#article-container .site-card { - width: calc(20% - 16px) !important; - } + .flink#article-container .site-card { + width: calc(20% - 16px) !important; + } } @media screen and (max-width: 1024px) { - .flink#article-container .site-card { - width: calc(25% - 16px) !important; - } + .flink#article-container .site-card { + width: calc(25% - 16px) !important; + } } @media screen and (max-width: 768px) { - .flink#article-container .site-card { - width: calc(33.3333% - 16px) !important; - } + .flink#article-container .site-card { + width: calc(33.3333% - 16px) !important; + } } @media screen and (max-width: 600px) { - .flink#article-container .site-card { - width: calc(50% - 16px) !important; - } + .flink#article-container .site-card { + width: calc(50% - 16px) !important; + } } .flink#article-container .site-card .img { - width: 100%; - height: 120px; - overflow: hidden; - border-radius: 12px 12px 0 0; - background: #f6f6f6 + width: 100%; + height: 120px; + overflow: hidden; + border-radius: 12px 12px 0 0; + background: #f6f6f6 } @media screen and (max-width: 500px) { - .flink#article-container .site-card .img { - height: 100px; - } + .flink#article-container .site-card .img { + height: 100px; + } } .flink#article-container .site-card .img img { - width: 100%; - height: 100%; - transition: transform 2s ease 0s; - object-fit: cover; + width: 100%; + height: 100%; + transition: transform 2s ease 0s; + object-fit: cover; } .flink#article-container .site-card .info { - margin-top: 8px; + margin-top: 8px; } .flink#article-container .site-card .info img { - width: 32px; - height: 32px; - border-radius: 16px; - float: left; - margin-right: 8px; - margin-top: 2px; + width: 32px; + height: 32px; + border-radius: 16px; + float: left; + margin-right: 8px; + margin-top: 2px; } .flink#article-container .site-card .info span { - display: block; + display: block; } .flink#article-container .site-card .info .title { - font-weight: 600; - color: rgb(68, 68, 68); - display: -webkit-box; - -webkit-box-orient: vertical; - overflow: hidden; - -webkit-line-clamp: 1; - transition: all 0.3s ease 0s; + font-weight: 600; + color: rgb(68, 68, 68); + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; + transition: all 0.3s ease 0s; } .flink#article-container .site-card .info .desc { - overflow-wrap: break-word; - line-height: 1.2; - color: rgb(136, 136, 136); - display: -webkit-box; - -webkit-box-orient: vertical; - overflow: hidden; - -webkit-line-clamp: 2; + overflow-wrap: break-word; + line-height: 1.2; + color: rgb(136, 136, 136); + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; } .flink#article-container .site-card .img { - transition: all 0.3s ease 0s; + transition: all 0.3s ease 0s; } .flink#article-container .site-card .img-alt { - display: none; + display: none; } .flink#article-container .site-card:hover .info .title { - color: rgb(255, 87, 34); + color: rgb(255, 87, 34); } -#recent-posts > .recent-post-item { - display: flex; - -webkit-box-orient: horizontal; - flex-direction: row; - -webkit-box-align: center; - align-items: center; - height: 15.5em; - border-radius: 12px 8px 8px 12px; - background: var(--card-bg); - box-shadow: var(--card-box-shadow); - transition: all 0.3s ease 0s; +#recent-posts>.recent-post-item { + display: flex; + -webkit-box-orient: horizontal; + flex-direction: row; + -webkit-box-align: center; + align-items: center; + height: 15.5em; + border-radius: 12px 8px 8px 12px; + background: var(--card-bg); + box-shadow: var(--card-box-shadow); + transition: all 0.3s ease 0s; } @media screen and (max-width: 768px) { - #recent-posts > .recent-post-item { - border-radius: 12px 12px 8px 8px; - } + #recent-posts>.recent-post-item { + border-radius: 12px 12px 8px 8px; + } } -#recent-posts > .recent-post-item:hover { - box-shadow: var(--card-hover-box-shadow); +#recent-posts>.recent-post-item:hover { + box-shadow: var(--card-hover-box-shadow); } -#recent-posts > .recent-post-item:hover img.post_bg { - transform: scale(1.1); +#recent-posts>.recent-post-item:hover img.post_bg { + transform: scale(1.1); } -#recent-posts > .recent-post-item.ads-wrap { - display: block !important; - height: auto !important; +#recent-posts>.recent-post-item.ads-wrap { + display: block !important; + height: auto !important; } -#recent-posts > .recent-post-item .post_cover { - overflow: hidden; - width: 45%; - height: 100%; - -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); +#recent-posts>.recent-post-item .post_cover { + overflow: hidden; + width: 45%; + height: 100%; + -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); } -#recent-posts > .recent-post-item .post_cover img.post_bg { - width: 100%; - height: 100%; - transition: all 0.6s ease 0s; - object-fit: cover; +#recent-posts>.recent-post-item .post_cover img.post_bg { + width: 100%; + height: 100%; + transition: all 0.6s ease 0s; + object-fit: cover; } @media screen and (min-width: 1300px) { - #recent-posts > .recent-post-item.col1.alternate .left_radius, #recent-posts > .recent-post-item.col1.alternate .right_radius { - width: 75%; - display: flex; - height: 220px - } + + #recent-posts>.recent-post-item.col1.alternate .left_radius, + #recent-posts>.recent-post-item.col1.alternate .right_radius { + width: 75%; + display: flex; + height: 220px + } } -#recent-posts > .recent-post-item .post_cover img.post_bg:hover { - transform: scale(1.1); +#recent-posts>.recent-post-item .post_cover img.post_bg:hover { + transform: scale(1.1); } -#recent-posts > .recent-post-item > .recent-post-info { - display: inline-block; - overflow: hidden; - padding: 0px 40px; - width: 55%; +#recent-posts>.recent-post-item>.recent-post-info { + display: inline-block; + overflow: hidden; + padding: 0px 40px; + width: 55%; } -#recent-posts > .recent-post-item > .recent-post-info.no-cover { - width: 100%; +#recent-posts>.recent-post-item>.recent-post-info.no-cover { + width: 100%; } -#recent-posts > .recent-post-item > .recent-post-info > .article-title { - margin-bottom: 0.3rem; - color: var(--text-highlight-color); - font-size: 1.4em; - line-height: 1.4; - transition: all 0.2s ease-in-out 0s; - -webkit-line-clamp: 2; +#recent-posts>.recent-post-item>.recent-post-info>.article-title { + margin-bottom: 0.3rem; + color: var(--text-highlight-color); + font-size: 1.4em; + line-height: 1.4; + transition: all 0.2s ease-in-out 0s; + -webkit-line-clamp: 2; } -#recent-posts > .recent-post-item > .recent-post-info > .article-title:hover { - color: rgb(48, 122, 246); +#recent-posts>.recent-post-item>.recent-post-info>.article-title:hover { + color: rgb(48, 122, 246); } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap { - color: var(--heo-fontcolor); - font-size: .7rem; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap { + color: var(--heo-fontcolor); + font-size: .7rem; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap > .post-meta-date { - cursor: default; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap>.post-meta-date { + cursor: default; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .sticky { - color: rgb(255, 114, 66); +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .sticky { + color: rgb(255, 114, 66); } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap i { - margin: 0px 0.2rem 0px 0px; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap i { + margin: 0px 0.2rem 0px 0px; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .article-meta-label { - padding-right: 0.2rem; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .article-meta-label { + padding-right: 0.2rem; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .article-meta__separator { - margin: 0px 0.3rem; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .article-meta__separator { + margin: 0px 0.3rem; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .article-meta__link { - margin: 0px 0.2rem; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .article-meta__link { + margin: 0px 0.2rem; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .fa-angle-right { - margin: 0px 0.2rem; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .fa-angle-right { + margin: 0px 0.2rem; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap time { - display: none; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap time { + display: none; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap a { - color: rgb(133, 133, 133); +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap a { + color: rgb(133, 133, 133); } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap a:hover { - color: rgb(48, 122, 246); - cursor: pointer; - border-radius: 4px; - background-color: rgba(59, 130, 255, 0.25); +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap a:hover { + color: rgb(48, 122, 246); + cursor: pointer; + border-radius: 4px; + background-color: rgba(59, 130, 255, 0.25); } -#recent-posts > .recent-post-item > .recent-post-info > .content { - margin-top: 0.3rem; - -webkit-line-clamp: 3; +#recent-posts>.recent-post-item>.recent-post-info>.content { + margin-top: 0.3rem; + -webkit-line-clamp: 3; } @media screen and (max-width: 768px) { - #recent-posts .recent-post-item { - -webkit-box-orient: vertical; - flex-direction: column; - height: auto !important; - } + #recent-posts .recent-post-item { + -webkit-box-orient: vertical; + flex-direction: column; + height: auto !important; + } - #recent-posts .recent-post-item .post_cover { - width: 100%; - height: 230px; - border-radius: 5px 8px 0px 0px; - -webkit-box-ordinal-group: 1 !important; - order: 1 !important; - } + #recent-posts .recent-post-item .post_cover { + width: 100%; + height: 230px; + border-radius: 5px 8px 0px 0px; + -webkit-box-ordinal-group: 1 !important; + order: 1 !important; + } - #recent-posts .recent-post-item .recent-post-info { - padding: 1rem 1rem 1.5rem; - width: 100%; - -webkit-box-ordinal-group: 2 !important; - order: 2 !important; - } + #recent-posts .recent-post-item .recent-post-info { + padding: 1rem 1rem 1.5rem; + width: 100%; + -webkit-box-ordinal-group: 2 !important; + order: 2 !important; + } - #recent-posts .recent-post-item .recent-post-info.no-cover { - padding: 1.5rem 1rem; - } + #recent-posts .recent-post-item .recent-post-info.no-cover { + padding: 1.5rem 1rem; + } - #recent-posts .recent-post-item .recent-post-info .article-title { - font-size: 1.43em; - } + #recent-posts .recent-post-item .recent-post-info .article-title { + font-size: 1.43em; + } - #recent-posts .recent-post-item .recent-post-info .content { - height: auto; - } + #recent-posts .recent-post-item .recent-post-info .content { + height: auto; + } } .tag-cloud-list a { - display: inline-block; - padding: 0px 0.4rem; - transition: all 0.3s ease 0s; + display: inline-block; + padding: 0px 0.4rem; + transition: all 0.3s ease 0s; } .tag-cloud-list a:hover { - transform: scale(1.1); - color: rgb(48, 122, 246) !important; + transform: scale(1.1); + color: rgb(48, 122, 246) !important; } @media screen and (max-width: 768px) { - .tag-cloud-list a { - zoom: 0.85; - } + .tag-cloud-list a { + zoom: 0.85; + } } .tag-cloud-title { - font-size: 2.57em; + font-size: 2.57em; } @media screen and (max-width: 768px) { - .tag-cloud-title { - font-size: 2em; - } + .tag-cloud-title { + font-size: 2em; + } } #error-wrap { - display: flex; - justify-content: center; - margin: 0 1rem; - width: 100%; - position: relative; + display: flex; + justify-content: center; + margin: 0 1rem; + width: 100%; + position: relative; } #error-wrap .error-content { - display: flex; - -webkit-box-orient: horizontal; - flex-direction: row; - -webkit-box-pack: center; - justify-content: center; - -webkit-box-align: center; - align-items: center; - margin: 0px 1rem; - height: 18rem; - max-width: 800px; - border-radius: 5px; - background: var(--heo-card-bg); - box-shadow: var(--card-box-shadow); - transition: all 0.3s ease 0s; - border: var(--style-border-always); - position: relative; - width: 100%; + display: flex; + -webkit-box-orient: horizontal; + flex-direction: row; + -webkit-box-pack: center; + justify-content: center; + -webkit-box-align: center; + align-items: center; + margin: 0px 1rem; + height: 18rem; + max-width: 800px; + border-radius: 5px; + background: var(--heo-card-bg); + box-shadow: var(--card-box-shadow); + transition: all 0.3s ease 0s; + border: var(--style-border-always); + position: relative; + width: 100%; } #error-wrap .error-content:hover { - box-shadow: var(--card-hover-box-shadow); + box-shadow: var(--card-hover-box-shadow); } @media screen and (max-width: 768px) { - #error-wrap .error-content { - -webkit-box-orient: vertical; - flex-direction: column; - margin: 0px; - height: 25rem; - width: 100%; - } + #error-wrap .error-content { + -webkit-box-orient: vertical; + flex-direction: column; + margin: 0px; + height: 25rem; + width: 100%; + } } #error-wrap .error-content .error-img { - -webkit-box-flex: 1; - flex: 1 1 0%; - height: 90%; - width: 600px; - border-top-left-radius: 8px; - border-bottom-left-radius: 8px; - background-color: rgb(48, 122, 246); - background-position: center center; - background-size: cover; - margin-left: 1rem; - border-radius: 2rem; + -webkit-box-flex: 1; + flex: 1 1 0%; + height: 90%; + width: 600px; + border-top-left-radius: 8px; + border-bottom-left-radius: 8px; + background-color: rgb(48, 122, 246); + background-position: center center; + background-size: cover; + margin-left: 1rem; + border-radius: 2rem; } @media screen and (max-width: 768px) { - #error-wrap .error-content .error-img { - -webkit-box-flex: 1; - flex: 1 1 0%; - width: 100%; - border-radius: 12px; - } + #error-wrap .error-content .error-img { + -webkit-box-flex: 1; + flex: 1 1 0%; + width: 100%; + border-radius: 12px; + } } #error-wrap .error-content .error-info { - -webkit-box-flex: 1; - flex: 1 1 0%; - padding: 0.5rem; - text-align: center; - font-size: 14px; - font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; + -webkit-box-flex: 1; + flex: 1 1 0%; + padding: 0.5rem; + text-align: center; + font-size: 14px; + font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; } #error-wrap .error-content .error-info .error_title { - font-size: 9em; - line-height: 1; + font-size: 9em; + line-height: 1; } @media screen and (max-width: 768px) { - #error-wrap .error-content .error-info { - -webkit-box-flex: 1.1; - flex: 1.1 1 0%; - width: 100%; - padding-bottom: 2rem; - } + #error-wrap .error-content .error-info { + -webkit-box-flex: 1.1; + flex: 1.1 1 0%; + width: 100%; + padding-bottom: 2rem; + } - #error-wrap .error-content .error-info .error_title { - font-size: 4rem; - } + #error-wrap .error-content .error-info .error_title { + font-size: 4rem; + } } #error-wrap .error-content .error-info .error_subtitle { - word-break: break-word; - font-size: 1.6em; - -webkit-line-clamp: 2; + word-break: break-word; + font-size: 1.6em; + -webkit-line-clamp: 2; } #error-wrap .error-content .error-info a { - display: inline-block; - margin-top: 0.5rem; - padding: 0.3rem 1.5rem; - background: var(--btn-bg); - color: var(--btn-color); + display: inline-block; + margin-top: 0.5rem; + padding: 0.3rem 1.5rem; + background: var(--btn-bg); + color: var(--btn-color); } #error-wrap .error-content .error-info a i { - padding-right: 0.3rem; + padding-right: 0.3rem; } @media screen and (min-width: 900px) { - #aside-content { - padding-left: 15px; - } + #aside-content { + padding-left: 15px; + } } @media screen and (max-width: 900px) { - #aside-content { - width: 100%; - } + #aside-content { + width: 100%; + } } @media screen and (max-width: 900px) { - #aside-content > .card-widget:first-child { - margin-top: 1rem; - } + #aside-content>.card-widget:first-child { + margin-top: 1rem; + } } @media screen and (max-width: 768px) { - #aside-content .card-widget:not(#card-toc) { - display: none; - } + #aside-content .card-widget:not(#card-toc) { + display: none; + } - #aside-content .item-headline-music:not(#card-toc), - #aside-content .item-headline-steam:not(#card-toc) { - display: none; - } + #aside-content .item-headline-music:not(#card-toc), + #aside-content .item-headline-steam:not(#card-toc) { + display: none; + } } .author-info__top-group { - display: flex; - height: 28px; + display: flex; + height: 28px; } #aside-content .card-info .author-info__description { - margin-top: -0.3rem; + margin-top: -0.3rem; } #aside-content .card-info .card-info-data { - display: table; - margin: 0.7rem 0px 0.2rem; - width: 100%; - table-layout: fixed; + display: table; + margin: 0.7rem 0px 0.2rem; + width: 100%; + table-layout: fixed; } -#aside-content .card-info .card-info-data > .card-info-data-item { - display: table-cell; +#aside-content .card-info .card-info-data>.card-info-data-item { + display: table-cell; } -#aside-content .card-info .card-info-data > .card-info-data-item:hover { - background: rgb(0, 0, 0); - border-radius: 5px; +#aside-content .card-info .card-info-data>.card-info-data-item:hover { + background: rgb(0, 0, 0); + border-radius: 5px; } -#aside-content .card-info .card-info-data > .card-info-data-item a .headline { - color: var(--heo-fontcolor); - font-size: 1em; +#aside-content .card-info .card-info-data>.card-info-data-item a .headline { + color: var(--heo-fontcolor); + font-size: 1em; } -#aside-content .card-info .card-info-data > .card-info-data-item a .length-num { - margin-top: -0.3rem; - color: var(--text-highlight-color); - font-size: 1.4em; +#aside-content .card-info .card-info-data>.card-info-data-item a .length-num { + margin-top: -0.3rem; + color: var(--text-highlight-color); + font-size: 1.4em; } #aside-content .card-info .card-info-social-icons { - margin: 0.3rem 0px -0.3rem; + margin: 0.3rem 0px -0.3rem; } #aside-content .card-info .card-info-social-icons .social-icon { - margin: 0px 0.5rem; - color: var(--heo-fontcolor); - font-size: 1.4em; - cursor: pointer; + margin: 0px 0.5rem; + color: var(--heo-fontcolor); + font-size: 1.4em; + cursor: pointer; } #aside-content .card-info .card-info-social-icons i { - transition: all 0.3s ease 0s; - padding: 8px; - border-radius: 32px; + transition: all 0.3s ease 0s; + padding: 8px; + border-radius: 32px; } #aside-content .card-info .card-info-social-icons i:hover { - transform: rotate(540deg); - background-color: rgb(0, 0, 0); - cursor: pointer; + transform: rotate(540deg); + background-color: rgb(0, 0, 0); + cursor: pointer; } #aside-content .card-info #card-info-btn { - display: block; - margin-top: 0.7rem; - background-color: var(--btn-bg); - color: var(--btn-color); - text-align: center; - line-height: 2.4; + display: block; + margin-top: 0.7rem; + background-color: var(--btn-bg); + color: var(--btn-color); + text-align: center; + line-height: 2.4; } #aside-content .card-info #card-info-btn span { - padding-left: 0.5rem; + padding-left: 0.5rem; } @media screen and (min-width: 900px) { - #aside-content .sticky_layout { - position: sticky; - top: 20px; - transition: top 0.3s ease 0s; - } + #aside-content .sticky_layout { + position: sticky; + top: 20px; + transition: top 0.3s ease 0s; + } } #aside-content .card-tag-cloud a { - display: inline-block; - padding: 0px 0.3rem; + display: inline-block; + padding: 0px 0.3rem; } #aside-content .card-tag-cloud a:hover { - background-color: rgb(255, 255, 255); - cursor: pointer; - border-radius: 5px; - color: rgb(48, 122, 246) !important; + background-color: rgb(255, 255, 255); + cursor: pointer; + border-radius: 5px; + color: rgb(48, 122, 246) !important; } -#aside-content .aside-list > span { - display: block; - margin-bottom: 0.5rem; - text-align: center; +#aside-content .aside-list>span { + display: block; + margin-bottom: 0.5rem; + text-align: center; } -#aside-content .aside-list > .aside-list-item { - display: flex; - -webkit-box-align: center; - align-items: center; - padding: 0.3rem 0px; +#aside-content .aside-list>.aside-list-item { + display: flex; + -webkit-box-align: center; + align-items: center; + padding: 0.3rem 0px; } -#aside-content .aside-list > .aside-list-item:first-child { - padding-top: 0px; +#aside-content .aside-list>.aside-list-item:first-child { + padding-top: 0px; } -#aside-content .aside-list > .aside-list-item:not(:last-child) { - border-bottom: 1px dashed rgb(245, 245, 245); +#aside-content .aside-list>.aside-list-item:not(:last-child) { + border-bottom: 1px dashed rgb(245, 245, 245); } -#aside-content .aside-list > .aside-list-item:last-child { - padding-bottom: 0px; +#aside-content .aside-list>.aside-list-item:last-child { + padding-bottom: 0px; } -#aside-content .aside-list > .aside-list-item .thumbnail { - overflow: hidden; - width: 4.2em; - height: 4.2em; +#aside-content .aside-list>.aside-list-item .thumbnail { + overflow: hidden; + width: 4.2em; + height: 4.2em; } -#aside-content .aside-list > .aside-list-item .thumbnail > img { - width: 100%; - height: 100%; - transition: all 0.6s ease 0s; - object-fit: cover; +#aside-content .aside-list>.aside-list-item .thumbnail>img { + width: 100%; + height: 100%; + transition: all 0.6s ease 0s; + object-fit: cover; } -#aside-content .aside-list > .aside-list-item .thumbnail > img:hover { - transform: scale(1.1); +#aside-content .aside-list>.aside-list-item .thumbnail>img:hover { + transform: scale(1.1); } -#aside-content .aside-list > .aside-list-item .content { - -webkit-box-flex: 1; - flex: 1 1 0%; - padding-left: 10px; - word-break: break-all; - display: flex; - flex-direction: column; +#aside-content .aside-list>.aside-list-item .content { + -webkit-box-flex: 1; + flex: 1 1 0%; + padding-left: 10px; + word-break: break-all; + display: flex; + flex-direction: column; } -#aside-content .aside-list > .aside-list-item .content > .name { - -webkit-line-clamp: 1; +#aside-content .aside-list>.aside-list-item .content>.name { + -webkit-line-clamp: 1; } -#aside-content .aside-list > .aside-list-item .content > .name, -#aside-content .aside-list > .aside-list-item .content > time { - display: block; - color: rgb(133, 133, 133); - font-size: 85%; +#aside-content .aside-list>.aside-list-item .content>.name, +#aside-content .aside-list>.aside-list-item .content>time { + display: block; + color: rgb(133, 133, 133); + font-size: 85%; } -#aside-content .aside-list > .aside-list-item .content > .comment, -#aside-content .aside-list > .aside-list-item .content > .title { - color: var(--heo-fontcolor); - font-size: 95%; - line-height: 1.4; - -webkit-line-clamp: 2; +#aside-content .aside-list>.aside-list-item .content>.comment, +#aside-content .aside-list>.aside-list-item .content>.title { + color: var(--heo-fontcolor); + font-size: 95%; + line-height: 1.4; + -webkit-line-clamp: 2; } -#aside-content .aside-list > .aside-list-item .content > .comment:hover, -#aside-content .aside-list > .aside-list-item .content > .title:hover { - color: rgb(48, 122, 246); +#aside-content .aside-list>.aside-list-item .content>.comment:hover, +#aside-content .aside-list>.aside-list-item .content>.title:hover { + color: rgb(48, 122, 246); } -#aside-content .aside-list > .aside-list-item.no-cover { - min-height: 4.4em; +#aside-content .aside-list>.aside-list-item.no-cover { + min-height: 4.4em; } #aside-content .card-archives ul.card-archive-list, #aside-content .card-categories ul.card-category-list { - margin: 0px; - padding: 0px; - list-style: none; + margin: 0px; + padding: 0px; + list-style: none; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a { - display: inline-block; - padding: 0.15rem 0.5rem; - width: 100%; - color: var(--heo-fontcolor); - transition: all 0.4s ease 0s; - border-radius: 5px; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a { + display: inline-block; + padding: 0.15rem 0.5rem; + width: 100%; + color: var(--heo-fontcolor); + transition: all 0.4s ease 0s; + border-radius: 5px; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a:hover, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a:hover { - padding: 0.15rem 0.85rem; - background-color: rgb(255, 255, 255); - color: rgb(66, 123, 238); - border-radius: 5px; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a:hover, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a:hover { + padding: 0.15rem 0.85rem; + background-color: rgb(255, 255, 255); + color: rgb(66, 123, 238); + border-radius: 5px; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span { - display: inline-block; - vertical-align: bottom; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span { + display: inline-block; + vertical-align: bottom; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span:first-child, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span:first-child { - width: 80%; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span:first-child, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span:first-child { + width: 80%; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span:last-child, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span:last-child { - width: 20%; - text-align: right; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span:last-child, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span:last-child { + width: 20%; + text-align: right; } #aside-content .card-categories .card-category-list.child { - padding: 0px 0px 0px 0.8rem; + padding: 0px 0px 0px 0.8rem; } -#aside-content .card-categories .card-category-list > .parent > a .card-category-list-name { - width: 70% !important; +#aside-content .card-categories .card-category-list>.parent>a .card-category-list-name { + width: 70% !important; } -#aside-content .card-categories .card-category-list > .parent > a .card-category-list-count { - width: calc(30% - 20px); - text-align: right; +#aside-content .card-categories .card-category-list>.parent>a .card-category-list-count { + width: calc(30% - 20px); + text-align: right; } -#aside-content .card-categories .card-category-list > .parent i { - float: right; - margin-right: -0.35rem; - padding: 0.35rem; - transition: transform 0.3s ease 0s; - transform: rotate(0deg); +#aside-content .card-categories .card-category-list>.parent i { + float: right; + margin-right: -0.35rem; + padding: 0.35rem; + transition: transform 0.3s ease 0s; + transform: rotate(0deg); } -#aside-content .card-categories .card-category-list > .parent i.expand { - transform: rotate(-90deg); +#aside-content .card-categories .card-category-list>.parent i.expand { + transform: rotate(-90deg); } #aside-content .card-webinfo .webinfo .webinfo-item { - display: flex; - -webkit-box-align: center; - align-items: center; - padding: 0.1rem 0.5rem 0px; + display: flex; + -webkit-box-align: center; + align-items: center; + padding: 0.1rem 0.5rem 0px; } #aside-content .card-webinfo .webinfo .webinfo-item div:first-child { - -webkit-box-flex: 1; - flex: 1 1 0%; - padding-right: 1rem; + -webkit-box-flex: 1; + flex: 1 1 0%; + padding-right: 1rem; } @media screen and (min-width: 901px) { - #aside-content #card-toc { - right: 0px !important; - } + #aside-content #card-toc { + right: 0px !important; + } } @media screen and (max-width: 1200px) { - #aside-content #card-toc { - position: fixed; - right: 55px; - bottom: 30px; - z-index: 100; - max-width: 380px; - max-height: calc(100% - 60px); - width: calc(100% - 80px); - -webkit-transition: -webkit-transform .3s; - -moz-transition: -moz-transform .3s; - -o-transition: -o-transform .3s; - -ms-transition: -ms-transform .3s; - transition: transform .3s; - -webkit-transform: scale(0); - -moz-transform: scale(0); - -o-transform: scale(0); - -ms-transform: scale(0); - transform: scale(0); - -webkit-transform-origin: right bottom; - -moz-transform-origin: right bottom; - -o-transform-origin: right bottom; - -ms-transform-origin: right bottom; - transform-origin: right bottom - } + #aside-content #card-toc { + position: fixed; + right: 55px; + bottom: 30px; + z-index: 100; + max-width: 380px; + max-height: calc(100% - 60px); + width: calc(100% - 80px); + -webkit-transition: -webkit-transform .3s; + -moz-transition: -moz-transform .3s; + -o-transition: -o-transform .3s; + -ms-transition: -ms-transform .3s; + transition: transform .3s; + -webkit-transform: scale(0); + -moz-transform: scale(0); + -o-transform: scale(0); + -ms-transform: scale(0); + transform: scale(0); + -webkit-transform-origin: right bottom; + -moz-transform-origin: right bottom; + -o-transform-origin: right bottom; + -ms-transform-origin: right bottom; + transform-origin: right bottom + } - #aside-content #card-toc.open { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1) - } + #aside-content #card-toc.open { + -webkit-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); + transform: scale(1) + } } /*@media screen and (max-width: 900px) {*/ @@ -2196,990 +2198,991 @@ blockquote footer cite::before { /*}*/ #aside-content #card-toc .toc-content { - position: relative; - overflow-y: auto; - max-height: calc(100vh - 300px); + position: relative; + overflow-y: auto; + max-height: calc(100vh - 300px); } @media screen and (max-width: 900px) { - #aside-content #card-toc .toc-content { - max-height: calc(100vh - 140px); - } + #aside-content #card-toc .toc-content { + max-height: calc(100vh - 140px); + } } #aside-content #card-toc .toc-content .toc-child { - display: none; + display: none; } @media screen and (max-width: 900px) { - #aside-content #card-toc .toc-content .toc-child { - display: block !important; - } + #aside-content #card-toc .toc-content .toc-child { + display: block !important; + } } #aside-content #card-toc .toc-content .toc-item.active .toc-child { - display: block; + display: block; } #aside-content #card-toc .toc-content li, #aside-content #card-toc .toc-content ol { - list-style: none; + list-style: none; } -#aside-content #card-toc .toc-content > ol { - padding: 0px !important; +#aside-content #card-toc .toc-content>ol { + padding: 0px !important; } #aside-content #card-toc .toc-content ol { - margin: 0px; - padding-left: 0.4rem; + margin: 0px; + padding-left: 0.4rem; } #aside-content #card-toc .toc-content .toc-link { - display: block; - padding-left: 0.3rem; - border-left: 3px solid transparent; - color: var(--toc-link-color); - transition: all 0.2s ease-in-out 0s; + display: block; + padding-left: 0.3rem; + border-left: 3px solid transparent; + color: var(--toc-link-color); + transition: all 0.2s ease-in-out 0s; } #aside-content #card-toc .toc-content .toc-link.active { - border-left-color: rgb(0, 97, 204); - background: rgb(0, 121, 255); - color: rgb(255, 255, 255); + border-left-color: rgb(0, 97, 204); + background: rgb(0, 121, 255); + color: rgb(255, 255, 255); } #aside-content #card-toc .toc-content::before { - position: absolute; - top: 0.6rem; - right: 1.2rem; - color: #a9a9a9; - content: attr(progress-percentage); - font-style: italic; - font-size: 1.2rem + position: absolute; + top: 0.6rem; + right: 1.2rem; + color: #a9a9a9; + content: attr(progress-percentage); + font-style: italic; + font-size: 1.2rem } -#aside-content :only-child > .card-widget { - margin-top: 1rem; +#aside-content :only-child>.card-widget { + margin-top: 1rem; } -#aside-content :only-child > :first-child { - margin-top: 0rem; +#aside-content :only-child> :first-child { + margin-top: 0rem; } #aside-content .card-more-btn { - float: right; - color: inherit; + float: right; + color: inherit; } #aside-content .card-more-btn:hover { - animation: 1s ease 0s infinite normal none running more-btn-move; + 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 { + -webkit-box-pack: center; + justify-content: center; + } - html.hide-aside .layout > .aside-content { - display: none; - } + html.hide-aside .layout>.aside-content { + display: none; + } - html.hide-aside .layout > div:first-child { - width: 100%; - } + html.hide-aside .layout>div:first-child { + width: 100%; + } } .page .sticky_layout { - display: flex; - -webkit-box-orient: vertical; - flex-direction: column; + display: flex; + -webkit-box-orient: vertical; + flex-direction: column; } @-webkit-keyframes more-btn-move { - 0%, - 100% { - transform: translateX(0px); - } + 0%, + 100% { + transform: translateX(0px); + } - 50% { - transform: translateX(3px); - } + 50% { + transform: translateX(3px); + } } @keyframes more-btn-move { - 0%, - 100% { - transform: translateX(0px); - } + 0%, + 100% { + transform: translateX(0px); + } - 50% { - transform: translateX(3px); - } + 50% { + transform: translateX(3px); + } } @-webkit-keyframes toc-open { - 0% { - transform: scale(0.7); - } + 0% { + transform: scale(0.7); + } - 100% { - transform: scale(1); - } + 100% { + transform: scale(1); + } } @keyframes toc-open { - 0% { - transform: scale(0.7); - } + 0% { + transform: scale(0.7); + } - 100% { - transform: scale(1); - } + 100% { + transform: scale(1); + } } @-webkit-keyframes toc-close { - 0% { - transform: scale(1); - } + 0% { + transform: scale(1); + } - 100% { - transform: scale(0.7); - } + 100% { + transform: scale(0.7); + } } @keyframes toc-close { - 0% { - transform: scale(1); - } + 0% { + transform: scale(1); + } - 100% { - transform: scale(0.7); - } + 100% { + transform: scale(0.7); + } } #post-comment .comment-head .comment-headline { - display: inline-block; - vertical-align: middle; - font-weight: 700; - font-size: 19px; + display: inline-block; + vertical-align: middle; + font-weight: 700; + font-size: 19px; } #post-comment .comment-head #comment-switch { - display: inline-block; - float: right; - margin: 0.1rem auto 0px; - padding: 0.2rem 0.8rem; - width: max-content; - border-radius: 5px; - background: rgb(246, 248, 250); + display: inline-block; + float: right; + margin: 0.1rem auto 0px; + padding: 0.2rem 0.8rem; + width: max-content; + border-radius: 5px; + background: rgb(246, 248, 250); } #post-comment .comment-head #comment-switch .first-comment { - color: rgb(48, 122, 246); + color: rgb(48, 122, 246); } #post-comment .comment-head #comment-switch .second-comment { - color: rgb(255, 114, 66); + color: rgb(255, 114, 66); } #post-comment .comment-head #comment-switch .switch-btn { - position: relative; - display: inline-block; - margin: -4px 0.4rem 0px; - width: 42px; - height: 22px; - border-radius: 34px; - background-color: rgb(48, 122, 246); - vertical-align: middle; - cursor: pointer; - transition: all 0.4s ease 0s; + position: relative; + display: inline-block; + margin: -4px 0.4rem 0px; + width: 42px; + height: 22px; + border-radius: 34px; + background-color: rgb(48, 122, 246); + vertical-align: middle; + cursor: pointer; + transition: all 0.4s ease 0s; } #post-comment .comment-head #comment-switch .switch-btn::before { - position: absolute; - bottom: 4px; - left: 4px; - width: 14px; - height: 14px; - border-radius: 50%; - background-color: rgb(255, 255, 255); - content: ""; - transition: all 0.4s ease 0s; + position: absolute; + bottom: 4px; + left: 4px; + width: 14px; + height: 14px; + border-radius: 50%; + background-color: rgb(255, 255, 255); + content: ""; + transition: all 0.4s ease 0s; } #post-comment .comment-head #comment-switch .switch-btn.move { - background-color: rgb(255, 114, 66); + background-color: rgb(255, 114, 66); } #post-comment .comment-head #comment-switch .switch-btn.move::before { - transform: translateX(20px); + transform: translateX(20px); } -#post-comment .comment-wrap > div:nth-child(2) { - display: none; +#post-comment .comment-wrap>div:nth-child(2) { + display: none; } #footer { - position: relative; - background: center bottom / cover local rgb(48, 122, 246); + position: relative; + background: center bottom / cover local rgb(48, 122, 246); } #footer-wrap { - position: relative; - padding: 2rem 1rem; - color: var(--light-grey); - text-align: center; + position: relative; + padding: 2rem 1rem; + color: var(--light-grey); + text-align: center; } #footer-wrap a { - color: var(--light-grey); - padding: 4px 12px; - border-radius: 5px; + color: var(--light-grey); + padding: 4px 12px; + border-radius: 5px; } #footer-wrap a:hover { - background-color: rgb(255, 255, 255); - color: rgb(59, 130, 255); - cursor: pointer; - border-radius: 5px; + background-color: rgb(255, 255, 255); + color: rgb(59, 130, 255); + cursor: pointer; + border-radius: 5px; } #footer-wrap .footer-separator { - margin: 0px 0.2rem; + margin: 0px 0.2rem; } #footer-wrap .icp-icon { - padding: 0px 4px; - vertical-align: text-bottom; - max-height: 1.4em; - width: auto; + padding: 0px 4px; + vertical-align: text-bottom; + max-height: 1.4em; + width: auto; } #page-header { - position: relative; - width: 100%; - background-position: center center; - background-size: cover; - background-repeat: no-repeat; - transition: all 0.5s ease 0s; + position: relative; + width: 100%; + background-position: center center; + background-size: cover; + background-repeat: no-repeat; + transition: all 0.5s ease 0s; } #page-header #scroll-down .scroll-down-effects, #page-header #site-subtitle, #page-header #site-title { - text-align: center; - text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15); - line-height: 1.5; + text-align: center; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15); + line-height: 1.5; } #page-header #site-title { - margin: 0px; - color: var(--white); - font-size: 1.85em; + margin: 0px; + color: var(--white); + font-size: 1.85em; } @media screen and (min-width: 768px) { - #page-header #site-title { - font-size: 2.85em; - } + #page-header #site-title { + font-size: 2.85em; + } } #page-header #site-subtitle { - color: var(--light-grey); - font-size: 1.15em; + color: var(--light-grey); + font-size: 1.15em; } @media screen and (min-width: 768px) { - #page-header #site-subtitle { - font-size: 1.72em; - } + #page-header #site-subtitle { + font-size: 1.72em; + } } #page-header #site_social_icons { - display: none; - margin: 0px auto; - width: 15rem; - text-align: center; + display: none; + margin: 0px auto; + width: 15rem; + text-align: center; } @media screen and (max-width: 768px) { - #page-header #site_social_icons { - display: block; - } + #page-header #site_social_icons { + display: block; + } } #page-header #site_social_icons .social-icon { - margin: 0px 0.5rem; - color: var(--light-grey); - text-shadow: rgba(0, 0, 0, 0.15) 0.1rem 0.1rem 0.2rem; - font-size: 1.43em; - cursor: pointer; + margin: 0px 0.5rem; + color: var(--light-grey); + text-shadow: rgba(0, 0, 0, 0.15) 0.1rem 0.1rem 0.2rem; + font-size: 1.43em; + cursor: pointer; } #page-header #scroll-down .scroll-down-effects { - position: relative; - width: 100%; - color: var(--light-grey); - font-size: 30px; + position: relative; + width: 100%; + color: var(--light-grey); + font-size: 30px; } #page-header.not-home-page { - height: 20rem; + height: 20rem; } @media screen and (max-width: 768px) { - #page-header.not-home-page { - height: 14rem; - } + #page-header.not-home-page { + height: 14rem; + } } #page-header #page-site-info { - position: absolute; - top: 10rem; - padding: 0px 0.5rem; - width: 100%; + position: absolute; + top: 10rem; + padding: 0px 0.5rem; + width: 100%; } @media screen and (max-width: 768px) { - #page-header #page-site-info { - top: 7rem; - } + #page-header #page-site-info { + top: 7rem; + } } #page-header.post-bg { - height: 20rem; + height: 20rem; } @media screen and (max-width: 768px) { - #page-header.post-bg { - height: 18rem; - background-color: var(--heo-main) !important; - transition: 0s; - } + #page-header.post-bg { + height: 18rem; + background-color: var(--heo-main) !important; + transition: 0s; + } } #page-header #post-info { - position: absolute; - padding: 0px 8%; - width: 100%; - text-align: center; + position: absolute; + padding: 0px 8%; + width: 100%; + text-align: center; } @media screen and (max-width: 900px) { - #page-header #post-info { - bottom: 1.5rem; - text-align: left; - } + #page-header #post-info { + bottom: 1.5rem; + text-align: left; + } } @media screen and (max-width: 768px) { - #page-header #post-info { - bottom: 1.1rem; - padding: 0px 1.1rem; - } + #page-header #post-info { + bottom: 1.1rem; + padding: 0px 1.1rem; + } } #page-header.not-top-img { - margin-bottom: 0.5rem; - height: 60px; - background: 0px center; + margin-bottom: 0.5rem; + height: 60px; + background: 0px center; } #page-header.not-top-img #nav { - background: rgba(255, 255, 255, 0.8); + background: rgba(255, 255, 255, 0.8); } #page-header.not-top-img #nav a { - color: var(--heo-fontcolor); - text-shadow: none; + color: var(--heo-fontcolor); + text-shadow: none; } #page-header.not-top-img #travellings_button::after { - background: var(--heo-main) !important; + background: var(--heo-main) !important; } #body-wrap .nav-fixed #travellings_button::after { - background: var(--heo-main) !important + background: var(--heo-main) !important } #body-wrap #travellings_button { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex } #body-wrap #travellings_button:hover::after { - opacity: 1; - -ms-filter: none; - filter: none; - -webkit-transform: none; - -moz-transform: none; - -o-transform: none; - -ms-transform: none; - transform: none; - visibility: visible + opacity: 1; + -ms-filter: none; + filter: none; + -webkit-transform: none; + -moz-transform: none; + -o-transform: none; + -ms-transform: none; + transform: none; + visibility: visible } #body-wrap #travellings_button:hover a { - background: var(--heo-main); - -webkit-box-shadow: var(--heo-shadow-main); - -webkit-box-shadow: var(--heo-shadow-main); - box-shadow: var(--heo-shadow-main) + background: var(--heo-main); + -webkit-box-shadow: var(--heo-shadow-main); + -webkit-box-shadow: var(--heo-shadow-main); + box-shadow: var(--heo-shadow-main) } #body-wrap #travellings_button::after { - --height: 1.8rem; - content: attr(title); - position: fixed; - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-pack: center; - -moz-box-pack: center; - -o-box-pack: center; - -ms-flex-pack: center; - -webkit-justify-content: center; - justify-content: center; - -webkit-box-align: center; - -moz-box-align: center; - -o-box-align: center; - -ms-flex-align: center; - -webkit-align-items: center; - align-items: center; - color: var(--heo-card-bg); - background: var(--heo-white-op) !important; - -webkit-box-shadow: var(--heo-shadow-nav); - box-shadow: var(--heo-shadow-nav); - border-radius: var(--heo-radius-full); - width: fit-content; - height: var(--height); - font-size: var(--global-font-size); - white-space: nowrap; - margin: auto; - padding: 0 4em; - top: calc((60px - var(--height)) / 2); - right: 0; - left: 0; - line-height: 0; - opacity: 0; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - z-index: 1; - visibility: hidden; - -webkit-transform: scaleX(1.1); - -moz-transform: scaleX(1.1); - -o-transform: scaleX(1.1); - -ms-transform: scaleX(1.1); - transform: scaleX(1.1); - pointer-events: none; - -webkit-transition: .5s; - -moz-transition: .5s; - -o-transition: .5s; - -ms-transition: .5s; - transition: .5s + --height: 1.8rem; + content: attr(title); + position: fixed; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + -webkit-box-pack: center; + -moz-box-pack: center; + -o-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -moz-box-align: center; + -o-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + color: var(--heo-card-bg); + background: var(--heo-white-op) !important; + -webkit-box-shadow: var(--heo-shadow-nav); + box-shadow: var(--heo-shadow-nav); + border-radius: var(--heo-radius-full); + width: fit-content; + height: var(--height); + font-size: var(--global-font-size); + white-space: nowrap; + margin: auto; + padding: 0 4em; + top: calc((60px - var(--height)) / 2); + right: 0; + left: 0; + line-height: 0; + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + z-index: 1; + visibility: hidden; + -webkit-transform: scaleX(1.1); + -moz-transform: scaleX(1.1); + -o-transform: scaleX(1.1); + -ms-transform: scaleX(1.1); + transform: scaleX(1.1); + pointer-events: none; + -webkit-transition: .5s; + -moz-transition: .5s; + -o-transition: .5s; + -ms-transition: .5s; + transition: .5s } @media screen and (max-width: 900px) { - #body-wrap #travellings_button::after { - padding: 0 2em; - } + #body-wrap #travellings_button::after { + padding: 0 2em; + } } -#body-wrap:has(#travellings_button:hover) #nav #menus, #body-wrap:has(#travellings_button:hover) #page-name { - display: none +#body-wrap:has(#travellings_button:hover) #nav #menus, +#body-wrap:has(#travellings_button:hover) #page-name { + display: none } #body-wrap .page #travellings_button:hover::after { - background: var(--heo-main) !important + background: var(--heo-main) !important } #page-header.nav-fixed #nav { - position: fixed; - top: -60px; - z-index: 91; - background: rgba(255, 255, 255, 0.8); - transition: transform 0.2s ease-in-out 0s, opacity 0.2s ease-in-out 0s; + position: fixed; + top: -60px; + z-index: 91; + background: rgba(255, 255, 255, 0.8); + transition: transform 0.2s ease-in-out 0s, opacity 0.2s ease-in-out 0s; } #page-header.nav-fixed #nav #site-name, #page-header.nav-fixed #nav #toggle-menu, #page-header.nav-fixed #nav a { - text-shadow: none; + text-shadow: none; } #page-header.nav-visible #nav { - transition: all 0.5s ease 0s; - transform: translate3d(0px, 100%, 0px); + transition: all 0.5s ease 0s; + transform: translate3d(0px, 100%, 0px); } -#page-header.nav-visible + .layout > .aside-content > .sticky_layout { - top: 70px; - transition: top 0.5s ease 0s; +#page-header.nav-visible+.layout>.aside-content>.sticky_layout { + top: 70px; + transition: top 0.5s ease 0s; } #page h1.page-title { - margin: 0.4rem 0px 1rem; + margin: 0.4rem 0px 1rem; } -#post > #post-info { - margin-bottom: 1.5rem; +#post>#post-info { + margin-bottom: 1.5rem; } -#post > #post-info .post-title { - padding-bottom: 0.2rem; - border-bottom: 1px solid var(--light-grey); - color: var(--text-highlight-color); +#post>#post-info .post-title { + padding-bottom: 0.2rem; + border-bottom: 1px solid var(--light-grey); + color: var(--text-highlight-color); } -#post > #post-info .post-title .post-edit-link { - float: right; +#post>#post-info .post-title .post-edit-link { + float: right; } -#post > #post-info #post-meta, -#post > #post-info #post-meta a { - color: rgb(120, 129, 138); +#post>#post-info #post-meta, +#post>#post-info #post-meta a { + color: rgb(120, 129, 138); } #post-info .post-title { - margin-bottom: 0.4rem; - color: var(--white); - font-weight: 400; - font-size: 2.5em; - line-height: 1.5; - -webkit-line-clamp: 3; + margin-bottom: 0.4rem; + color: var(--white); + font-weight: 400; + font-size: 2.5em; + line-height: 1.5; + -webkit-line-clamp: 3; } @media screen and (max-width: 768px) { - #post-info .post-title { - font-size: 1.72em; - } + #post-info .post-title { + font-size: 1.72em; + } } #post-info .post-title .post-edit-link { - padding-left: 0.5rem; + padding-left: 0.5rem; } #post-info #post-meta { - color: var(--light-grey); - font-size: 95%; + color: var(--light-grey); + font-size: 95%; } @media screen and (min-width: 768px) { - /*#post-info #post-meta > .meta-secondline > span:first-child {*/ - /* display: none;*/ - /*}*/ + /*#post-info #post-meta > .meta-secondline > span:first-child {*/ + /* display: none;*/ + /*}*/ } @media screen and (max-width: 768px) { - #post-info #post-meta { - font-size: 90%; - } + #post-info #post-meta { + font-size: 90%; + } } #post-info #post-meta a { - color: var(--light-grey); - transition: all 0.3s ease-out 0s; + color: var(--light-grey); + transition: all 0.3s ease-out 0s; } #post-info #post-meta a:hover { - color: rgb(48, 122, 246); - text-decoration: underline; + color: rgb(48, 122, 246); + text-decoration: underline; } #nav { - position: absolute; - top: 0px; - z-index: 90; - display: flex; - flex-wrap: wrap; - -webkit-box-align: center; - align-items: center; - padding: 0px 36px; - width: 100%; - height: 60px; - font-size: 1.3em; - opacity: 0; - transition: all 0.5s ease 0s; - outline: 1px solid var(--heo-none); + position: absolute; + top: 0px; + z-index: 90; + display: flex; + flex-wrap: wrap; + -webkit-box-align: center; + align-items: center; + padding: 0px 36px; + width: 100%; + height: 60px; + font-size: 1.3em; + opacity: 0; + transition: all 0.5s ease 0s; + outline: 1px solid var(--heo-none); } @media screen and (max-width: 768px) { - #nav { - padding: 0px 16px; - } + #nav { + padding: 0px 16px; + } } #nav.show { - opacity: 1; - filter: none; + opacity: 1; + filter: none; } #nav #toggle-menu { - display: none; - padding: 0.1rem 0px 0px 0.3rem; - vertical-align: top; + display: none; + padding: 0.1rem 0px 0px 0.3rem; + vertical-align: top; } #nav #toggle-menu:hover { - color: var(--white); + color: var(--white); } #nav a { - color: var(--light-grey); - padding: 0.3rem 0.4rem 0px; - border-radius: 5px; + color: var(--light-grey); + padding: 0.3rem 0.4rem 0px; + border-radius: 5px; } #nav a:hover { - color: var(--white); - background: rgba(0, 0, 0, 0.25); + color: var(--white); + background: rgba(0, 0, 0, 0.25); } #nav #site-name { - text-shadow: rgba(0, 0, 0, 0.15) 0.1rem 0.1rem 0.2rem; - font-weight: 700; - cursor: pointer; + text-shadow: rgba(0, 0, 0, 0.15) 0.1rem 0.1rem 0.2rem; + font-weight: 700; + cursor: pointer; } #nav .menus_items { - display: inline; + display: inline; } #nav .menus_items .menus_item { - position: relative; - display: inline-block; - padding: 0px 0.4rem 0px 0px; + position: relative; + display: inline-block; + padding: 0px 0.4rem 0px 0px; } -#nav .menus_items .recursion_menus_item:hover > .menus_item_child, -#nav .menus_items .menus_item:hover > .menus_item_child { - display: block; +#nav .menus_items .recursion_menus_item:hover>.menus_item_child, +#nav .menus_items .menus_item:hover>.menus_item_child { + display: block; } #nav .menus_items .menus_item:hover i.expand { - transform: rotate(180deg) !important; + transform: rotate(180deg) !important; } #nav .menus_items .menus_item i.expand { - padding: 4px; - transition: transform 0.3s ease 0s; + padding: 4px; + transition: transform 0.3s ease 0s; } #nav .menus_items .menus_item .menus_item_child { - position: absolute; - display: none; - margin-top: 8px; - padding: 0px; - background-color: var(--sidebar-bg); - box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 20px -4px; - animation: 0.3s ease 0.1s 1 normal both running sub_menus; - border-radius: 5px; - white-space: nowrap; + position: absolute; + display: none; + margin-top: 8px; + padding: 0px; + background-color: var(--sidebar-bg); + box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 20px -4px; + animation: 0.3s ease 0.1s 1 normal both running sub_menus; + border-radius: 5px; + white-space: nowrap; } #nav .menus_items .menus_item .menus_item_child::before { - position: absolute; - top: -8px; - left: 0px; - width: 100%; - height: 20px; - content: ""; + position: absolute; + top: -8px; + left: 0px; + width: 100%; + height: 20px; + content: ""; } -#nav .menus_items .menus_item .recursion_menus_item > .menus_item_child { - margin-top: 24px; +#nav .menus_items .menus_item .recursion_menus_item>.menus_item_child { + margin-top: 24px; } #nav.hide-menu #toggle-menu { - display: inline-block !important; + display: inline-block !important; } #nav.hide-menu #toggle-menu .site-page { - font-size: inherit; + font-size: inherit; } #nav.hide-menu .menus_items { - position: absolute; - left: 0px; - visibility: hidden; - opacity: 0; + position: absolute; + left: 0px; + visibility: hidden; + opacity: 0; } #nav.hide-menu #search-button span { - display: none !important; + display: none !important; } #nav #search-button { - display: inline; - padding: 0px 0.4rem; + display: inline; + padding: 0px 0.4rem; } #nav .site-page { - position: relative; - padding-bottom: 0.3rem; - text-shadow: rgba(0, 0, 0, 0.3) 0.05rem 0.05rem 0.1rem; - font-size: 0.78em; - cursor: pointer; + position: relative; + padding-bottom: 0.3rem; + text-shadow: rgba(0, 0, 0, 0.3) 0.05rem 0.05rem 0.1rem; + font-size: 0.78em; + cursor: pointer; } .li-style { - width: 100%; - height: 25px; - text-align: center; + width: 100%; + height: 25px; + text-align: center; } li, ul { - list-style: none; - display: block; - margin: 0px; - padding: 0px; + list-style: none; + display: block; + margin: 0px; + padding: 0px; } @-webkit-keyframes configure-clockwise { - 0% { - transform: rotate(0deg); - } + 0% { + transform: rotate(0deg); + } - 25% { - transform: rotate(90deg); - } + 25% { + transform: rotate(90deg); + } - 50% { - transform: rotate(180deg); - } + 50% { + transform: rotate(180deg); + } - 75% { - transform: rotate(270deg); - } + 75% { + transform: rotate(270deg); + } - 100% { - transform: rotate(360deg); - } + 100% { + transform: rotate(360deg); + } } @keyframes configure-clockwise { - 0% { - transform: rotate(0deg); - } + 0% { + transform: rotate(0deg); + } - 25% { - transform: rotate(90deg); - } + 25% { + transform: rotate(90deg); + } - 50% { - transform: rotate(180deg); - } + 50% { + transform: rotate(180deg); + } - 75% { - transform: rotate(270deg); - } + 75% { + transform: rotate(270deg); + } - 100% { - transform: rotate(360deg); - } + 100% { + transform: rotate(360deg); + } } @-webkit-keyframes configure-xclockwise { - 0% { - transform: rotate(45deg); - } + 0% { + transform: rotate(45deg); + } - 25% { - transform: rotate(-45deg); - } + 25% { + transform: rotate(-45deg); + } - 50% { - transform: rotate(-135deg); - } + 50% { + transform: rotate(-135deg); + } - 75% { - transform: rotate(-225deg); - } + 75% { + transform: rotate(-225deg); + } - 100% { - transform: rotate(-315deg); - } + 100% { + transform: rotate(-315deg); + } } @keyframes configure-xclockwise { - 0% { - transform: rotate(45deg); - } + 0% { + transform: rotate(45deg); + } - 25% { - transform: rotate(-45deg); - } + 25% { + transform: rotate(-45deg); + } - 50% { - transform: rotate(-135deg); - } + 50% { + transform: rotate(-135deg); + } - 75% { - transform: rotate(-225deg); - } + 75% { + transform: rotate(-225deg); + } - 100% { - transform: rotate(-315deg); - } + 100% { + transform: rotate(-315deg); + } } #pagination { - overflow: hidden; - margin-top: 1rem; - width: 100%; + overflow: hidden; + margin-top: 1rem; + width: 100%; } #pagination .pagination { - text-align: center; + text-align: center; } #pagination .page-number { - display: inline-block; - margin: 0px 0.2rem; - min-width: 1.2rem; - height: 1.2rem; - text-align: center; - line-height: 1.2rem; - cursor: pointer; + display: inline-block; + margin: 0px 0.2rem; + min-width: 1.2rem; + height: 1.2rem; + text-align: center; + line-height: 1.2rem; + cursor: pointer; } #pagination .page-number.current { - background: rgb(0, 121, 255); - color: var(--heo-card-bg); - cursor: default; - border-radius: 5px; + background: rgb(0, 121, 255); + color: var(--heo-card-bg); + cursor: default; + border-radius: 5px; } #pagination img.next-cover, #pagination img.prev-cover { - position: absolute; - width: 100%; - height: 100%; - opacity: 0.4; - transition: all 0.6s ease 0s; - object-fit: cover; + position: absolute; + width: 100%; + height: 100%; + opacity: 0.4; + transition: all 0.6s ease 0s; + object-fit: cover; } #pagination .pagination-info { - position: absolute; - top: 50%; - padding: 1rem 2rem; - width: 100%; - transform: translate(0px, -50%); + position: absolute; + top: 50%; + padding: 1rem 2rem; + width: 100%; + transform: translate(0px, -50%); } #pagination .next_info, #pagination .prev_info { - color: var(--white); - font-weight: 500; + color: var(--white); + font-weight: 500; } #pagination .next-post .pagination-info { - text-align: right; + text-align: right; } #pagination .pull-full { - width: 100% !important; + width: 100% !important; } #pagination .next-post .label, #pagination .prev-post .label { - color: var(--light-grey); - text-transform: uppercase; - font-size: 90%; + color: var(--light-grey); + text-transform: uppercase; + font-size: 90%; } #pagination .next-post, #pagination .prev-post { - width: 50%; + width: 50%; } @media screen and (max-width: 768px) { - #pagination .next-post, - #pagination .prev-post { - width: 100%; - } + #pagination .next-post, + #pagination .prev-post { + width: 100%; + } } #pagination .next-post a, #pagination .prev-post a { - position: relative; - display: block; - overflow: hidden; - height: 150px; + position: relative; + display: block; + overflow: hidden; + height: 150px; } #pagination .next-post:hover img.next-cover, #pagination .next-post:hover img.prev-cover, #pagination .prev-post:hover img.next-cover, #pagination .prev-post:hover img.prev-cover { - opacity: 0.8; - transform: scale(1.1); + opacity: 0.8; + transform: scale(1.1); } #pagination.pagination-post { - margin-top: 2rem; - background: rgb(0, 0, 0); + margin-top: 2rem; + background: rgb(0, 0, 0); } #article-container { - overflow-wrap: break-word; + overflow-wrap: break-word; } #article-container a:hover { - text-decoration: none; - background: var(--heo-main); - border-width: 0; - color: var(--heo-white); - border-radius: 4px + text-decoration: none; + background: var(--heo-main); + border-width: 0; + color: var(--heo-white); + border-radius: 4px } #article-container img { - display: block; - margin: 0px auto 0.8rem; + display: block; + margin: 0px auto 0.8rem; } @media screen and (max-width: 768px) { - #article-container img { - max-width: 100% - } + #article-container img { + max-width: 100% + } } #article-container p { - margin: 0px 0px 0.8rem; + margin: 0px 0px 0.8rem; } #article-container iframe { - margin: 0px 0px 1rem; + margin: 0px 0px 1rem; } #article-container kbd { - margin: 0px 3px; - padding: 3px 5px; - border: 1px solid rgb(180, 180, 180); - border-radius: 3px; - background-color: rgb(248, 248, 248); - box-shadow: rgba(0, 0, 0, 0.25) 0px 1px 3px, rgba(255, 255, 255, 0.6) 0px 2px 1px 0px inset; - color: rgb(52, 73, 94); - white-space: nowrap; - font-weight: 600; - font-size: 0.9em; - font-family: Monaco, "Ubuntu Mono", monospace; - line-height: 1em; + margin: 0px 3px; + padding: 3px 5px; + border: 1px solid rgb(180, 180, 180); + border-radius: 3px; + background-color: rgb(248, 248, 248); + box-shadow: rgba(0, 0, 0, 0.25) 0px 1px 3px, rgba(255, 255, 255, 0.6) 0px 2px 1px 0px inset; + color: rgb(52, 73, 94); + white-space: nowrap; + font-weight: 600; + font-size: 0.9em; + font-family: Monaco, "Ubuntu Mono", monospace; + line-height: 1em; } #article-container h1, @@ -3188,7 +3191,7 @@ ul { #article-container h4, #article-container h5, #article-container h6 { - transition: all 0.2s ease-out 0s; + transition: all 0.2s ease-out 0s; } #article-container h1::before, @@ -3197,12 +3200,12 @@ ul { #article-container h4::before, #article-container h5::before, #article-container h6::before { - position: absolute; - top: calc(50% - 0.35rem); - color: rgb(242, 186, 75); - content: ""; - line-height: 1; - transition: all 0.2s ease-out 0s; + position: absolute; + top: calc(50% - 0.35rem); + color: rgb(242, 186, 75); + content: ""; + line-height: 1; + transition: all 0.2s ease-out 0s; } #article-container h1:hover::before, @@ -3211,1383 +3214,1384 @@ ul { #article-container h4:hover::before, #article-container h5:hover::before, #article-container h6:hover::before { - color: rgb(48, 122, 246); + color: rgb(48, 122, 246); } #article-container h1 { - padding-left: 1.4rem; + padding-left: 1.4rem; } #article-container h1 code { - font-size: 1rem; + font-size: 1rem; } #article-container h1::before { - margin-left: -1.2rem; - font-size: 1rem; + margin-left: -1.2rem; + font-size: 1rem; } #article-container h1:hover { - padding-left: 1.6rem; + padding-left: 1.6rem; } #article-container h2 { - padding-left: 1.3rem; + padding-left: 1.3rem; } #article-container h2 code { - font-size: 0.9rem; + font-size: 0.9rem; } #article-container h2::before { - margin-left: -1.1rem; - font-size: 0.9rem; + margin-left: -1.1rem; + font-size: 0.9rem; } #article-container h2:hover { - padding-left: 1.5rem; + padding-left: 1.5rem; } #article-container h3 { - padding-left: 1.2rem; + padding-left: 1.2rem; } #article-container h3 code { - font-size: 0.8rem; + font-size: 0.8rem; } #article-container h3::before { - margin-left: -1rem; - font-size: 0.8rem; + margin-left: -1rem; + font-size: 0.8rem; } #article-container h3:hover { - padding-left: 1.4rem; + padding-left: 1.4rem; } #article-container h4 { - padding-left: 1.1rem; + padding-left: 1.1rem; } #article-container h4 code { - font-size: 0.7rem; + font-size: 0.7rem; } #article-container h4::before { - margin-left: -0.9rem; - font-size: 0.7rem; + margin-left: -0.9rem; + font-size: 0.7rem; } #article-container h4:hover { - padding-left: 1.3rem; + padding-left: 1.3rem; } #article-container h5 { - padding-left: 1rem; + padding-left: 1rem; } #article-container h5 code { - font-size: 0.6rem; + font-size: 0.6rem; } #article-container h5::before { - margin-left: -0.8rem; - font-size: 0.6rem; + margin-left: -0.8rem; + font-size: 0.6rem; } #article-container h5:hover { - padding-left: 1.2rem; + padding-left: 1.2rem; } #article-container h6 { - padding-left: 1rem; + padding-left: 1rem; } #article-container h6 code { - font-size: 0.6rem; + font-size: 0.6rem; } #article-container h6::before { - margin-left: -0.8rem; - font-size: 0.6rem; + margin-left: -0.8rem; + font-size: 0.6rem; } #article-container h6:hover { - padding-left: 1.2rem; + padding-left: 1.2rem; } #article-container ol, #article-container ul { - margin-top: 0.4rem; - padding: 0px 0px 0px 0.8rem; - list-style: none; - counter-reset: li 0; + margin-top: 0.4rem; + padding: 0px 0px 0px 0.8rem; + list-style: none; + counter-reset: li 0; } @media screen and (max-width: 768px) { - #article-container ol, - #article-container ul { - padding: 0px 0px 0px 0.4rem; - } + #article-container ol, + #article-container ul { + padding: 0px 0px 0px 0.4rem; + } } #article-container ol p, #article-container ul p { - margin: 0px 0px 0.5rem; + margin: 0px 0px 0.5rem; } #article-container ol ol, #article-container ol ul, #article-container ul ol, #article-container ul ul { - padding-left: 0.6rem; + padding-left: 0.6rem; } @media screen and (max-width: 768px) { - #article-container ol ol, - #article-container ol ul, - #article-container ul ol, - #article-container ul ul { - padding-left: 0.2rem; - } + #article-container ol ol, + #article-container ol ul, + #article-container ul ol, + #article-container ul ul { + padding-left: 0.2rem; + } } #article-container ol li:not(.tab), #article-container ul li:not(.tab) { - position: relative; - margin: 0.2rem 0px; + position: relative; + margin: 0.2rem 0px; } #article-container ol li:hover::before, #article-container ul li:hover::before { - transform: rotate(360deg); + transform: rotate(360deg); } #article-container ol li::before, #article-container ul li::before { - position: absolute; - top: 0px; - left: 0px; - background: rgb(48, 122, 246); - color: rgb(255, 255, 255); - cursor: pointer; - transition: all 0.3s ease-out 0s; + position: absolute; + top: 0px; + left: 0px; + background: rgb(48, 122, 246); + color: rgb(255, 255, 255); + cursor: pointer; + transition: all 0.3s ease-out 0s; } -#article-container ol > li:not(.tab) { - padding: 0.2em 0.2em 0.2em 1.8em; +#article-container ol>li:not(.tab) { + padding: 0.2em 0.2em 0.2em 1.8em; } -#article-container ol > li::before { - margin-top: 0.65em; - width: 1.45em; - height: 1.45em; - border-radius: 0.725em; - content: counter(li); - counter-increment: li 1; - text-align: center; - font-size: 0.85em; - line-height: 1.45em; +#article-container ol>li::before { + margin-top: 0.65em; + width: 1.45em; + height: 1.45em; + border-radius: 0.725em; + content: counter(li); + counter-increment: li 1; + text-align: center; + font-size: 0.85em; + line-height: 1.45em; } -#article-container ul > li:not(.tab) { - padding: 0.2em 0.2em 0.2em 1.4em; +#article-container ul>li:not(.tab) { + padding: 0.2em 0.2em 0.2em 1.4em; } -#article-container ul > li:not(.tab):hover::before { - border-color: rgb(255, 114, 66); +#article-container ul>li:not(.tab):hover::before { + border-color: rgb(255, 114, 66); } -#article-container ul > li:not(.tab)::before { - top: 0.78em; - width: 0.42em; - height: 0.42em; - border: 0.21em solid rgb(48, 122, 246); - border-radius: 0.42em; - background: 0px 0px; - content: ""; - line-height: 0.42em; +#article-container ul>li:not(.tab)::before { + top: 0.78em; + width: 0.42em; + height: 0.42em; + border: 0.21em solid rgb(48, 122, 246); + border-radius: 0.42em; + background: 0px 0px; + content: ""; + line-height: 0.42em; } -#article-container > :last-child { - margin-bottom: 0px !important; +#article-container> :last-child { + margin-bottom: 0px !important; } #post .tag_share .post-meta__tags { - display: inline-block; - margin: 0.4rem 0.4rem 0.4rem 0px; - padding: 0px 0.6rem; - width: fit-content; - border: 1px solid rgb(48, 122, 246); - border-radius: 2rem; - font-size: 0.85em; - transition: all 0.2s ease-in-out 0s; - background: rgb(48, 122, 246); - color: var(--white); + display: inline-block; + margin: 0.4rem 0.4rem 0.4rem 0px; + padding: 0px 0.6rem; + width: fit-content; + border: 1px solid rgb(48, 122, 246); + border-radius: 2rem; + font-size: 0.85em; + transition: all 0.2s ease-in-out 0s; + background: rgb(48, 122, 246); + color: var(--white); } #post .tag_share .post-meta__tags:hover { - color: rgb(48, 122, 246); - background: 0px 0px; + color: rgb(48, 122, 246); + background: 0px 0px; } #post .tag_share .post_share { - display: inline-block; - float: right; - margin: 0.4rem 0px; - width: fit-content; + display: inline-block; + float: right; + margin: 0.4rem 0px; + width: fit-content; } #post .tag_share .post_share .social-share { - font-size: 0.85em; + font-size: 0.85em; } #post .tag_share .post_share .social-share .social-share-icon { - margin: 0px 4px; - width: 1.85em; - height: 1.85em; - font-size: 1.2em; - line-height: 1.85em; + margin: 0px 4px; + width: 1.85em; + height: 1.85em; + font-size: 1.2em; + line-height: 1.85em; } #post .post-copyright::before { - position: absolute; - top: 0.1rem; - right: 0.6rem; - color: rgb(48, 122, 246); - content: ""; - font-size: 1rem; + position: absolute; + top: 0.1rem; + right: 0.6rem; + color: rgb(48, 122, 246); + content: ""; + font-size: 1rem; } #post .post-copyright .post-copyright-meta { - color: rgb(48, 122, 246); - font-weight: 700; + color: rgb(48, 122, 246); + font-weight: 700; } #post .post-copyright .post-copyright-info { - padding-left: 0.3rem; + padding-left: 0.3rem; } #post .post-copyright .post-copyright-info a { - text-decoration: none; - word-break: break-word; - color: rgb(59, 130, 255); - padding: 0px 4px; - border-radius: 4px; + text-decoration: none; + word-break: break-word; + color: rgb(59, 130, 255); + padding: 0px 4px; + border-radius: 4px; } #post .post-outdate-notice { - position: relative; - margin: 0px 0px 1rem; - border-radius: 3px; - background-color: rgb(255, 230, 230); - color: rgb(255, 102, 102); - padding: 0.5em 1em 0.5em 2.6em; - border-left: 5px solid rgb(255, 128, 128); + position: relative; + margin: 0px 0px 1rem; + border-radius: 3px; + background-color: rgb(255, 230, 230); + color: rgb(255, 102, 102); + padding: 0.5em 1em 0.5em 2.6em; + border-left: 5px solid rgb(255, 128, 128); } #post .post-outdate-notice::before { - position: absolute; - top: 50%; - left: 0.9em; - color: rgb(255, 128, 128); - content: ""; - transform: translateY(-50%); + position: absolute; + top: 50%; + left: 0.9em; + color: rgb(255, 128, 128); + content: ""; + transform: translateY(-50%); } #post .ads-wrap { - margin: 2rem 0px; + margin: 2rem 0px; } .relatedPosts { - margin-top: 2rem; + margin-top: 2rem; } -.relatedPosts > .headline { - margin-bottom: 5px; - font-weight: 700; - font-size: 1.43em; +.relatedPosts>.headline { + margin-bottom: 5px; + font-weight: 700; + font-size: 1.43em; } @media screen and (max-width: 768px) { - .relatedPosts > .relatedPosts-list > div { - margin: 2px; - width: calc(50% - 4px); - height: 150px; - } + .relatedPosts>.relatedPosts-list>div { + margin: 2px; + width: calc(50% - 4px); + height: 150px; + } } @media screen and (max-width: 600px) { - .relatedPosts > .relatedPosts-list > div { - width: calc(100% - 4px); - } + .relatedPosts>.relatedPosts-list>div { + width: calc(100% - 4px); + } } .post-reward { - position: relative; - margin-top: 4rem; - text-align: center; + position: relative; + margin-top: 4rem; + text-align: center; } -.post-reward:hover > .reward-main { - display: block; +.post-reward:hover>.reward-main { + display: block; } .post-reward .reward-main { - position: absolute; - bottom: 40px; - left: 0px; - z-index: 100; - display: none; - padding: 0px 0px 15px; - width: 100%; + position: absolute; + bottom: 40px; + left: 0px; + z-index: 100; + display: none; + padding: 0px 0px 15px; + width: 100%; } .post-reward .reward-main .reward-all { - display: inline-block; - margin: 0px; - padding: 1rem 0.5rem; - border-radius: 4px; - background: var(--reward-pop); + display: inline-block; + margin: 0px; + padding: 1rem 0.5rem; + border-radius: 4px; + background: var(--reward-pop); } .post-reward .reward-main .reward-all::before { - position: absolute; - bottom: -10px; - left: 0px; - width: 100%; - height: 20px; - content: ""; + position: absolute; + bottom: -10px; + left: 0px; + width: 100%; + height: 20px; + content: ""; } .post-reward .reward-main .reward-all::after { - position: absolute; - right: 0px; - bottom: 2px; - left: 0px; - margin: 0px auto; - width: 0px; - height: 0px; - border-top: 13px solid var(--reward-pop); - border-right: 13px solid transparent; - border-left: 13px solid transparent; - content: ""; + position: absolute; + right: 0px; + bottom: 2px; + left: 0px; + margin: 0px auto; + width: 0px; + height: 0px; + border-top: 13px solid var(--reward-pop); + border-right: 13px solid transparent; + border-left: 13px solid transparent; + content: ""; } .post-reward .reward-main .reward-all .reward-item { - display: inline-block; - padding: 0px 8px; - list-style-type: none; - vertical-align: top; + display: inline-block; + padding: 0px 8px; + list-style-type: none; + vertical-align: top; } .post-reward .reward-main .reward-all .reward-item img { - width: 130px; - height: 130px; + width: 130px; + height: 130px; } .post-reward .reward-main .reward-all .reward-item .post-qr-code-desc { - padding-top: 0.4rem; - width: 130px; - color: rgb(133, 133, 133); + padding-top: 0.4rem; + width: 130px; + color: rgb(133, 133, 133); } #sidebar #menu-mask { - position: fixed; - z-index: 1001; - display: none; - width: 100%; - height: 100%; - background: var(--heo-maskbg); - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); - transform: translateZ(0); - animation: 0.6s ease 0s 1 normal none running to_show; + position: fixed; + z-index: 1001; + display: none; + width: 100%; + height: 100%; + background: var(--heo-maskbg); + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); + transform: translateZ(0); + animation: 0.6s ease 0s 1 normal none running to_show; } #sidebar #sidebar-menus { - position: fixed; - top: 0px; - right: -300px; - z-index: 103; - overflow: hidden auto; - width: 300px; - height: 100%; - background: var(--sidebar-bg); - transition: all 0.5s ease 0s; - padding-top: 30px; - z-index: 1001; - border-left: var(--style-border-always); + position: fixed; + top: 0px; + right: -300px; + z-index: 103; + overflow: hidden auto; + width: 300px; + height: 100%; + background: var(--sidebar-bg); + transition: all 0.5s ease 0s; + padding-top: 30px; + z-index: 1001; + border-left: var(--style-border-always); } #sidebar #sidebar-menus.open { - transform: translate3d(-100%, 0px, 0px); + transform: translate3d(-100%, 0px, 0px); } #sidebar #sidebar-menus .back-menu-list-groups { - padding: 0 16px; + padding: 0 16px; } #sidebar #sidebar-menus .back-menu-list-groups .back-menu-list-title { - font-size: 14px; - color: var(--heo-secondtext); + font-size: 14px; + color: var(--heo-secondtext); } #sidebar #sidebar-menus .back-menu-list-groups .back-menu-list { - width: calc(100% + 16px); - justify-content: flex-start; - margin: 0 -8px; + width: calc(100% + 16px); + justify-content: flex-start; + margin: 0 -8px; } #sidebar #sidebar-menus .back-menu-list-groups .back-menu-list .back-menu-item { - background: var(--heo-card-bg); - border: var(--style-border-always); - border-radius: 8px; + background: var(--heo-card-bg); + border: var(--style-border-always); + border-radius: 8px; } @media screen and (max-width: 768px) { - #sidebar #sidebar-menus .back-menu-list-groups .back-menu-list .back-menu-item { - width: calc(50% - 16px); - } + #sidebar #sidebar-menus .back-menu-list-groups .back-menu-list .back-menu-item { + width: calc(50% - 16px); + } } #sidebar #sidebar-menus .back-home-button { - display: none; + display: none; } -#sidebar #sidebar-menus > .author-avatar { - padding: 1.3rem 1.5rem 0px; - text-align: center; +#sidebar #sidebar-menus>.author-avatar { + padding: 1.3rem 1.5rem 0px; + text-align: center; } -#sidebar #sidebar-menus > .author-avatar img { - width: 110px; - height: 110px; - border-radius: 70px; - transition: all 0.5s ease 0s; +#sidebar #sidebar-menus>.author-avatar img { + width: 110px; + height: 110px; + border-radius: 70px; + transition: all 0.5s ease 0s; } -#sidebar #sidebar-menus > .author-avatar img:hover { - transform: rotate(360deg); +#sidebar #sidebar-menus>.author-avatar img:hover { + transform: rotate(360deg); } #sidebar #sidebar-menus .site-data { - display: table; - padding: 0.6rem 0.5rem 0px; - width: 100%; - table-layout: fixed; + display: table; + padding: 0.6rem 0.5rem 0px; + width: 100%; + table-layout: fixed; } #sidebar #sidebar-menus .site-data .data-item { - display: table-cell; + display: table-cell; } #sidebar #sidebar-menus .site-data .data-item .data-item-link .length-num { - color: var(--text-highlight-color); - font-size: 1.28em; + color: var(--text-highlight-color); + font-size: 1.28em; } #sidebar #sidebar-menus .site-data .data-item .data-item-link .headline { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } #sidebar #sidebar-menus hr { - margin: 1rem auto; + margin: 1rem auto; } #sidebar #sidebar-menus .menus_items { - padding: 0 16px; + padding: 0 16px; } #sidebar #sidebar-menus .menus_items .site-page { - position: relative; - display: block; - padding: 0; - color: var(--heo-fontcolor); - font-size: 1.15em; - cursor: pointer; - font-size: 14.3px; - font-weight: bold; + position: relative; + display: block; + padding: 0; + color: var(--heo-fontcolor); + font-size: 1.15em; + cursor: pointer; + font-size: 14.3px; + font-weight: bold; } #sidebar #sidebar-menus .menus_items .site-page span:hover { - color: rgb(48, 122, 246); + color: rgb(48, 122, 246); } -#sidebar #sidebar-menus .menus_item > .site-page { - display: flex; - font-size: 14px; - color: var(--heo-secondtext); +#sidebar #sidebar-menus .menus_item>.site-page { + display: flex; + font-size: 14px; + color: var(--heo-secondtext); } #sidebar #sidebar-menus .menus_items .expand { - position: absolute; - top: 0.78em; - right: 0.4rem; - transition: transform 0.3s ease 0s; + position: absolute; + top: 0.78em; + right: 0.4rem; + transition: transform 0.3s ease 0s; } #sidebar #sidebar-menus .menus_items .expand.hide { - transform: rotate(90deg) !important; + transform: rotate(90deg) !important; } #sidebar #sidebar-menus .menus_items .menus_item_child { - margin: 0px -4px; - list-style: none; - display: flex; - flex-direction: row; - flex-wrap: wrap; + margin: 0px -4px; + list-style: none; + display: flex; + flex-direction: row; + flex-wrap: wrap; } #sidebar #sidebar-menus .menus_item_child .site-page.child { - display: flex; - flex-direction: column; - align-items: center; - padding: 8px; - border-radius: 12px; - border: var(--style-border-always); - background: var(--heo-card-bg); + display: flex; + flex-direction: column; + align-items: center; + padding: 8px; + border-radius: 12px; + border: var(--style-border-always); + background: var(--heo-card-bg); } #sidebar #sidebar-menus .menus_item_child li { - width: calc(50% - 8px); - margin: 4px; + width: calc(50% - 8px); + margin: 4px; } #sidebar #sidebar-menus .menus_item_child .site-page.child span { - line-height: 1; - margin-top: 8px; - font-size: 14.3px; + line-height: 1; + margin-top: 8px; + font-size: 14.3px; } #sidebar #sidebar-menus .card-tag-cloud { - padding: 0 16px; - display: flex; - flex-direction: row; - flex-wrap: wrap; - margin-bottom: 60px; + padding: 0 16px; + display: flex; + flex-direction: row; + flex-wrap: wrap; + margin-bottom: 60px; } #sidebar #sidebar-menus .card-tag-cloud a { - color: var(--heo-fontcolor) !important; - padding: 2px 8px 2px 12px; - margin: 4px; - border-radius: 8px; - border: var(--style-border-always); - background: var(--heo-card-bg); - font-size: 14px; + color: var(--heo-fontcolor) !important; + padding: 2px 8px 2px 12px; + margin: 4px; + border-radius: 8px; + border: var(--style-border-always); + background: var(--heo-card-bg); + font-size: 14px; } #sidebar #sidebar-menus .card-tag-cloud a sup { - opacity: 0.6; - margin-left: 4px; + opacity: 0.6; + margin-left: 4px; } #sidebar #sidebar-menus span.sidebar-menu-item-title { - font-size: 14px; - color: var(--heo-secondtext); - margin-left: 16px; + font-size: 14px; + color: var(--heo-secondtext); + margin-left: 16px; } #sidebar #sidebar-menus .sidebar-menu-item { - display: flex; - flex-direction: column; - padding: 0 16px; + display: flex; + flex-direction: column; + padding: 0 16px; } #sidebar #sidebar-menus .sidebar-menu-item a.menu-child { - width: 100%; - background: var(--heo-card-bg); - border-radius: 8px; - border: var(--style-border-always); - display: flex; - align-items: center; - font-size: 14.3px; + width: 100%; + background: var(--heo-card-bg); + border-radius: 8px; + border: var(--style-border-always); + display: flex; + align-items: center; + font-size: 14.3px; } #sidebar #sidebar-menus .sidebar-menu-item a.menu-child i { - margin: 0 8px; + margin: 0 8px; } #sidebar #sidebar-menus .webinfo { - padding: 0 16px; - display: flex; - white-space: nowrap; - flex-direction: column; + padding: 0 16px; + display: flex; + white-space: nowrap; + flex-direction: column; } #sidebar #sidebar-menus .webinfo .webinfo-item { - justify-content: space-between; + justify-content: space-between; } #vcomment, #waline { - font-size: 1.1em; + font-size: 1.1em; } #vcomment .vbtn, #waline .vbtn { - border: none; - background: var(--btn-bg); - color: var(--btn-color); + border: none; + background: var(--btn-bg); + color: var(--btn-color); } #vcomment .vbtn:hover, #waline .vbtn:hover { - background: var(--btn-hover-color); + background: var(--btn-hover-color); } #vcomment .vimg, #waline .vimg { - transition: all 0.3s ease 0s; + transition: all 0.3s ease 0s; } #vcomment .vimg:hover, #waline .vimg:hover { - transform: rotate(360deg); + transform: rotate(360deg); } #vcomment .vcards .vcard .vcontent.expand::after, #vcomment .vcards .vcard .vcontent.expand::before, #waline .vcards .vcard .vcontent.expand::after, #waline .vcards .vcard .vcontent.expand::before { - z-index: 22; + z-index: 22; } .fireworks { - position: fixed; - top: 0px; - left: 0px; - z-index: 9999; - pointer-events: none; + position: fixed; + top: 0px; + left: 0px; + z-index: 9999; + pointer-events: none; } .medium-zoom-image--opened { - z-index: 99999 !important; - margin: 0px !important; + z-index: 99999 !important; + margin: 0px !important; } .medium-zoom-overlay { - z-index: 99999 !important; + z-index: 99999 !important; } .mermaid { - overflow: auto; - margin: 0px 0px 1rem; - background: rgb(255, 255, 255); - text-align: center; - opacity: 0; - transition: all 0.3s ease 0s; + overflow: auto; + margin: 0px 0px 1rem; + background: rgb(255, 255, 255); + text-align: center; + opacity: 0; + transition: all 0.3s ease 0s; } .mermaid[data-processed] { - opacity: 1; - filter: none; + opacity: 1; + filter: none; } .fb-comments iframe, .utterances { - width: 100% !important; + width: 100% !important; } #gitalk-container .gt-meta { - margin: 0px 0px 0.8em; - padding: 0.3rem 0px 0.8em; + margin: 0px 0px 0.8em; + padding: 0.3rem 0px 0.8em; } .katex-wrap { - overflow: auto; + overflow: auto; } .katex-wrap::-webkit-scrollbar { - display: none; + display: none; } .mathjax-overflow { - overflow: auto hidden; + overflow: auto hidden; } mjx-container[jax="CHTML"][display="true"] { - overflow: auto hidden; - padding-bottom: 0.3rem; + overflow: auto hidden; + padding-bottom: 0.3rem; } -.aplayer { -} +.aplayer {} #article-container .aplayer { - margin: 0px 0px 1rem; + margin: 0px 0px 1rem; } #article-container .aplayer ol, #article-container .aplayer ul { - margin: 0px; - padding: 0px; + margin: 0px; + padding: 0px; } #article-container .aplayer ol li, #article-container .aplayer ul li { - margin: 0px; - padding: 0px 15px; + margin: 0px; + padding: 0px 15px; } #article-container .aplayer ol li::before, #article-container .aplayer ul li::before { - content: none; + content: none; } #article-container .btn-center { - margin: 0px 0px 1rem; - text-align: center; + margin: 0px 0px 1rem; + text-align: center; } #article-container .btn-beautify { - display: inline-block; - margin: 0px 0.2rem 0.3rem; - padding: 0px 1rem; - background-color: rgb(119, 119, 119); - color: rgb(255, 255, 255); - line-height: 2; + display: inline-block; + margin: 0px 0.2rem 0.3rem; + padding: 0px 1rem; + background-color: rgb(119, 119, 119); + color: rgb(255, 255, 255); + line-height: 2; } -#article-container .btn-beautify i + span { - margin-left: 0.3rem; +#article-container .btn-beautify i+span { + margin-left: 0.3rem; } -#article-container .btn-beautify:not(.block) + .btn-beautify:not(.block) { - margin: 0px 0.2rem 1rem; +#article-container .btn-beautify:not(.block)+.btn-beautify:not(.block) { + margin: 0px 0.2rem 1rem; } #article-container .btn-beautify.block { - display: block; - margin: 0px 0px 1rem; - width: fit-content; + display: block; + margin: 0px 0px 1rem; + width: fit-content; } #article-container .btn-beautify.block.center { - margin: 0px auto 1rem; + margin: 0px auto 1rem; } #article-container .btn-beautify.block.right { - margin: 0px 0px 1rem auto; + margin: 0px 0px 1rem auto; } #article-container .btn-beautify.larger { - padding: 0.3rem 1.3rem; + padding: 0.3rem 1.3rem; } #article-container .btn-beautify:hover { - text-decoration: none; + text-decoration: none; } #article-container .btn-beautify.blue { - background-color: rgb(66, 139, 202); + background-color: rgb(66, 139, 202); } #article-container .btn-beautify.pink { - background-color: rgb(255, 105, 180); + background-color: rgb(255, 105, 180); } #article-container .btn-beautify.red { - background-color: red; + background-color: red; } #article-container .btn-beautify.purple { - background-color: rgb(111, 66, 193); + background-color: rgb(111, 66, 193); } #article-container .btn-beautify.orange { - background-color: rgb(255, 140, 0); + background-color: rgb(255, 140, 0); } #article-container .btn-beautify.green { - background-color: rgb(92, 184, 92); + background-color: rgb(92, 184, 92); } #article-container .btn-beautify.outline { - border: 1px solid rgb(119, 119, 119); - background-color: transparent; - color: rgb(119, 119, 119); - transition: all 0.3s ease 0s; + border: 1px solid rgb(119, 119, 119); + background-color: transparent; + color: rgb(119, 119, 119); + transition: all 0.3s ease 0s; } #article-container .btn-beautify.outline.button--animated::before { - background: rgb(119, 119, 119); + background: rgb(119, 119, 119); } #article-container .btn-beautify.outline:hover { - color: rgb(255, 255, 255) !important; + color: rgb(255, 255, 255) !important; } #article-container .btn-beautify.outline.blue { - border-color: rgb(66, 139, 202); - color: rgb(66, 139, 202); + border-color: rgb(66, 139, 202); + color: rgb(66, 139, 202); } #article-container .btn-beautify.outline.blue.button--animated::before { - background: rgb(66, 139, 202); + background: rgb(66, 139, 202); } #article-container .btn-beautify.outline.pink { - border-color: rgb(255, 105, 180); - color: rgb(255, 105, 180); + border-color: rgb(255, 105, 180); + color: rgb(255, 105, 180); } #article-container .btn-beautify.outline.pink.button--animated::before { - background: rgb(255, 105, 180); + background: rgb(255, 105, 180); } #article-container .btn-beautify.outline.red { - border-color: red; - color: red; + border-color: red; + color: red; } #article-container .btn-beautify.outline.red.button--animated::before { - background: red; + background: red; } #article-container .btn-beautify.outline.purple { - border-color: rgb(111, 66, 193); - color: rgb(111, 66, 193); + border-color: rgb(111, 66, 193); + color: rgb(111, 66, 193); } #article-container .btn-beautify.outline.purple.button--animated::before { - background: rgb(111, 66, 193); + background: rgb(111, 66, 193); } #article-container .btn-beautify.outline.orange { - border-color: rgb(255, 140, 0); - color: rgb(255, 140, 0); + border-color: rgb(255, 140, 0); + color: rgb(255, 140, 0); } #article-container .btn-beautify.outline.orange.button--animated::before { - background: rgb(255, 140, 0); + background: rgb(255, 140, 0); } #article-container .btn-beautify.outline.green { - border-color: rgb(92, 184, 92); - color: rgb(92, 184, 92); + border-color: rgb(92, 184, 92); + color: rgb(92, 184, 92); } #article-container .btn-beautify.outline.green.button--animated::before { - background: rgb(92, 184, 92); + background: rgb(92, 184, 92); } .gallery-group { - width: calc(33.33% - 8px) !important; + width: calc(33.33% - 8px) !important; } figure.gallery-group { - position: relative; - float: left; - overflow: hidden; - margin: 6px 4px; - width: calc(50% - 8px); - height: 250px; - border-radius: 8px; - background: #000; - -webkit-transform: translate3d(0, 0, 0) + position: relative; + float: left; + overflow: hidden; + margin: 6px 4px; + width: calc(50% - 8px); + height: 250px; + border-radius: 8px; + background: #000; + -webkit-transform: translate3d(0, 0, 0) } @media screen and (max-width: 600px) { - figure.gallery-group { - width: calc(100% - 8px) - } + figure.gallery-group { + width: calc(100% - 8px) + } } figure.gallery-group:hover img { - opacity: .4; - -webkit-transform: translate3d(0, 0, 0); - -moz-transform: translate3d(0, 0, 0); - -o-transform: translate3d(0, 0, 0); - -ms-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0) + opacity: .4; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0) } figure.gallery-group:hover .gallery-group-name::after { - -webkit-transform: translate3d(0, 0, 0); - -moz-transform: translate3d(0, 0, 0); - -o-transform: translate3d(0, 0, 0); - -ms-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0) + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0) } -#aside-content .aside-list > .aside-list-item .content > .comment, -#aside-content .aside-list > .aside-list-item .content > .name, -#aside-content .aside-list > .aside-list-item .content > .title, +#aside-content .aside-list>.aside-list-item .content>.comment, +#aside-content .aside-list>.aside-list-item .content>.name, +#aside-content .aside-list>.aside-list-item .content>.title, #error-wrap .error-content .error-info .error_subtitle, -#post-info .post-title, #recent-posts > .recent-post-item > .recent-post-info > .article-title, -#recent-posts > .recent-post-item > .recent-post-info > .content, -.article-sort-item-title, .limit-more-line, -.relatedPosts > .relatedPosts-list .content .title, +#post-info .post-title, +#recent-posts>.recent-post-item>.recent-post-info>.article-title, +#recent-posts>.recent-post-item>.recent-post-info>.content, +.article-sort-item-title, +.limit-more-line, +.relatedPosts>.relatedPosts-list .content .title, figure.gallery-group .gallery-group-name, figure.gallery-group p { - display: -webkit-box; - overflow: hidden; - -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; } figure.gallery-group:hover p { - opacity: 1; - -ms-filter: none; - filter: none; - -webkit-transform: translate3d(0, 0, 0); - -moz-transform: translate3d(0, 0, 0); - -o-transform: translate3d(0, 0, 0); - -ms-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0) + opacity: 1; + -ms-filter: none; + filter: none; + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0) } figure.gallery-group img { - position: relative; - margin: 0; - max-width: none; - width: calc(100% + 20px); - height: 250px; - -webkit-backface-visibility: hidden; - -moz-backface-visibility: hidden; - -ms-backface-visibility: hidden; - backface-visibility: hidden; - opacity: .8; - -webkit-transition: all .3s, filter 375ms ease-in .2s; - -moz-transition: all .3s, filter 375ms ease-in .2s; - -o-transition: all .3s, filter 375ms ease-in .2s; - -ms-transition: all .3s, filter 375ms ease-in .2s; - transition: all .3s, filter 375ms ease-in .2s; - -webkit-transform: translate3d(-10px, 0, 0); - -moz-transform: translate3d(-10px, 0, 0); - -o-transform: translate3d(-10px, 0, 0); - -ms-transform: translate3d(-10px, 0, 0); - transform: translate3d(-10px, 0, 0); - object-fit: cover + position: relative; + margin: 0; + max-width: none; + width: calc(100% + 20px); + height: 250px; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; + opacity: .8; + -webkit-transition: all .3s, filter 375ms ease-in .2s; + -moz-transition: all .3s, filter 375ms ease-in .2s; + -o-transition: all .3s, filter 375ms ease-in .2s; + -ms-transition: all .3s, filter 375ms ease-in .2s; + transition: all .3s, filter 375ms ease-in .2s; + -webkit-transform: translate3d(-10px, 0, 0); + -moz-transform: translate3d(-10px, 0, 0); + -o-transform: translate3d(-10px, 0, 0); + -ms-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0); + object-fit: cover } figure.gallery-group figcaption { - position: absolute; - top: 0; - left: 0; - padding: 30px; - width: 100%; - height: 100%; - color: #fff; - text-transform: uppercase; - -webkit-backface-visibility: hidden; - -moz-backface-visibility: hidden; - -ms-backface-visibility: hidden; - backface-visibility: hidden + position: absolute; + top: 0; + left: 0; + padding: 30px; + width: 100%; + height: 100%; + color: #fff; + text-transform: uppercase; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden } -figure.gallery-group figcaption > a { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 1000; - opacity: 0 +figure.gallery-group figcaption>a { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1000; + opacity: 0 } figure.gallery-group p { - margin: 0; - padding: 8px 0 0; - letter-spacing: 1px; - font-size: 1.1em; - line-height: 1.5; - opacity: 0; - -webkit-transition: opacity .35s, -webkit-transform .35s; - -moz-transition: opacity .35s, -moz-transform .35s; - -o-transition: opacity .35s, -o-transform .35s; - -ms-transition: opacity .35s, -ms-transform .35s; - transition: opacity .35s, transform .35s; - -webkit-transform: translate3d(100%, 0, 0); - -moz-transform: translate3d(100%, 0, 0); - -o-transform: translate3d(100%, 0, 0); - -ms-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - -webkit-line-clamp: 4 + margin: 0; + padding: 8px 0 0; + letter-spacing: 1px; + font-size: 1.1em; + line-height: 1.5; + opacity: 0; + -webkit-transition: opacity .35s, -webkit-transform .35s; + -moz-transition: opacity .35s, -moz-transform .35s; + -o-transition: opacity .35s, -o-transform .35s; + -ms-transition: opacity .35s, -ms-transform .35s; + transition: opacity .35s, transform .35s; + -webkit-transform: translate3d(100%, 0, 0); + -moz-transform: translate3d(100%, 0, 0); + -o-transform: translate3d(100%, 0, 0); + -ms-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + -webkit-line-clamp: 4 } figure.gallery-group .gallery-group-name { - position: relative; - margin: 0; - padding: 8px 0; - font-weight: 700; - font-size: 1.65em; - line-height: 1.5; - -webkit-line-clamp: 2 + position: relative; + margin: 0; + padding: 8px 0; + font-weight: 700; + font-size: 1.65em; + line-height: 1.5; + -webkit-line-clamp: 2 } figure.gallery-group .gallery-group-name:after { - position: absolute; - bottom: 0; - left: 0; - width: 100%; - /* height: 2px; */ - background: #fff; - content: ''; - -webkit-transition: -webkit-transform .35s; - -moz-transition: -moz-transform .35s; - -o-transition: -o-transform .35s; - -ms-transition: -ms-transform .35s; - transition: transform .35s; - -webkit-transform: translate3d(-100%, 0, 0); - -moz-transform: translate3d(-100%, 0, 0); - -o-transform: translate3d(-100%, 0, 0); - -ms-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) + position: absolute; + bottom: 0; + left: 0; + width: 100%; + /* height: 2px; */ + background: #fff; + content: ''; + -webkit-transition: -webkit-transform .35s; + -moz-transition: -moz-transform .35s; + -o-transition: -o-transform .35s; + -ms-transition: -ms-transform .35s; + transition: transform .35s; + -webkit-transform: translate3d(-100%, 0, 0); + -moz-transform: translate3d(-100%, 0, 0); + -o-transform: translate3d(-100%, 0, 0); + -ms-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) } .gallery-group-main { - overflow: auto; - padding: 0 0 16px + overflow: auto; + padding: 0 0 16px } .justified-gallery { - margin: 0px 0px 0.8rem; + margin: 0px 0px 0.8rem; } .justified-gallery img { - opacity: 0; + opacity: 0; } .justified-gallery .img-alt { - display: none; + display: none; } .justified-gallery .fancybox { - width: auto; - text-align: inherit; + width: auto; + text-align: inherit; } blockquote.pullquote { - position: relative; - max-width: 45%; - font-size: 110%; + position: relative; + max-width: 45%; + font-size: 110%; } blockquote.pullquote.left { - float: left; - margin: 1em 0.5em 0px 0px; + float: left; + margin: 1em 0.5em 0px 0px; } blockquote.pullquote.right { - float: right; - margin: 1em 0px 0px 0.5rem; + float: right; + margin: 1em 0px 0px 0.5rem; } .video-container { - position: relative; - overflow: hidden; - margin-bottom: 0.8rem; - padding-top: 56.25%; - height: 0px; + position: relative; + overflow: hidden; + margin-bottom: 0.8rem; + padding-top: 56.25%; + height: 0px; } .video-container iframe { - position: absolute; - top: 0px; - left: 0px; - margin-top: 0px; - width: 100%; - height: 100%; + position: absolute; + top: 0px; + left: 0px; + margin-top: 0px; + width: 100%; + height: 100%; } -.hide-block > .hide-button, -.hide-inline > .hide-button { - display: inline-block; - padding: 0.3rem 1rem; - background: rgb(48, 122, 246); - color: var(--white); +.hide-block>.hide-button, +.hide-inline>.hide-button { + display: inline-block; + padding: 0.3rem 1rem; + background: rgb(48, 122, 246); + color: var(--white); } -.hide-block > .hide-button.open, -.hide-inline > .hide-button.open { - display: none; +.hide-block>.hide-button.open, +.hide-inline>.hide-button.open { + display: none; } -.hide-block > .hide-button.open + div, -.hide-inline > .hide-button.open + div { - display: block; +.hide-block>.hide-button.open+div, +.hide-inline>.hide-button.open+div { + display: block; } -.hide-block > .hide-button.open + span, -.hide-inline > .hide-button.open + span { - display: inline; +.hide-block>.hide-button.open+span, +.hide-inline>.hide-button.open+span { + display: inline; } -.hide-block > .hide-content, -.hide-inline > .hide-content { - display: none; +.hide-block>.hide-content, +.hide-inline>.hide-content { + display: none; } -.hide-inline > .hide-button { - margin: 0px 0.3rem; +.hide-inline>.hide-button { + margin: 0px 0.3rem; } -.hide-inline > .hide-content { - margin: 0px 0.3rem; +.hide-inline>.hide-content { + margin: 0px 0.3rem; } .hide-block { - margin: 0px 0px 0.8rem; + margin: 0px 0px 0.8rem; } .hide-toggle { - margin-bottom: 1rem; - border: 1px solid rgb(240, 240, 240); + margin-bottom: 1rem; + border: 1px solid rgb(240, 240, 240); } -.hide-toggle > .hide-button { - padding: 0.3rem 0.5rem; - background: rgb(240, 240, 240); - color: rgb(31, 45, 61); - cursor: pointer; +.hide-toggle>.hide-button { + padding: 0.3rem 0.5rem; + background: rgb(240, 240, 240); + color: rgb(31, 45, 61); + cursor: pointer; } -.hide-toggle > .hide-button > i { - font-size: 1.2em; - transition: all 0.3s ease 0s; +.hide-toggle>.hide-button>i { + font-size: 1.2em; + transition: all 0.3s ease 0s; } -.hide-toggle > .hide-button.open i { - transform: rotate(90deg); +.hide-toggle>.hide-button.open i { + transform: rotate(90deg); } -.hide-toggle > .hide-button.open + div { - display: block; +.hide-toggle>.hide-button.open+div { + display: block; } -.hide-toggle > .hide-content { - display: none; - margin: 1.5rem 1.2rem; +.hide-toggle>.hide-content { + display: none; + margin: 1.5rem 1.2rem; } #article-container .inline-img { - display: inline; - margin: 0px 3px; - height: 1.1em; - vertical-align: text-bottom; + display: inline; + margin: 0px 3px; + height: 1.1em; + vertical-align: text-bottom; } .hl-label { - padding: 2px 4px; - border-radius: 3px; - color: rgb(255, 255, 255); + padding: 2px 4px; + border-radius: 3px; + color: rgb(255, 255, 255); } .hl-label.default { - background-color: rgb(119, 119, 119); + background-color: rgb(119, 119, 119); } .hl-label.blue { - background-color: rgb(66, 139, 202); + background-color: rgb(66, 139, 202); } .hl-label.pink { - background-color: rgb(255, 105, 180); + background-color: rgb(255, 105, 180); } .hl-label.red { - background-color: red; + background-color: red; } .hl-label.purple { - background-color: rgb(111, 66, 193); + background-color: rgb(111, 66, 193); } .hl-label.orange { - background-color: rgb(255, 140, 0); + background-color: rgb(255, 140, 0); } .hl-label.green { - background-color: rgb(92, 184, 92); + background-color: rgb(92, 184, 92); } #article-container .tabs { - position: relative; - margin: 0px 0px 1rem; - border-right: 1px solid var(--tab-border-color); - border-bottom: 1px solid var(--tab-border-color); - border-left: 1px solid var(--tab-border-color); + position: relative; + margin: 0px 0px 1rem; + border-right: 1px solid var(--tab-border-color); + border-bottom: 1px solid var(--tab-border-color); + border-left: 1px solid var(--tab-border-color); } -#article-container .tabs > .nav-tabs { - display: flex; - flex-wrap: wrap; - margin: 0px; - padding: 0px; - background: var(--tab-botton-bg); +#article-container .tabs>.nav-tabs { + display: flex; + flex-wrap: wrap; + margin: 0px; + padding: 0px; + background: var(--tab-botton-bg); } -#article-container .tabs > .nav-tabs > .tab { - margin: 4px; - padding: 0px; - list-style: none; +#article-container .tabs>.nav-tabs>.tab { + margin: 4px; + padding: 0px; + list-style: none; } @media screen and (max-width: 768px) { - #article-container .tabs > .nav-tabs > .tab { - -webkit-box-flex: 1; - flex-grow: 1; - } + #article-container .tabs>.nav-tabs>.tab { + -webkit-box-flex: 1; + flex-grow: 1; + } } -#article-container .tabs > .nav-tabs > .tab button i { - width: 1.5em; +#article-container .tabs>.nav-tabs>.tab button i { + width: 1.5em; } -#article-container .tabs > .nav-tabs > .tab.active button { - border-top: 2px solid rgb(48, 122, 246); - background: var(--tab-button-active-bg); - cursor: default; +#article-container .tabs>.nav-tabs>.tab.active button { + border-top: 2px solid rgb(48, 122, 246); + background: var(--tab-button-active-bg); + cursor: default; } -#article-container .tabs > .nav-tabs > .tab:not(.active) button:hover { - border-top: 2px solid var(--tab-button-hover-bg); - background: var(--tab-button-hover-bg); +#article-container .tabs>.nav-tabs>.tab:not(.active) button:hover { + border-top: 2px solid var(--tab-button-hover-bg); + background: var(--tab-button-hover-bg); } -#article-container .tabs > .tab-contents .tab-item-content { - position: relative; - display: none; - padding: 1.8rem 1.2rem; - background: var(--heo-background); - border: var(--style-border-always); +#article-container .tabs>.tab-contents .tab-item-content { + position: relative; + display: none; + padding: 1.8rem 1.2rem; + background: var(--heo-background); + border: var(--style-border-always); } @media screen and (max-width: 768px) { - #article-container .tabs > .tab-contents .tab-item-content { - padding: 1.2rem 0.7rem; - } + #article-container .tabs>.tab-contents .tab-item-content { + padding: 1.2rem 0.7rem; + } } -#article-container .tabs > .tab-contents .tab-item-content.active { - display: block; - animation: 0.5s ease 0s 1 normal none running tabshow; +#article-container .tabs>.tab-contents .tab-item-content.active { + display: block; + animation: 0.5s ease 0s 1 normal none running tabshow; } #article-container .tabs .tab-to-top { - position: relative; - display: block; - margin: 16px 0px 0px auto; - color: rgb(153, 169, 191); + position: relative; + display: block; + margin: 16px 0px 0px auto; + color: rgb(153, 169, 191); } @-webkit-keyframes tabshow { - 0% { - transform: translateY(15px); - } + 0% { + transform: translateY(15px); + } - 100% { - transform: translateY(0px); - } + 100% { + transform: translateY(0px); + } } @keyframes tabshow { - 0% { - transform: translateY(15px); - } + 0% { + transform: translateY(15px); + } - 100% { - transform: translateY(0px); - } + 100% { + transform: translateY(0px); + } } [data-theme="dark"] { - --global-bg: #191919; - --font-color: rgba(255, 255, 255, 0.9); - --hr-border: rgba(255, 255, 255, 0.3); - --hr-before-color: rgba(255, 255, 255, 0.6); - --search-bg: #1e1e1e; - --search-input-color: rgba(255, 255, 255, 0.8); - --search-result-title: rgba(255, 255, 255, 0.1); - --preloader-bg: #1e1e1e; - --preloader-color: rgba(255, 255, 255, 0.6); - --tab-border-color: #2c2c2c; - --tab-botton-bg: #2c2c2c; - --tab-botton-color: #fff; - --tab-button-hover-bg: #444; - --tab-button-active-bg: #1e1e1e; - --card-bg: #1e1e1e; - --sidebar-bg: #1e1e1e; - --btn-hover-color: #848484; - --btn-color: #fff; - --btn-bg: #3f3f3f; - --text-bg-hover: #444; - --light-grey: #fff; - --white: #fff; - --text-highlight-color: #fff; - --blockquote-color: #fff; - --blockquote-bg: #2c2c2c; - --reward-pop: #2c2c2c; - --toc-link-color: rgba(255, 255, 255, 0.6); - --hl-color: rgba(255, 255, 255, 0.7); - --hl-bg: #171717; - --hltools-bg: #1a1a1a; - --hltools-color: #90a4ae; - --hlnumber-bg: #171717; - --hlnumber-color: rgba(255, 255, 255, 0.4); - --hlscrollbar-bg: #1f1f1f; - --hlexpand-bg: linear-gradient(180deg, rgba(23, 23, 23, 0.6), rgba(23, 23, 23, 0.9)); + --global-bg: #191919; + --font-color: rgba(255, 255, 255, 0.9); + --hr-border: rgba(255, 255, 255, 0.3); + --hr-before-color: rgba(255, 255, 255, 0.6); + --search-bg: #1e1e1e; + --search-input-color: rgba(255, 255, 255, 0.8); + --search-result-title: rgba(255, 255, 255, 0.1); + --preloader-bg: #1e1e1e; + --preloader-color: rgba(255, 255, 255, 0.6); + --tab-border-color: #2c2c2c; + --tab-botton-bg: #2c2c2c; + --tab-botton-color: #fff; + --tab-button-hover-bg: #444; + --tab-button-active-bg: #1e1e1e; + --card-bg: #1e1e1e; + --sidebar-bg: #1e1e1e; + --btn-hover-color: #848484; + --btn-color: #fff; + --btn-bg: #3f3f3f; + --text-bg-hover: #444; + --light-grey: #fff; + --white: #fff; + --text-highlight-color: #fff; + --blockquote-color: #fff; + --blockquote-bg: #2c2c2c; + --reward-pop: #2c2c2c; + --toc-link-color: rgba(255, 255, 255, 0.6); + --hl-color: rgba(255, 255, 255, 0.7); + --hl-bg: #171717; + --hltools-bg: #1a1a1a; + --hltools-color: #90a4ae; + --hlnumber-bg: #171717; + --hlnumber-color: rgba(255, 255, 255, 0.4); + --hlscrollbar-bg: #1f1f1f; + --hlexpand-bg: linear-gradient(180deg, rgba(23, 23, 23, 0.6), rgba(23, 23, 23, 0.9)); } -[data-theme="dark"] #article-container pre > code { - background: rgb(23, 23, 23); +[data-theme="dark"] #article-container pre>code { + background: rgb(23, 23, 23); } [data-theme="dark"] #article-container figure.highlight { - box-shadow: none; + box-shadow: none; } [data-theme="dark"] #article-container .note code { - background: rgba(27, 31, 35, 0.05); + background: rgba(27, 31, 35, 0.05); } [data-theme="dark"] #article-container .aplayer { - filter: brightness(0.8); + filter: brightness(0.8); } [data-theme="dark"] #article-container kbd { - border-color: rgb(105, 105, 105); - background-color: rgb(82, 82, 82); - color: rgb(226, 241, 255); + border-color: rgb(105, 105, 105); + background-color: rgb(82, 82, 82); + color: rgb(226, 241, 255); } -[data-theme="dark"] #page-header.nav-fixed > #nav, -[data-theme="dark"] #page-header.not-top-img > #nav { - /* background: rgba(18, 18, 18, 0.8); */ - box-shadow: rgba(133, 133, 133, 0) 0px 5px 6px -5px; +[data-theme="dark"] #page-header.nav-fixed>#nav, +[data-theme="dark"] #page-header.not-top-img>#nav { + /* background: rgba(18, 18, 18, 0.8); */ + box-shadow: rgba(133, 133, 133, 0) 0px 5px 6px -5px; } [data-theme="dark"] .note { - filter: brightness(0.8); + filter: brightness(0.8); } [data-theme="dark"] img { - filter: brightness(0.8); + filter: brightness(0.8); } -[data-theme="dark"] #aside-content .aside-list > .aside-list-item:not(:last-child) { - border-bottom: 1px dashed rgba(255, 255, 255, 0.1); +[data-theme="dark"] #aside-content .aside-list>.aside-list-item:not(:last-child) { + border-bottom: 1px dashed rgba(255, 255, 255, 0.1); } [data-theme="dark"] #gitalk-container { - filter: brightness(0.8); + filter: brightness(0.8); } [data-theme="dark"] #gitalk-container svg { - fill: rgba(255, 255, 255, 0.9) !important; + fill: rgba(255, 255, 255, 0.9) !important; } /* 全局 @@ -4600,79 +4604,79 @@ blockquote.pullquote.right { /* 最小网页大小 */ #page { - min-height: calc(100vh - 464px); + min-height: calc(100vh - 464px); } /* 滚动条 */ *::-webkit-scrollbar { - width: 6px; - height: 6px; + width: 6px; + height: 6px; } *::-webkit-scrollbar-thumb { - background: var(--heo-scrollbar); - border-radius: 8px; - cursor: pointer; + background: var(--heo-scrollbar); + border-radius: 8px; + cursor: pointer; } *::-webkit-scrollbar-thumb:hover { - background: var(--heo-main); - opacity: 1; - display: block !important; + background: var(--heo-main); + opacity: 1; + display: block !important; } *::-webkit-scrollbar-track { - background-color: var(--heo-none); + background-color: var(--heo-none); } html { - overflow-y: overlay; + overflow-y: overlay; } /* 网页最大宽度 */ .layout.hide-aside { - max-width: 1400px; + max-width: 1400px; } /* 深色模式图片 */ [data-theme="dark"] img { - filter: brightness(1); + filter: brightness(1); } /* 导航栏中的样式 */ #nav { - flex-wrap: nowrap; - justify-content: space-between; + flex-wrap: nowrap; + justify-content: space-between; } #nav .menus_items .menus_item .menus_item_child { - padding: 6px 4px 8px 4px; - border-radius: 100px; - background-color: var(--heo-card-bg); - box-shadow: var(--heo-shadow-black); - border: var(--style-border); - transition: 0.3s; - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px); - top: 35px; + padding: 6px 4px 8px 4px; + border-radius: 100px; + background-color: var(--heo-card-bg); + box-shadow: var(--heo-shadow-black); + border: var(--style-border); + transition: 0.3s; + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + top: 35px; } #nav .menus_items .menus_item .menus_item_child:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); } -#page-header.nav-fixed > #nav, -#page-header.not-top-img > #nav { - box-shadow: none; +#page-header.nav-fixed>#nav, +#page-header.not-top-img>#nav { + box-shadow: none; } #sidebar #sidebar-menus .menus_items .site-page span:hover { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } .site-page i.fa-chevron-down { - display: none; + display: none; } .fa, @@ -4687,17 +4691,16 @@ html { .fal, .far, .fas, -.fat -.iconfont { - line-height: 1; +.fat .iconfont { + line-height: 1; } #nav .menus_items .menus_item .menus_item_child:before { - top: -10px; + top: -10px; } -#nav .menus_items .menus_item .recursion_menus_item > .menus_item_child:before { - top: -20px; +#nav .menus_items .menus_item .recursion_menus_item>.menus_item_child:before { + top: -20px; } /* #menus > div.menus_items > div:nth-child(1) > ul{ @@ -4716,46 +4719,46 @@ html { right: -200px!important; } */ -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item:hover > a { - background: var(--heo-lighttext) !important; - color: var(--heo-card-bg) !important; - box-shadow: var(--heo-shadow-main); - margin: 0 auto; - transform: scale(1) !important; - padding: 0.3rem 0.5rem; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item:hover>a { + background: var(--heo-lighttext) !important; + color: var(--heo-card-bg) !important; + box-shadow: var(--heo-shadow-main); + margin: 0 auto; + transform: scale(1) !important; + padding: 0.3rem 0.5rem; } -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item a i:not(.fa-brands) { - font-size: 1rem; - margin-right: 8px; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item a i:not(.fa-brands) { + font-size: 1rem; + margin-right: 8px; } #nav .menus_items .menus_item { - padding: 0 0.4rem; - display: flex; - flex-direction: column; - align-items: center; - margin: auto; + padding: 0 0.4rem; + display: flex; + flex-direction: column; + align-items: center; + margin: auto; } -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item { - display: inline-flex; - list-style: none; - border-radius: 5px; - margin: 0 4px; - flex-direction: column; - align-items: center; - position: relative; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item { + display: inline-flex; + list-style: none; + border-radius: 5px; + margin: 0 4px; + flex-direction: column; + align-items: center; + position: relative; } /*---------竖向菜单--------*/ -#nav .menus_items .menus_item .menus_item_child.vertical_nav > .recursion_menus_item { - display: inline-flex; - list-style: none; - border-radius: 5px; - margin: 0 4px; - flex-direction: column; - align-items: center; +#nav .menus_items .menus_item .menus_item_child.vertical_nav>.recursion_menus_item { + display: inline-flex; + list-style: none; + border-radius: 5px; + margin: 0 4px; + flex-direction: column; + align-items: center; } /** @@ -4765,1215 +4768,1210 @@ html { /*-------本菜单竖向菜单时------*/ /* 第三级之后的菜单列 */ -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item > .menus_item_child.vertical_nav { - margin-top: 24px; - border-radius: 24px; - padding: 2px 0px; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item>.menus_item_child.vertical_nav { + margin-top: 24px; + border-radius: 24px; + padding: 2px 0px; } /* 第三级之后的菜单项 */ -#nav .menus_items .recursion_menus_item .menus_item_child.vertical_nav > .recursion_menus_item { - display: flex; - margin-top: 4px; - padding: 2px 0; +#nav .menus_items .recursion_menus_item .menus_item_child.vertical_nav>.recursion_menus_item { + display: flex; + margin-top: 4px; + padding: 2px 0; } /* 第三级之后的菜单项（第一个菜单项） */ -#nav .menus_items .recursion_menus_item .menus_item_child.vertical_nav > .recursion_menus_item:nth-child(1) { - margin-top: 0; +#nav .menus_items .recursion_menus_item .menus_item_child.vertical_nav>.recursion_menus_item:nth-child(1) { + margin-top: 0; } /*-------本菜单竖向菜单时END------*/ /*-------上级菜单为竖向菜单时------*/ /*第四级以后的菜单列*/ -#nav .menus_items .recursion_menus_item > .menus_item_child.vertical_nav > .recursion_menus_item > .menus_item_child { - position: absolute; - left: calc(100% + 12px); - top: 0; - margin-top: 0; +#nav .menus_items .recursion_menus_item>.menus_item_child.vertical_nav>.recursion_menus_item>.menus_item_child { + position: absolute; + left: calc(100% + 12px); + top: 0; + margin-top: 0; } -#nav .menus_items .recursion_menus_item > .menus_item_child.vertical_nav > .recursion_menus_item > .menus_item_child:before { - left: -20px; - height: 100%; - width: 30px; - top: 0; +#nav .menus_items .recursion_menus_item>.menus_item_child.vertical_nav>.recursion_menus_item>.menus_item_child:before { + left: -20px; + height: 100%; + width: 30px; + top: 0; } /*-------上级菜单为竖向菜单时END------*/ /* 导航栏按钮悬浮 */ #nav a { - border-radius: 8px; - color: var(--heo-white); + border-radius: 8px; + color: var(--heo-white); } .nav-fixed #nav a { - color: var(--heo-fontcolor); - transition: 0.3s; + color: var(--heo-fontcolor); + transition: 0.3s; } #assist-open a { - padding: 0; - pointer-events: none; + padding: 0; + pointer-events: none; } #assist-open { - transition: 0.3s; - border-radius: 40px; + transition: 0.3s; + border-radius: 40px; } #assist-open:hover { - color: var(--heo-white) !important; - background: var(--heo-white-op); + color: var(--heo-white) !important; + background: var(--heo-white-op); } #page-header.nav-fixed #assist-open:hover { - background: var(--heo-main); + background: var(--heo-main); } #page-header.nav-fixed #assist-open:hover i, .page #nav #assist-open.nav-button:hover i { - color: var(--heo-white); + color: var(--heo-white); } .page #nav #assist-open:hover { - background: var(--heo-main); + background: var(--heo-main); } .topbar-html { - background: #aeaeae !important; + background: #aeaeae !important; } /* 无障碍 */ @media screen and (max-width: 768px) { - #assist-open { - display: none; - } + #assist-open { + display: none; + } } #mozi-assist { - position: fixed; - z-index: 999; + position: fixed; + z-index: 999; } .topbar-html-content { - height: 160px !important; - align-items: flex-end; - padding-bottom: 12px; + height: 160px !important; + align-items: flex-end; + padding-bottom: 12px; } .topbar-html { - box-shadow: none !important; + box-shadow: none !important; } .bigtext-html-btn { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; } .topbar-html-content-item img { - border-radius: 12px !important; + border-radius: 12px !important; } /* 导航栏禁止隐藏 */ #page-header.nav-fixed #nav { - top: 0; - box-shadow: none; - background: var(--heo-card-bg); - outline: 1px solid var(--heo-card-border); + top: 0; + box-shadow: none; + background: var(--heo-card-bg); + outline: 1px solid var(--heo-card-border); } #nav { - padding: 0px; + padding: 0px; } #page-header #nav { - box-shadow: none; - transition: 0.3s; - display: flex; - justify-content: center; - z-index: 999 !important; - -webkit-user-select: none; + box-shadow: none; + transition: 0.3s; + display: flex; + justify-content: center; + z-index: 999 !important; + -webkit-user-select: none; } @media screen and (max-width: 768px) { - #nav { - padding: 0px; - } + #nav { + padding: 0px; + } - #page-header #nav { - background: linear-gradient(to top, var(--heo-main-none) 0%, var(--heo-main) 100%); - transition: 0s; - } + #page-header #nav { + background: linear-gradient(to top, var(--heo-main-none) 0%, var(--heo-main) 100%); + transition: 0s; + } } #page-header #nav #nav-group { - max-width: 1400px; - width: 100%; - display: flex; - position: relative; - padding: 0 1.5rem; - align-items: center; + max-width: 1400px; + width: 100%; + display: flex; + position: relative; + padding: 0 1.5rem; + align-items: center; } #page-header #nav #nav-right { - position: absolute; - right: 0; - z-index: 102; - display: flex; - flex-direction: row; - height: 100%; - align-items: center; - margin-right: 1.5rem; - /*overflow: hidden;*/ + position: absolute; + right: 0; + z-index: 102; + display: flex; + flex-direction: row; + height: 100%; + align-items: center; + margin-right: 1.5rem; + /*overflow: hidden;*/ } #page-header #nav #nav-left { - z-index: 102; - display: flex; - flex-direction: row; - height: 100%; - align-items: center; - margin-right: 1.5rem; - overflow: hidden; + z-index: 102; + display: flex; + flex-direction: row; + height: 100%; + align-items: center; + margin-right: 1.5rem; + overflow: hidden; } @media screen and (max-width: 1300px) { - #page-header #nav #nav-left { - display: none; - } + #page-header #nav #nav-left { + display: none; + } } .nav-button { - cursor: pointer; + cursor: pointer; } #page-header #nav #nav-right .nav-button a, #page-header #nav #nav-left .nav-button a { - height: 35px; - width: 35px; - display: flex; - align-items: center; - justify-content: center; - border-radius: 40px; + height: 35px; + width: 35px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 40px; } #page-header #nav #nav-right .nav-button a i, #page-header #nav #nav-left .nav-button a i { - line-height: 1; - font-size: 22px; + line-height: 1; + font-size: 22px; } #page-header #nav #nav-right div, #page-header #nav #nav-left div { - margin-left: 0.5rem; - padding: 0; - position: relative; + margin-left: 0.5rem; + padding: 0; + position: relative; } @media screen and (max-width: 768px) { - #nav #menus { - display: none !important; - } + #nav #menus { + display: none !important; + } - #nav.hide-menu #toggle-menu .site-page { - width: 35px; - height: 35px; - display: flex; - align-items: center; - justify-content: center; - } + #nav.hide-menu #toggle-menu .site-page { + width: 35px; + height: 35px; + display: flex; + align-items: center; + justify-content: center; + } - #page-header #nav #nav-group { - width: 100%; - display: flex; - position: relative; - padding: 0 12px; - } + #page-header #nav #nav-group { + width: 100%; + display: flex; + position: relative; + padding: 0 12px; + } - #page-header #nav #nav-right { - margin-right: 12px; - } + #page-header #nav #nav-right { + margin-right: 12px; + } } #nav.show { - transform: translate3d(0px, 0px, 0px) !important; - top: 0; - transition: 0.2s; - position: fixed; - z-index: 91; + transform: translate3d(0px, 0px, 0px) !important; + top: 0; + transition: 0.2s; + position: fixed; + z-index: 91; } #page-header.not-top-img #nav { - transition: 0.3s; - background: var(--heo-card-bg); + transition: 0.3s; + background: var(--heo-card-bg); } @media screen and (max-width: 768px) { - #page-header.not-top-img #nav { - background: var(--heo-card-bg) !important; - } + #page-header.not-top-img #nav { + background: var(--heo-card-bg) !important; + } - #page-header.not-top-img:not(.nav-fixed) #nav { - background: var(--heo-background) !important; - } + #page-header.not-top-img:not(.nav-fixed) #nav { + background: var(--heo-background) !important; + } - div#travellings_button { - display: none !important - } + div#travellings_button { + display: none !important + } - div#darkmode_button { - display: none !important - } + div#darkmode_button { + display: none !important + } } #page-header.not-top-img:not(.nav-fixed) #nav { - background: var(--heo-none); + background: var(--heo-none); } -#page-header.nav-fixed #nav #menus > div.menus_items { - transition: 0.3s; - height: 40px; - margin: auto 0; +#page-header.nav-fixed #nav #menus>div.menus_items { + transition: 0.3s; + height: 40px; + margin: auto 0; } #page-header.not-top-img { - margin-bottom: 0rem; + margin-bottom: 0rem; } #nav #toggle-menu { - padding: 0 0.4rem; + padding: 0 0.4rem; } /* 无顶图时导航栏间距 */ #page-header.no-top-img { - margin-bottom: 0rem; + margin-bottom: 0rem; } .layout { - padding: 1rem 1.5rem; + padding: 1rem 1.5rem; } @media screen and (min-width: 1300px) { - .layout { - display: flex; - justify-content: space-between; - padding: 1rem 1.5rem; - } + .layout { + display: flex; + justify-content: space-between; + padding: 1rem 1.5rem; + } } /* 导航栏logo */ #site-name .iconfont { - font-size: 20px; - font-weight: normal; - line-height: 48px; + font-size: 20px; + font-weight: normal; + line-height: 48px; } #site-logo { - width: 121px; + width: 121px; } #site-logo:hover { - transform: scale(1.03); + transform: scale(1.03); } /* 返回顶部 */ #nav-totop { - position: relative; - width: 35px; - height: 35px; - transition: 0.3s; - display: flex; - border-radius: 40px; - transition: all 0.3s ease-in-out; - align-items: center; + position: relative; + width: 35px; + height: 35px; + transition: 0.3s; + display: flex; + border-radius: 40px; + transition: all 0.3s ease-in-out; + align-items: center; } #nav-totop.long { - width: 70px; + width: 70px; } #nav-totop .totopbtn { - padding-top: 0; + padding-top: 0; } #nav-totop .totopbtn i { - position: absolute; - display: flex; - font-size: 0.8rem; - opacity: 0; + position: absolute; + display: flex; + font-size: 0.8rem; + opacity: 0; } #nav-totop:hover .totopbtn i { - opacity: 1; - color: var(--heo-card-bg); - transition: 0.3s; + opacity: 1; + color: var(--heo-card-bg); + transition: 0.3s; } #nav-totop #percent { - font-size: 12px; - border-radius: 35px; - display: flex; - justify-content: center; - align-items: center; - transition: 0.3s; - white-space: nowrap; + font-size: 12px; + border-radius: 35px; + display: flex; + justify-content: center; + align-items: center; + transition: 0.3s; + white-space: nowrap; } .nav-fixed #nav-totop #percent, .page #nav-totop #percent { - font-size: 12px; - border-radius: 35px; - display: flex; - justify-content: center; - align-items: center; - transition: 0.3s; - white-space: nowrap; + font-size: 12px; + border-radius: 35px; + display: flex; + justify-content: center; + align-items: center; + transition: 0.3s; + white-space: nowrap; } #page-header:not(.nav-fixed) #percent { - transition: 0.3s; + transition: 0.3s; } #page-header:not(.nav-fixed) #nav-totop { - width: 0; - transform: scale(0); - transition: 0.3s; - margin-left: 0 !important; - overflow: hidden; - transition: 0.3s ease-in; + width: 0; + transform: scale(0); + transition: 0.3s; + margin-left: 0 !important; + overflow: hidden; + transition: 0.3s ease-in; } #nav-totop:hover #percent { - opacity: 0; - font-weight: bold; + opacity: 0; + font-weight: bold; } #page-header #nav #nav-right .nav-button a.totopbtn { - width: 25px; - height: 25px; - border-radius: 40px; - background: var(--heo-fontcolor); - color: var(--card-bg); - position: absolute; - top: 5px; - right: 5px; - transition: 0.3s; + width: 25px; + height: 25px; + border-radius: 40px; + background: var(--heo-fontcolor); + color: var(--card-bg); + position: absolute; + top: 5px; + right: 5px; + transition: 0.3s; } #page-header #nav #nav-right .nav-button.long a.totopbtn { - width: 70px; + width: 70px; } #page-header #nav #nav-right .nav-button:hover a.totopbtn { - background: var(--heo-lighttext); + background: var(--heo-lighttext); } #page-header #nav #nav-right .nav-button:not(.long):hover a.totopbtn { - width: 35px; - height: 35px; - top: 0; - right: 0; + width: 35px; + height: 35px; + top: 0; + right: 0; } /* 登入按钮 */ #page-header #nav #nav-right div .back-menu-list-groups { - position: absolute; - right: 0; - left: auto; - top: 34px; + position: absolute; + right: auto; + left: auto; + top: 40px; + border: var(--style-border); } #page-header #nav #nav-right .console-button .nav-login { - width: 35px; - display: flex; - align-items: center; - justify-content: center; - border-radius: 40px; - margin-top: 4.8px; + width: 35px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 40px; + margin-top: 4.8px; } #page-header.not-top-img #nav .nav-login { - color: var(--heo-fontcolor); - text-shadow: none; + color: var(--heo-fontcolor); + text-shadow: none; } .console-button { - cursor: pointer; + cursor: pointer; } .console-button .back-menu-list-groups .back-menu-list { - display: block; - flex-direction: row; - flex-wrap: wrap; - width: 140px; - justify-content: space-between; + display: block; + flex-direction: row; + flex-wrap: wrap; + width: 115px; + justify-content: space-between; } .console-button .back-menu-list-group { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .console-button .back-menu-list-groups { - position: absolute; - top: 45px; - transform: scale(.8); - transform-origin: top left; - left: 1.8rem; - background-color: var(--heo-maskbgdeep); - border-radius: 7.8px; - /* border: var(--style-border); */ - flex-direction: column; - font-size: 12px; - color: var(--heo-secondtext); - box-shadow: var(--heo-shadow-border); - transition: .1s; - opacity: 0; - pointer-events: none; - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px) + position: absolute; + top: 45px; + transform: scale(.8); + transform-origin: top left; + left: 1.8rem; + background-color: var(--heo-maskbgdeep); + border-radius: 7.8px; + /* border: var(--style-border); */ + flex-direction: column; + font-size: 12px; + color: var(--heo-secondtext); + box-shadow: var(--heo-shadow-border); + transition: .1s; + opacity: 0; + pointer-events: none; + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px) } .console-button .back-menu-list-groups:hover { - /* border: var(--style-border-hover); */ + /* border: var(--style-border-hover); */ } .console-button .back-menu-list-group .back-menu-list-title { - margin: 8px 0 0 16px; - transition: 0.3s; + margin: 8px 0 0 16px; + transition: 0.3s; } .console-button .back-menu-list-group:hover .back-menu-list-title { - color: var(--heo-main); + color: var(--heo-main); } .console-button:hover .back-menu-list-groups { - display: flex; - opacity: 1; - transition: 0.3s; - top: 50px; - pointer-events: auto; - left: 1.8rem; - transform: scale(1); + display: flex; + opacity: 1; + transition: 0.3s; + top: 50px; + pointer-events: auto; + left: 1.8rem; + transform: scale(1); } @media screen and (max-width: 768px) { - .console-button .back-menu-list-groups { - left: 0; - } + .console-button .back-menu-list-groups { + left: 0; + } - .console-button:hover .back-menu-list-groups { - padding-bottom: 8px; - box-shadow: var(--heo-shadow-border); - left: 0; - } + .console-button:hover .back-menu-list-groups { + padding-bottom: 8px; + box-shadow: var(--heo-shadow-border); + left: 0; + } } /* 导航栏图标 */ #nav #site-name i { - font-size: 50px; - line-height: 35px; - padding: 0 12px; + font-size: 50px; + line-height: 35px; + padding: 0 12px; } .back-home-button { - display: flex; - width: 35px; - height: 35px; - padding: 0 !important; - align-items: center; - justify-content: center; - margin-right: 4px; - transition: 0.3s; - border-radius: 8px; - color: var(--heo-white); - border-radius: 40px; + display: flex; + width: 35px; + height: 35px; + padding: 0 !important; + align-items: center; + justify-content: center; + margin-right: 4px; + transition: 0.3s; + border-radius: 8px; + color: var(--heo-white); + border-radius: 40px; } .page .back-home-button { - color: var(--heo-fontcolor) + color: var(--heo-fontcolor) } .page .back-home-button:hover { - color: var(--heo-card-bg) + color: var(--heo-card-bg) } @media screen and (max-width: 768px) { - .back-home-button { - display: none; - } + .back-home-button { + display: none; + } } .nav-fixed #nav .back-home-button { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } #page-header.not-top-img #nav .back-home-button i { - font-size: 20px + font-size: 20px } .back-home-button:hover { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } .post .back-home-button:hover { - background: var(--heo-white-op); - color: var(--heo-white) + background: var(--heo-white-op); + color: var(--heo-white) } .nav-fixed #nav .back-home-button:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg) + background: var(--heo-lighttext); + color: var(--heo-card-bg) } .back-menu-list-groups .back-menu-list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - width: 340px; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + width: 340px; + justify-content: space-between; } .back-menu-list-groups .back-menu-list::before { - position: absolute; - top: -15px; - left: 0; - width: 100%; - height: 20px; - content: ''; + position: absolute; + top: -15px; + left: 0; + width: 100%; + height: 20px; + content: ''; } .back-menu-list-groups .back-menu-list .back-menu-item { - display: flex; - align-items: center; - margin: 4px 8px; - padding: 4px 8px !important; - transition: 0.3s; - border-radius: 8px; + display: flex; + align-items: center; + margin: 4px 8px; + padding: 4px 8px !important; + transition: 0.3s; + border-radius: 8px; } .back-menu-list-groups .back-menu-list .back-menu-item:hover { - background: var(--heo-lighttext) !important; - transform: scale(1) !important; + background: var(--heo-lighttext) !important; + transform: scale(1) !important; } .back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-icon { - width: 24px; - height: 24px; - border-radius: 8px; - background: var(--heo-none); + width: 24px; + height: 24px; + border-radius: 8px; + background: var(--heo-none); } .back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-text { - font-size: 16px; - margin-left: 0.5rem; - color: var(--heo-fontcolor); + font-size: 16px; + margin-left: 0.5rem; + color: var(--heo-fontcolor); } @media screen and (max-width: 768px) { - .back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-text { - font-size: 14px - } + .back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-text { + font-size: 14px + } } .back-menu-list-groups .back-menu-list .back-menu-item:hover .back-menu-item-text { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } .back-home-button .back-menu-list-group { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .back-home-button .back-menu-list-groups { - position: absolute; - top: 45px; - transform: scale(.8); - transform-origin: top left; - left: 1.5rem; - background-color: var(--heo-maskbgdeep); - border-radius: 12px; - border: var(--style-border); - flex-direction: column; - font-size: 12px; - color: var(--heo-secondtext); - box-shadow: var(--heo-shadow-border); - transition: .1s; - opacity: 0; - pointer-events: none; - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px) + position: absolute; + top: 45px; + transform: scale(.8); + transform-origin: top left; + left: 1.5rem; + background-color: var(--heo-maskbgdeep); + border-radius: 12px; + border: var(--style-border); + flex-direction: column; + font-size: 12px; + color: var(--heo-secondtext); + box-shadow: var(--heo-shadow-border); + transition: .1s; + opacity: 0; + pointer-events: none; + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + padding: 0 0 5px 0; } .back-home-button .back-menu-list-groups:hover { - border: var(--style-border-hover); + border: var(--style-border-hover); } .back-home-button .back-menu-list-group .back-menu-list-title { - margin: 8px 0 0 16px; - transition: 0.3s; + margin: 8px 0 0 16px; + transition: 0.3s; } .back-home-button .back-menu-list-group:hover .back-menu-list-title { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } .back-home-button:hover .back-menu-list-groups { - display: flex; - opacity: 1; - transition: 0.3s; - top: 55px; - pointer-events: auto; - left: 1.5rem; - transform: scale(1); + display: flex; + opacity: 1; + transition: 0.3s; + top: 55px; + pointer-events: auto; + left: 1.5rem; + transform: scale(1); } .back-home-button .back-menu-list .back-menu-item { - width: 150px; + width: 150px; } @media screen and (max-width: 768px) { - .back-home-button .back-menu-list-groups { - left: 0; - } + .back-home-button .back-menu-list-groups { + left: 0; + } - .back-home-button:hover .back-menu-list-groups { - padding-bottom: 8px; - box-shadow: var(--heo-shadow-border); - left: 0; - } + .back-home-button:hover .back-menu-list-groups { + padding-bottom: 8px; + box-shadow: var(--heo-shadow-border); + left: 0; + } } #nav #blog_name { - flex-wrap: nowrap; - height: 60px; - display: flex; - align-items: center; - z-index: 102; - transition: 0.3s; + flex-wrap: nowrap; + height: 60px; + display: flex; + align-items: center; + z-index: 102; + transition: 0.3s; } /* 导航栏文字 */ @media screen and (min-width: 900px) { - #nav #site-name { - opacity: 1; - transition: 0.3s; - overflow: hidden; - } + #nav #site-name { + opacity: 1; + transition: 0.3s; + overflow: hidden; + } - #nav #site-name i { - transition: 0.3s; - } + #nav #site-name i { + transition: 0.3s; + } - #nav #site-name:hover i { - opacity: 0; - transition: 0.3s; - } + #nav #site-name:hover i { + opacity: 0; + transition: 0.3s; + } - #nav #site-name span { - transition: 0.3s; - } + #nav #site-name span { + transition: 0.3s; + } - #nav #site-name:hover span { - opacity: 0; - transition: 0.3s; - } + #nav #site-name:hover span { + opacity: 0; + transition: 0.3s; + } - #page-header.nav-fixed #nav #site-name { - opacity: 1; - transition: 0.1s; - border-radius: 40px; - } + #page-header.nav-fixed #nav #site-name { + opacity: 1; + transition: 0.1s; + border-radius: 40px; + } - #page-header.nav-visible #nav #site-name { - opacity: 1; - transition: 0.1s; - } + #page-header.nav-visible #nav #site-name { + opacity: 1; + transition: 0.1s; + } - #nav #site-name:after { - opacity: 0; - position: absolute; - display: flex; - z-index: 1; - content: "\e69a"; - transition: .1s; - font-family: haofont !important; - align-items: center; - justify-content: center; - font-size: 22px; - line-height: 1 - } + #nav #site-name:after { + opacity: 0; + position: absolute; + display: flex; + z-index: 1; + content: "\e69a"; + transition: .1s; + font-family: haofont !important; + align-items: center; + justify-content: center; + font-size: 22px; + line-height: 1 + } - .post #nav #site-name:hover { - background: var(--heo-white-op); - color: var(--heo-white) - } + .post #nav #site-name:hover { + background: var(--heo-white-op); + color: var(--heo-white) + } - .nav-fixed #nav #site-name:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg) - } + .nav-fixed #nav #site-name:hover { + background: var(--heo-lighttext); + color: var(--heo-card-bg) + } - #nav #site-name:hover:after { - opacity: 1; - } + #nav #site-name:hover:after { + opacity: 1; + } - #nav .back-home-button:hover { - box-shadow: var(--heo-shadow-main); - } + #nav .back-home-button:hover { + box-shadow: var(--heo-shadow-main); + } - #nav #page-name-text { - display: inline; - font-weight: bold; - padding: 4px 8px; - opacity: 0; - transition: 0.1s; - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - position: relative; - text-align: center; - cursor: pointer; - top: 0; - font-size: 0.9rem; - animation-timing-function: ease-in; - -webkit-animation-timing-function: ease-in; - } + #nav #page-name-text { + display: inline; + font-weight: bold; + padding: 4px 8px; + opacity: 0; + transition: 0.1s; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + position: relative; + text-align: center; + cursor: pointer; + top: 0; + font-size: 0.9rem; + animation-timing-function: ease-in; + -webkit-animation-timing-function: ease-in; + } - #nav #page-name-text:hover { - color: var(--heo-main) !important; - background: var(--heo-none); - box-shadow: none; - } + #nav #page-name-text:hover { + color: var(--heo-main) !important; + background: var(--heo-none); + box-shadow: none; + } - #page-header.nav-fixed #nav #page-name-text { - display: inline; - opacity: 1; - transition: 0.3s; - line-height: 1; - border-radius: 100px; - min-width: 100px; - } + #page-header.nav-fixed #nav #page-name-text { + display: inline; + opacity: 1; + transition: 0.3s; + line-height: 1; + border-radius: 100px; + min-width: 100px; + } - #page-header.nav-fixed #nav #page-name-text:hover:after { - opacity: 1; - line-height: 36px; - } + #page-header.nav-fixed #nav #page-name-text:hover:after { + opacity: 1; + line-height: 36px; + } - #page-header.nav-fixed #nav #page-name-text:hover:after { - color: var(--heo-card-bg); - } + #page-header.nav-fixed #nav #page-name-text:hover:after { + color: var(--heo-card-bg); + } - #page-header.nav-fixed #nav div.menus_items { - transition: 0.15s; - position: relative; - top: -60px; - } + #page-header.nav-fixed #nav div.menus_items { + transition: 0.15s; + position: relative; + top: -60px; + } - #page-header.nav-fixed.nav-visible #nav #page-name-text { - display: inline; - transition: 0.15s; - } + #page-header.nav-fixed.nav-visible #nav #page-name-text { + display: inline; + transition: 0.15s; + } - #page-header.nav-fixed.nav-visible #nav div.menus_items { - opacity: 1; - transition: 0.15s; - position: relative; - top: 0px; - } + #page-header.nav-fixed.nav-visible #nav div.menus_items { + opacity: 1; + transition: 0.15s; + position: relative; + top: 0px; + } - #page-name { - align-items: center; - display: flex; - border-radius: 12px; - height: 40px; - position: absolute; - top: 62px; - left: 0px; - right: 0px; - margin: auto; - justify-content: center; - animation-timing-function: ease-out; - -webkit-animation-timing-function: ease-out; - } + #page-name { + align-items: center; + display: flex; + border-radius: 12px; + height: 40px; + position: absolute; + top: 62px; + left: 0px; + right: 0px; + margin: auto; + justify-content: center; + animation-timing-function: ease-out; + -webkit-animation-timing-function: ease-out; + } - #page-header.nav-fixed #nav #menus { - z-index: 100; - } + #page-header.nav-fixed #nav #menus { + z-index: 100; + } - #page-header.nav-fixed.nav-visible #nav #menus { - z-index: 101; - } + #page-header.nav-fixed.nav-visible #nav #menus { + z-index: 101; + } - #page-header.nav-fixed #page-name { - z-index: 101; - transition: 0.3s; - top: 10px; - } + #page-header.nav-fixed #page-name { + z-index: 101; + transition: 0.3s; + top: 10px; + } - #page-header.nav-fixed.nav-visible #page-name { - z-index: 100; - top: 62px; - transition: 0.3s; - } + #page-header.nav-fixed.nav-visible #page-name { + z-index: 100; + top: 62px; + transition: 0.3s; + } - #page-name-mask { - width: 100%; - height: 100%; - position: absolute; - overflow: hidden; - left: 0; - } + #page-name-mask { + width: 100%; + height: 100%; + position: absolute; + overflow: hidden; + left: 0; + } } @media screen and (max-width: 899px) { - #nav #page-name-mask { - display: none !important; - } + #nav #page-name-mask { + display: none !important; + } } /* 音乐播放器 */ .aplayer.aplayer-narrow .aplayer-body, .aplayer.aplayer-narrow .aplayer-pic { - height: 66px; - width: 66px; + height: 66px; + width: 66px; } /* 导航栏音乐 */ @media screen and (max-width: 1200px) { - #nav-music { - display: none !important; - } + #nav-music { + display: none !important; + } } #nav-music { - display: flex; - align-items: center; - z-index: 9; - position: fixed; - bottom: 20px; - left: 20px; - cursor: pointer; - transition: all 0.5s, left 0s; - transform-origin: left bottom; - box-shadow: var(--heo-shadow-border); - border-radius: 40px; - overflow: hidden; + display: flex; + align-items: center; + z-index: 9; + position: fixed; + bottom: 20px; + left: 20px; + cursor: pointer; + transition: all 0.5s, left 0s; + transform-origin: left bottom; + box-shadow: var(--heo-shadow-border); + border-radius: 40px; + overflow: hidden; } #nav-music:active { - transform: scale(0.97); + transform: scale(0.97); } #nav-music.playing { - border: var(--style-border); - box-shadow: 0 0px 12px -3px var(--heo-none); - animation: playingShadow 5s linear infinite; + border: var(--style-border); + box-shadow: 0 0px 12px -3px var(--heo-none); + animation: playingShadow 5s linear infinite; } @keyframes playingShadow { - 0% { - box-shadow: 0 0px 12px -3px var(--heo-none); - } + 0% { + box-shadow: 0 0px 12px -3px var(--heo-none); + } - 50% { - box-shadow: 0 0px 12px 0px var(--heo-main); - } + 50% { + box-shadow: 0 0px 12px 0px var(--heo-main); + } - 100% { - box-shadow: 0 0px 12px -3px var(--heo-none); - } + 100% { + box-shadow: 0 0px 12px -3px var(--heo-none); + } } #nav-music .aplayer.aplayer-withlrc .aplayer-pic { - height: 25px; - width: 25px; - border-radius: 40px; - z-index: 1; - transition: 0.3s; - transform: rotate(0deg) scale(1); - border: var(--style-border-always); - animation: changeright 24s linear infinite; - animation-play-state: paused; + height: 25px; + width: 25px; + border-radius: 40px; + z-index: 1; + transition: 0.3s; + transform: rotate(0deg) scale(1); + border: var(--style-border-always); + animation: changeright 24s linear infinite; + animation-play-state: paused; } #nav-music.playing .aplayer.aplayer-withlrc .aplayer-pic { - box-shadow: 0 0 14px #ffffffa6; - transform: rotate(0deg) scale(1.1); - border-color: var(--heo-white); - animation-play-state: running; + box-shadow: 0 0 14px #ffffffa6; + transform: rotate(0deg) scale(1.1); + border-color: var(--heo-white); + animation-play-state: running; } @keyframes changeright { - 0% { - transform: rotate(0deg) scale(1.1); - box-shadow: 0 0 2px #ffffff00; - } + 0% { + transform: rotate(0deg) scale(1.1); + box-shadow: 0 0 2px #ffffff00; + } - 25% { - transform: rotate(90deg) scale(1.1); - box-shadow: 0 0 14px #ffffff; - } + 25% { + transform: rotate(90deg) scale(1.1); + box-shadow: 0 0 14px #ffffff; + } - 50% { - transform: rotate(180deg) scale(1.1); - box-shadow: 0 0 2px #ffffff00; - } + 50% { + transform: rotate(180deg) scale(1.1); + box-shadow: 0 0 2px #ffffff00; + } - 75% { - transform: rotate(270deg) scale(1.1); - box-shadow: 0 0 14px #ffffff; - } + 75% { + transform: rotate(270deg) scale(1.1); + box-shadow: 0 0 14px #ffffff; + } - 100% { - transform: rotate(360deg) scale(1.1); - box-shadow: 0 0 2px #ffffff00; - } + 100% { + transform: rotate(360deg) scale(1.1); + box-shadow: 0 0 2px #ffffff00; + } } #nav-music .aplayer.aplayer-withlrc .aplayer-info { - height: 100%; - color: var(--heo-fontcolor); - margin: 0; - padding: 0; - display: flex; - align-items: center; + height: 100%; + color: var(--heo-fontcolor); + margin: 0; + padding: 0; + display: flex; + align-items: center; } #nav-music.playing .aplayer.aplayer-withlrc .aplayer-info { - color: var(--heo-white); + color: var(--heo-white); } #nav-music.playing #nav-music-hoverTips { - width: 0; - opacity: 0; + width: 0; + opacity: 0; } #nav-music #nav-music-hoverTips { - color: var(--heo-white); - background: var(--heo-main); - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; - align-items: center; - justify-content: center; - display: flex; - border-radius: 40px; - opacity: 0; - font-size: 12px; - z-index: 2; - transition: 0.3s; + color: var(--heo-white); + background: var(--heo-main); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + align-items: center; + justify-content: center; + display: flex; + border-radius: 40px; + opacity: 0; + font-size: 12px; + z-index: 2; + transition: 0.3s; } #nav-music:hover:not(.playing) #nav-music-hoverTips { - opacity: 1; + opacity: 1; } -#nav-music -.aplayer -.aplayer-info -.aplayer-controller -.aplayer-bar-wrap:hover -.aplayer-bar -.aplayer-played -.aplayer-thumb { - display: none; +#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap:hover .aplayer-bar .aplayer-played .aplayer-thumb { + display: none; } #nav-music .aplayer { - background: var(--card-bg); - border-radius: 60px; - height: 41px; - display: flex; - margin: 0; - transition: 0.3s; - border: var(--style-border); - box-shadow: none; + background: var(--card-bg); + border-radius: 60px; + height: 41px; + display: flex; + margin: 0; + transition: 0.3s; + border: var(--style-border); + box-shadow: none; } #nav-music.playing .aplayer { - background: var(--heo-main); - border: var(--style-border-hover); - backdrop-filter: saturate(180%) blur(20px); - backdrop-filter: blur(20px); - transform: translateZ(0); + background: var(--heo-main); + border: var(--style-border-hover); + backdrop-filter: saturate(180%) blur(20px); + backdrop-filter: blur(20px); + transform: translateZ(0); } #nav-music .aplayer .aplayer-notice { - display: none; + display: none; } #nav-music .aplayer .aplayer-miniswitcher { - display: none; + display: none; } #nav-music .aplayer .aplayer-body { - position: relative; - display: flex; - align-items: center; + position: relative; + display: flex; + align-items: center; } #nav-music .aplayer-list { - display: none; + display: none; } #nav-music .aplayer .aplayer-info .aplayer-music { - margin: 0; - display: flex; - align-items: center; - padding: 0 12px 0 8px; - cursor: pointer; - z-index: 1; - height: 100%; + margin: 0; + display: flex; + align-items: center; + padding: 0 12px 0 8px; + cursor: pointer; + z-index: 1; + height: 100%; } #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-time { - display: none; + display: none; } #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-author { - display: none; + display: none; } #nav-music .aplayer.aplayer-withlist .aplayer-info { - border: none; + border: none; } #nav-music .aplayer .aplayer-pic .aplayer-button { - bottom: 50%; - right: 50%; - transform: translate(50%, 50%); - margin: 0; - transition: 0.3s; + bottom: 50%; + right: 50%; + transform: translate(50%, 50%); + margin: 0; + transition: 0.3s; } #nav-music .aplayer .aplayer-pic:has(.aplayer-button.aplayer-play) { - animation-play-state: paused; - transform: rotate(0deg) scale(1) !important; + animation-play-state: paused; + transform: rotate(0deg) scale(1) !important; } #nav-music .aplayer.aplayer-withlrc .aplayer-pic { - margin-left: 8px; + margin-left: 8px; } #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-title { - cursor: pointer; - line-height: 1; - display: inline-block; - white-space: nowrap; - max-width: 120px; - overflow: hidden; - text-overflow: ellipsis; - transition: 0.3s; - user-select: none; + cursor: pointer; + line-height: 1; + display: inline-block; + white-space: nowrap; + max-width: 120px; + overflow: hidden; + text-overflow: ellipsis; + transition: 0.3s; + user-select: none; } #nav-music .aplayer .aplayer-info .aplayer-controller { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; } #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap { - margin: 0; - padding: 0; + margin: 0; + padding: 0; } #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar { - height: 100%; - background: 0 0; + height: 100%; + background: 0 0; } #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded { - display: none; + display: none; } #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played { - height: 100%; - opacity: 0.1; - background-color: var(--heo-white) !important; - animation: lightBar 5s ease infinite; - animation-play-state: paused; + height: 100%; + opacity: 0.1; + background-color: var(--heo-white) !important; + animation: lightBar 5s ease infinite; + animation-play-state: paused; } #nav-music.playing .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played { - animation-play-state: running; + animation-play-state: running; } @keyframes lightBar { - 0% { - opacity: 0.1; - } + 0% { + opacity: 0.1; + } - 60% { - opacity: 0.3; - } + 60% { + opacity: 0.3; + } - 100% { - opacity: 0.1; - } + 100% { + opacity: 0.1; + } } /* 歌词 */ #nav-music .aplayer.aplayer-withlrc .aplayer-lrc { - width: 0; - opacity: 0; - transition: 0.3s; - margin-top: -2px; - padding: 5px 0; + width: 0; + opacity: 0; + transition: 0.3s; + margin-top: -2px; + padding: 5px 0; } #nav-music.stretch .aplayer.aplayer-withlrc .aplayer-lrc { - width: 200px; - margin-left: 8px; - opacity: 1; + width: 200px; + margin-left: 8px; + opacity: 1; } #nav-music .aplayer .aplayer-lrc p.aplayer-lrc-current { - color: var(--heo-white); - border: none; - min-height: 20px; + color: var(--heo-white); + border: none; + min-height: 20px; } #nav-music .aplayer .aplayer-lrc:after, #nav-music .aplayer .aplayer-lrc:before { - display: none; + display: none; } #nav-music .aplayer .aplayer-lrc p { - color: #ffffffb3; - line-height: 40px !important; - height: 40px !important; - margin: 0px 0; - vertical-align: top; - /* display: inline-block; */ + color: #ffffffb3; + line-height: 40px !important; + height: 40px !important; + margin: 0px 0; + vertical-align: top; + /* display: inline-block; */ } #nav-music .aplayer .aplayer-pic { - pointer-events: none; + pointer-events: none; } #nav-music .aplayer .aplayer-pic .aplayer-button { - pointer-events: all; + pointer-events: all; } /* 导航栏隐藏文字 */ @@ -5984,855 +5982,857 @@ html { /* 品牌图标放大 */ i.fab { - font-size: 20px; - vertical-align: middle; - margin-bottom: 4px; + font-size: 20px; + vertical-align: middle; + margin-bottom: 4px; } /* 去除header背景 */ #body-wrap .full_page:before { - background-color: var(--heo-none) !important; - transition: 0ms !important; + background-color: var(--heo-none) !important; + transition: 0ms !important; } .full_page #page-header:before { - display: none !important; + display: none !important; } /* 消息弹窗 */ .snackbar-container { - background: var(--heo-lighttext) !important; - color: var(--heo-card-bg) !important; - border-radius: 0 !important; - display: flex; - justify-content: center !important; - max-width: none !important; - min-width: 100% !important; - margin: 0px !important; - left: 0px !important; - height: 60px !important; - transform: none !important; + background: var(--heo-lighttext) !important; + color: var(--heo-card-bg) !important; + border-radius: 0 !important; + display: flex; + justify-content: center !important; + max-width: none !important; + min-width: 100% !important; + margin: 0px !important; + left: 0px !important; + height: 60px !important; + transform: none !important; } .snackbar-container p { - color: var(--heo-card-bg) !important; - font-weight: bold !important; - text-align: center !important; - font-size: 0.8rem !important; - display: flex !important; - justify-content: center !important; + color: var(--heo-card-bg) !important; + font-weight: bold !important; + text-align: center !important; + font-size: 0.8rem !important; + display: flex !important; + justify-content: center !important; } .snackbar-container .action { - color: var(--heo-card-bg) !important; - padding: 4px 6px !important; - font-weight: bold; - border-radius: 8px !important; - transition: 0.3s; - border: var(--style-border) !important; + color: var(--heo-card-bg) !important; + padding: 4px 6px !important; + font-weight: bold; + border-radius: 8px !important; + transition: 0.3s; + border: var(--style-border) !important; } .snackbar-container .action:hover { - color: var(--heo-lighttext) !important; - background: var(--heo-card-bg) !important + color: var(--heo-lighttext) !important; + background: var(--heo-card-bg) !important } .snackbar-container::after { - position: absolute; - width: 0; - height: 100%; - left: 0; - top: 0; - background: var(--heo-white); - opacity: 0.1; - content: ""; - animation: snackbar-progress var(--heo-snackbar-time) linear forwards; - pointer-events: none; + position: absolute; + width: 0; + height: 100%; + left: 0; + top: 0; + background: var(--heo-white); + opacity: 0.1; + content: ""; + animation: snackbar-progress var(--heo-snackbar-time) linear forwards; + pointer-events: none; } @keyframes snackbar-progress { - from { - width: 0; - } + from { + width: 0; + } - to { - width: 100%; - } + to { + width: 100%; + } } /* 导航栏按钮 */ #nav a { - transition: 0.3s; + transition: 0.3s; } #nav a:hover { - color: var(--heo-white); - background: var(--heo-white-op); - transition: 0.3s; + color: var(--heo-white); + background: var(--heo-white-op); + transition: 0.3s; } .page #nav a:hover { - color: var(--heo-card-bg) !important; - background: var(--heo-lighttext); - transition: 0.3s; - box-shadow: var(--heo-shadow-main); + color: var(--heo-card-bg) !important; + background: var(--heo-lighttext); + transition: 0.3s; + box-shadow: var(--heo-shadow-main); } .nav-fixed #nav a:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg); - transition: 0.3s; + background: var(--heo-lighttext); + color: var(--heo-card-bg); + transition: 0.3s; } @media screen and (min-width: 768px) { - .menus_item:hover > a.site-page { - color: var(--heo-card-bg); - background: var(--heo-white-op); - transition: 0.3s; - box-shadow: var(--heo-shadow-main); - } + .menus_item:hover>a.site-page { + color: var(--heo-card-bg); + background: var(--heo-white-op); + transition: 0.3s; + box-shadow: var(--heo-shadow-main); + } - .page .menus_item:hover > a.site-page { - color: var(--heo-card-bg); - background: var(--heo-main); - transition: 0.3s; - box-shadow: var(--heo-shadow-main); - } + .page .menus_item:hover>a.site-page { + color: var(--heo-card-bg); + background: var(--heo-main); + transition: 0.3s; + box-shadow: var(--heo-shadow-main); + } - .nav-fixed .menus_item:hover > a.site-page { - background-color: var(--heo-lighttext); - } + .nav-fixed .menus_item:hover>a.site-page { + background-color: var(--heo-lighttext); + } } @media screen and (max-width: 768px) { - #sidebar #sidebar-menus .menus_items li .site-page:hover { - background: var(--heo-main); - color: var(--heo-white); - } + #sidebar #sidebar-menus .menus_items li .site-page:hover { + background: var(--heo-main); + color: var(--heo-white); + } - #sidebar #sidebar-menus .menus_items li .site-page span:hover { - color: var(--heo-white); - } + #sidebar #sidebar-menus .menus_items li .site-page span:hover { + color: var(--heo-white); + } } .nav-fixed #nav #site-name i { - color: var(--heo-fontcolor); - transition: 0.3s; + color: var(--heo-fontcolor); + transition: 0.3s; } #nav #site-name:hover i { - color: var(--heo-white); + color: var(--heo-white); } /* footer样式 */ #footer-wrap { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } #footer-wrap a { - color: var(--heo-fontcolor); - height: 44px; - line-height: 36px; + color: var(--heo-fontcolor); + height: 44px; + line-height: 36px; } #footer-wrap a:hover { - color: var(--heo-hovertext); - background-color: var(--heo-none); + color: var(--heo-hovertext); + background-color: var(--heo-none); } div#footer_deal { - justify-content: center; - display: flex; - padding-top: 2rem; - align-items: center; + justify-content: center; + display: flex; + padding-top: 2rem; + align-items: center; } /* 古诗词卡片 */ #card-poem { - display: flex; - flex-direction: column; - padding: 0.5rem !important; - min-height: 130px; + display: flex; + flex-direction: column; + padding: 0.5rem !important; + min-height: 130px; } div#poem_sentence { - text-align: center; - font-family: serif, cursive; - line-height: 1.4; - margin-bottom: 0.5rem; - padding: 1rem; - border-radius: 12px; - background: var(--heo-secondbg); - min-height: 62px; + text-align: center; + font-family: serif, cursive; + line-height: 1.4; + margin-bottom: 0.5rem; + padding: 1rem; + border-radius: 12px; + background: var(--heo-secondbg); + min-height: 62px; } div#poem_info { - display: flex; - color: var(--heo-secondtext); - font-size: 0.5rem; - justify-content: center; - flex-wrap: wrap; + display: flex; + color: var(--heo-secondtext); + font-size: 0.5rem; + justify-content: center; + flex-wrap: wrap; } div#poem_author { - order: 1; - padding: 2px; - margin-left: 8px; + order: 1; + padding: 2px; + margin-left: 8px; } div#poem_dynasty { - order: 0; - padding: 2px 4px 2px 6px; - background: var(--heo-card-btn-bg); - color: var(--heo-fontcolor); - border-radius: 8px; + order: 0; + padding: 2px 4px 2px 6px; + background: var(--heo-card-btn-bg); + color: var(--heo-fontcolor); + border-radius: 8px; } @media screen and (max-width: 768px) { - img.footer_mini_logo { - display: none; - } + img.footer_mini_logo { + display: none; + } - div#footer_deal { - flex-wrap: wrap; - flex-direction: row; - } + div#footer_deal { + flex-wrap: wrap; + flex-direction: row; + } } a.deal_link { - display: flex; - margin: 1rem 27px; - color: var(--heo-card-bg); - border-radius: 3rem; - width: 32px; - height: 32px; - background: var(--heo-fontcolor); - justify-content: center; - align-items: center; - transition: 0.3s; + display: flex; + margin: 1rem 27px; + color: var(--heo-card-bg); + border-radius: 3rem; + width: 32px; + height: 32px; + background: var(--heo-fontcolor); + justify-content: center; + align-items: center; + transition: 0.3s; } a.deal_link:hover { - color: var(--heo-card-bg); - background: var(--heo-main); - transform: scale(1.1) + color: var(--heo-card-bg); + background: var(--heo-main); + transform: scale(1.1) } a.custom_socials { - display: flex; - margin: 1rem 27px; - border-radius: 3rem; - width: 32px; - height: 32px; - justify-content: center; - align-items: center; - transition: 0.3s; + display: flex; + margin: 1rem 27px; + border-radius: 3rem; + width: 32px; + height: 32px; + justify-content: center; + align-items: center; + transition: 0.3s; } a.custom_socials:hover { - transform: scale(1.1) + transform: scale(1.1) } img.footer_mini_logo { - width: 50px; - height: 50px; - margin: 0 1rem; - cursor: pointer; - transition: cubic-bezier(0, 0, 0, 1.29) .5s; + width: 50px; + height: 50px; + margin: 0 1rem; + cursor: pointer; + transition: cubic-bezier(0, 0, 0, 1.29) .5s; } img.footer_mini_logo:hover { - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; - transform: scale(1.2) + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; + transform: scale(1.2) } /* logo居中 */ #weblogo { - align-self: center; + align-self: center; } #footer-wrap a#heoblog_footerlogo:hover { - background: var(--heo-none); + background: var(--heo-none); } .heoblog_footerlogo_img { - filter: drop-shadow(0 12px 12px #ee7d7936); + filter: drop-shadow(0 12px 12px #ee7d7936); } .heoblog_footerlogo_img:hover { - transform: scale(1.03); + transform: scale(1.03); } /* 导航栏居中 */ #nav #menus { - display: flex; - justify-content: center; - width: 100%; - position: absolute; - height: 60px; - left: 0; - margin: 0; + display: flex; + justify-content: center; + width: 100%; + position: absolute; + height: 60px; + left: 0; + margin: 0; } #nav .menus_items { - position: relative; - width: fit-content; - text-align: center; - left: 0px; - right: 0px; - top: 0px; - display: flex; - flex-direction: row; - justify-content: center; + position: relative; + width: fit-content; + text-align: center; + left: 0px; + right: 0px; + top: 0px; + display: flex; + flex-direction: row; + justify-content: center; } -#menus > div.menus_items > div > a { - letter-spacing: 0.3rem; - padding-left: 0.7rem; - font-weight: bold; - padding-top: 0; - padding-bottom: 0; - height: 35px; - line-height: 35px; - border-radius: 40px; +#menus>div.menus_items>div>a { + letter-spacing: 0.3rem; + padding-left: 0.7rem; + font-weight: bold; + padding-top: 0; + padding-bottom: 0; + height: 35px; + line-height: 35px; + border-radius: 40px; } -.page #menus > div.menus_items > .menus_item:hover > a { - color: var(--heo-card-bg) !important; +.page #menus>div.menus_items>.menus_item:hover>a { + color: var(--heo-card-bg) !important; } -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item > a { - letter-spacing: 0rem; - display: flex; - align-items: center; - border-radius: 100px; - padding: 0.2rem 0.5rem; - width: 100%; - color: var(--heo-fontcolor) !important; - text-shadow: none !important; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item>a { + letter-spacing: 0rem; + display: flex; + align-items: center; + border-radius: 100px; + padding: 0.2rem 0.5rem; + width: 100%; + color: var(--heo-fontcolor) !important; + text-shadow: none !important; } #page-header.nav-fixed #nav #menus[style*="padding-right: 300px;"] .menus_items { - transform: translateX(-150px); + transform: translateX(-150px); } /* 传送门 */ #travellings_button { - display: inline; - padding: 0 0.4rem; - transition: 0.3s; + display: inline; + padding: 0 0.4rem; + transition: 0.3s; } @media screen and (max-width: 768px) { - #page-header.nav-fixed #travellings_button { - opacity: 0; - } + #page-header.nav-fixed #travellings_button { + opacity: 0; + } - #page-header.nav-fixed #randomPost_button { - opacity: 0; - } + #page-header.nav-fixed #randomPost_button { + opacity: 0; + } } /* rightMenu右键菜单 */ #rightMenu { - display: none; - position: fixed; - padding: 0 0.25rem; - width: 9rem; - height: fit-content; - top: 10%; - left: 10%; - background-color: var(--heo-maskbgdeep); - -webkit-backdrop-filter: blur(20px); - backdrop-filter: blur(20px); - color: var(--heo-fontcolor); - border-radius: 12px; - z-index: 99994; - border: var(--style-border); - user-select: none; - box-shadow: var(--heo-shadow-black); + display: none; + position: fixed; + padding: 0 0.25rem; + width: 9rem; + height: fit-content; + top: 10%; + left: 10%; + background-color: var(--heo-maskbgdeep); + -webkit-backdrop-filter: blur(20px); + backdrop-filter: blur(20px); + color: var(--heo-fontcolor); + border-radius: 12px; + z-index: 99994; + border: var(--style-border); + user-select: none; + box-shadow: var(--heo-shadow-black); } #rightMenu:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-theme); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-theme); } #rightMenu .rightMenu-group { - padding: 0.35rem 0.3rem; - transition: 0.3s; + padding: 0.35rem 0.3rem; + transition: 0.3s; } #rightMenu .rightMenu-line { - border-top: 2px dashed var(--heo-theme-op); + border-top: 2px dashed var(--heo-theme-op); } #rightMenu .rightMenu-group.rightMenu-small { - display: flex; - justify-content: space-between; + display: flex; + justify-content: space-between; } #rightMenu .rightMenu-group .rightMenu-item { - border-radius: 8px; - transition: 0.3s; - cursor: pointer; + border-radius: 8px; + transition: 0.3s; + cursor: pointer; } #rightMenu .rightMenu-line .rightMenu-item { - margin: 0.25rem 0; - padding: 0.25rem 0; + margin: 0.25rem 0; + padding: 0.25rem 0; } #rightMenu .rightMenu-group.rightMenu-line .rightMenu-item { - display: flex; + display: flex; } #rightMenu .rightMenu-group .rightMenu-item:hover { - background-color: var(--heo-lighttext); - color: var(--heo-card-bg); - box-shadow: var(--heo-shadow-main); + background-color: var(--heo-lighttext); + color: var(--heo-card-bg); + box-shadow: var(--heo-shadow-main); } #rightMenu .rightMenu-group .rightMenu-item:active { - transform: scale(0.97); + transform: scale(0.97); } #rightMenu .rightMenu-group .rightMenu-item i { - display: inline-block; - text-align: center; - line-height: 1.5rem; - width: 1.5rem; - padding: 0 0.25rem; - font-size: 0.9rem; + display: inline-block; + text-align: center; + line-height: 1.5rem; + width: 1.5rem; + padding: 0 0.25rem; + font-size: 0.9rem; } #rightMenu .rightMenu-line .rightMenu-item i { - margin: 0 0.25rem; + margin: 0 0.25rem; } #rightMenu .rightMenu-group .rightMenu-item span { - line-height: 1.5rem; + line-height: 1.5rem; } .rightMenu-small .rightMenu-item { - width: 30px; - height: 30px; - line-height: 30px; + width: 30px; + height: 30px; + line-height: 30px; } #rightmenu-mask { - position: fixed; - width: 100vw; - height: 100vh; - background: none; - top: 0; - left: 0; - display: none; - z-index: 101; - margin: 0 !important; - z-index: 99993; + position: fixed; + width: 100vw; + height: 100vh; + background: none; + top: 0; + left: 0; + display: none; + z-index: 101; + margin: 0 !important; + z-index: 99993; } /* 深色模式切换 */ #darkmode_navswitch { - display: inline; - position: relative; + display: inline; + position: relative; } #darkmode_navswitch a i { - font-size: 0.9rem; + font-size: 0.9rem; } [data-theme=dark] #page-header.not-top-img #nav .darkmode_switchbutton { - color: var(--heo-yellow); + color: var(--heo-yellow); } a.darkmode_switchbutton { - padding: 4px 8px !important; - cursor: pointer; - margin: 0 !important; - font-size: 0.9rem; - color: var(--heo-fontcolor); + padding: 4px 8px !important; + cursor: pointer; + margin: 0 !important; + font-size: 0.9rem; + color: var(--heo-fontcolor); } [data-theme=dark] a.darkmode_switchbutton { - background: var(--heo-orange) !important; - color: var(--heo-white) !important; + background: var(--heo-orange) !important; + color: var(--heo-white) !important; } a.console_switchbutton { - padding: 4px 8px !important; - cursor: pointer; + padding: 4px 8px !important; + cursor: pointer; } @media screen and (max-width: 768px) { - #nav-console { - display: none; - } + #nav-console { + display: none; + } } /* 导航栏图标阴影 */ #nav .site-page { - text-shadow: 0.05rem 0.05rem 0.1rem rgba(0, 0, 0, 0); - border-radius: 8px; + text-shadow: 0.05rem 0.05rem 0.1rem rgba(0, 0, 0, 0); + border-radius: 8px; } #nav .site-page { - color: var(--heo-white); + color: var(--heo-white); } .nav-fixed #nav .site-page { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } .nav-fixed #nav .menus_item:hover .site-page { - color: var(--heo-card-bg) + color: var(--heo-card-bg) } .nav-fixed #nav .menus_item:hover li .site-page { - color: var(--heo-fontcolor) + color: var(--heo-fontcolor) } .post-bg #nav #site-name { - color: var(--heo-white); - transition: 0s; + color: var(--heo-white); + transition: 0s; } .nav-fixed #nav #site-name { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } /* 导航栏名称样式 */ #nav #site-name { - color: var(--heo-fontcolor); - padding: 0 8px; - transition: 0.3s; - display: flex; - height: 35px; - /* width: 75px; */ - justify-content: center; - align-items: center; - text-shadow: none; - border-radius: 40px; + color: var(--heo-fontcolor); + padding: 0 8px; + transition: 0.3s; + display: flex; + height: 35px; + /* width: 75px; */ + justify-content: center; + align-items: center; + text-shadow: none; + border-radius: 40px; } .page #nav #site-name { - color: var(--heo-white) + color: var(--heo-white) } .page #nav #site-name span { - color: var(--heo-fontcolor) + color: var(--heo-fontcolor) } body[data-type=music] .page #nav #site-name span { - color: var(--heo-white); + color: var(--heo-white); } @media screen and (max-width: 768px) { - .page #nav #site-name span:hover { - color: var(--heo-card-bg); - } + .page #nav #site-name span:hover { + color: var(--heo-card-bg); + } } /* 搜索 */ -#search-button > a > span { - display: none; +#search-button>a>span { + display: none; } /* 下拉图标 */ #nav .menus_items .menus_item i.expand { - display: none; + display: none; } /* 右下角设置按钮间距 */ #rightside { - position: fixed; - right: -48px; - bottom: 100px; - z-index: 100; - opacity: 0; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - -webkit-transition: all .5s; - -moz-transition: all .5s; - -o-transition: all .5s; - -ms-transition: all .5s; - transition: all .5s + position: fixed; + right: -48px; + bottom: 100px; + z-index: 100; + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + -webkit-transition: all .5s; + -moz-transition: all .5s; + -o-transition: all .5s; + -ms-transition: all .5s; + transition: all .5s } @media screen and (max-width: 768px) { - #rightside #switch-commentBarrage { - display: none - } + #rightside #switch-commentBarrage { + display: none + } } #rightside #rightside-config-hide { - height: 0; - opacity: 0; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - -webkit-transition: -webkit-transform .4s; - -moz-transition: -moz-transform .4s; - -o-transition: -o-transform .4s; - -ms-transition: -ms-transform .4s; - transition: transform .4s; - -webkit-transform: translate(45px, 0); - -moz-transform: translate(45px, 0); - -o-transform: translate(45px, 0); - -ms-transform: translate(45px, 0); - transform: translate(45px, 0) + height: 0; + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + -webkit-transition: -webkit-transform .4s; + -moz-transition: -moz-transform .4s; + -o-transition: -o-transform .4s; + -ms-transition: -ms-transform .4s; + transition: transform .4s; + -webkit-transform: translate(45px, 0); + -moz-transform: translate(45px, 0); + -o-transform: translate(45px, 0); + -ms-transform: translate(45px, 0); + transform: translate(45px, 0) } #rightside #rightside-config-hide.show { - height: auto; - opacity: 1; - -ms-filter: none; - filter: none; - -webkit-transform: translate(0, 0); - -moz-transform: translate(0, 0); - -o-transform: translate(0, 0); - -ms-transform: translate(0, 0); - transform: translate(0, 0) + height: auto; + opacity: 1; + -ms-filter: none; + filter: none; + -webkit-transform: translate(0, 0); + -moz-transform: translate(0, 0); + -o-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0) } #rightside #rightside-config-hide.status { - height: auto; - opacity: 1; - -ms-filter: none; - filter: none + height: auto; + opacity: 1; + -ms-filter: none; + filter: none } -#rightside > div > a, #rightside > div > button { - display: block; - margin-bottom: 5px; - width: 35px; - height: 35px; - border-radius: 5px; - background-color: var(--heo-main); - color: var(--btn-color); - text-align: center; - font-size: 16px; - line-height: 35px +#rightside>div>a, +#rightside>div>button { + display: block; + margin-bottom: 5px; + width: 35px; + height: 35px; + border-radius: 5px; + background-color: var(--heo-main); + color: var(--btn-color); + text-align: center; + font-size: 16px; + line-height: 35px } -#rightside > div > a:hover, #rightside > div > button:hover { - background-color: var(--btn-hover-color) +#rightside>div>a:hover, +#rightside>div>button:hover { + background-color: var(--btn-hover-color) } #rightside #mobile-toc-button { - display: none + display: none } @media screen and (max-width: 900px) { - #rightside #mobile-toc-button { - display: block - } + #rightside #mobile-toc-button { + display: block + } } @media screen and (max-width: 900px) { - #rightside #hide-aside-btn { - display: none - } + #rightside #hide-aside-btn { + display: none + } } .read-mode #rightside { - display: none !important + display: none !important } -#rightside > div > button { - border-radius: 5px +#rightside>div>button { + border-radius: 5px } /* footer背景色 */ #footer { - background: linear-gradient(180deg, var(--heo-card-bg-none) 0%, var(--heo-card-bg) 25%); - margin-top: 0.5rem; - display: flex; - flex-direction: column; - /* z-index: 1002; */ + background: linear-gradient(180deg, var(--heo-card-bg-none) 0%, var(--heo-card-bg) 25%); + margin-top: 0.5rem; + display: flex; + flex-direction: column; + /* z-index: 1002; */ } @media screen and (max-width: 768px) { - #footer { - background: linear-gradient(180deg, var(--heo-background) 0%, var(--heo-card-bg) 25%); - margin-top: 0; - z-index: 3; - } + #footer { + background: linear-gradient(180deg, var(--heo-background) 0%, var(--heo-card-bg) 25%); + margin-top: 0; + z-index: 3; + } } /* 搜索 */ #algolia-search .ais-hits--item.algolia-hit-item a { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } /* aplayer */ .aplayer .aplayer-list ol { - backdrop-filter: blur(1px); - -webkit-backdrop-filter: blur(1px); + backdrop-filter: blur(1px); + -webkit-backdrop-filter: blur(1px); } .aplayer .aplayer-lrc:after { - display: none !important; + display: none !important; } .aplayer.aplayer-withlrc.aplayer-withlist { - border-radius: 12px; + border-radius: 12px; } #article-container .aplayer { - border-radius: 12px; - min-height: 90px; - background: var(--heo-card-bg); - border: var(--style-border); - box-shadow: var(--heo-shadow-border); + border-radius: 12px; + min-height: 90px; + background: var(--heo-card-bg); + border: var(--style-border); + box-shadow: var(--heo-shadow-border); } #article-container.flink { - margin-top: 1rem; + margin-top: 1rem; } #article-container.flink h2 { - margin-top: 0.5rem; - margin-bottom: 0; + margin-top: 0.5rem; + margin-bottom: 0; } #algolia-hits .tag-list { - padding: 4px 8px; - border-radius: 8px; - margin-right: 0.5rem; - margin-top: 0.5rem; - border: var(--style-border-always); - cursor: pointer; + padding: 4px 8px; + border-radius: 8px; + margin-right: 0.5rem; + margin-top: 0.5rem; + border: var(--style-border-always); + cursor: pointer; } #algolia-hits .tag-list:hover { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } /* 手机端菜单背景 */ #mobile-sidebar #mobile-sidebar-menus.open { - background: var(--heo-maskbg); + background: var(--heo-maskbg); } -#aside-content .card-info .card-info-data > .card-info-data-item { - transition: .3s; +#aside-content .card-info .card-info-data>.card-info-data-item { + transition: .3s; } /* 手机端导航 */ #sidebar #sidebar-menus .site-data { - margin: 1rem 0; - padding: 0.6rem 0.5rem; + margin: 1rem 0; + padding: 0.6rem 0.5rem; } -#sidebar-menus > hr { - display: none; +#sidebar-menus>hr { + display: none; } /* 胶囊形状GitHub按钮 */ #card-info-btn { - border-radius: 25px; - overflow: hidden; + border-radius: 25px; + overflow: hidden; } #card-info-btn:before { - border-radius: 25px; + border-radius: 25px; } /* 搜索结果文字 */ #algolia-search .search-dialog .ais-hits--item.algolia-hit-item a { - color: var(--heo-fontcolor); - width: auto; - max-width: 100%; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; + color: var(--heo-fontcolor); + width: auto; + max-width: 100%; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } /* 其他页面封面移除 */ .not-index-bg { - height: 2rem !important; - background-image: none !important; - background-color: var(--heo-none) !important; + height: 2rem !important; + background-image: none !important; + background-color: var(--heo-none) !important; } .not-index-bg img { - display: none; + display: none; } .not-index-bg #page-site-info { - display: none; + display: none; } /* 进度条 */ .pace { - -webkit-pointer-events: none; - pointer-events: none; + -webkit-pointer-events: none; + pointer-events: none; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; - z-index: 2000; - position: fixed; - margin: auto; - top: 4px; - left: 0; - right: 0; - height: 8px; - border-radius: 8px; - width: 4rem; - background: var(--heo-secondbg); - border: var(--style-border); + z-index: 2000; + position: fixed; + margin: auto; + top: 4px; + left: 0; + right: 0; + height: 8px; + border-radius: 8px; + width: 4rem; + background: var(--heo-secondbg); + border: var(--style-border); - overflow: hidden; + overflow: hidden; } .pace-inactive .pace-progress { - /* display: none; */ - /* animation: 1s hidetip; */ - opacity: 0; - transition: 0.3s ease-in; + /* display: none; */ + /* animation: 1s hidetip; */ + opacity: 0; + transition: 0.3s ease-in; } .pace .pace-progress { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; - -webkit-transform: translate3d(0, 0, 0); - -moz-transform: translate3d(0, 0, 0); - -ms-transform: translate3d(0, 0, 0); - -o-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + -webkit-transform: translate3d(0, 0, 0); + -moz-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); - max-width: 200px; - position: fixed; - z-index: 2000; - display: block; - position: absolute; - top: 0; - right: 100%; - height: 100%; - width: 100%; - background: var(--heo-logo-color); - animation: gradient 2s ease infinite; - background-size: 200%; + max-width: 200px; + position: fixed; + z-index: 2000; + display: block; + position: absolute; + top: 0; + right: 100%; + height: 100%; + width: 100%; + background: var(--heo-logo-color); + animation: gradient 2s ease infinite; + background-size: 200%; } .pace.pace-inactive { - /* display: none; */ - opacity: 0; - transition: 0.3s; - top: -8px; + /* display: none; */ + opacity: 0; + transition: 0.3s; + top: -8px; } /* 进度条缓慢消失 */ @@ -6847,883 +6847,884 @@ body[data-type=music] .page #nav #site-name span { /* 文章页侧边栏固定位置 */ @media screen and (max-width: 1300px) { - #aside-content .sticky_layout { - top: 60px; - } + #aside-content .sticky_layout { + top: 60px; + } } @media screen and (min-width: 768px) { - #aside-content .sticky_layout { - margin-top: 1rem; - } + #aside-content .sticky_layout { + margin-top: 1rem; + } } /* 保证无card-widget时自动和左侧元素对齐 */ @media screen and (min-width: 1300px) { - #aside-content .sticky_layout { - margin-top: 0rem; - } + #aside-content .sticky_layout { + margin-top: 0rem; + } } /* 用 :has() 伪类判断card-widget是否存在，进行属性覆写 */ /* 若存在，表明需要和card-widget保持距离 */ @media screen and (min-width: 1300px) { - #aside-content:has(+.card-widget) { - #aside-content .sticky_layout { - margin-top: 1rem; - } - } + #aside-content:has(+.card-widget) { + #aside-content .sticky_layout { + margin-top: 1rem; + } + } } #aside-content .sticky_layout { - top: 80px; - transition: top 0s; + top: 80px; + transition: top 0s; } #aside-content .card-widget:hover { - box-shadow: var(--heo-shadow-border); + box-shadow: var(--heo-shadow-border); } #aside-content #card-funds { - margin-bottom: 1rem; - min-height: 260px; + margin-bottom: 1rem; + min-height: 260px; } -#page-header.nav-visible + .layout > .aside-content > .sticky_layout { - top: 80px; +#page-header.nav-visible+.layout>.aside-content>.sticky_layout { + top: 80px; } #aside-content { - width: 300px; + width: 300px; } @media screen and (max-width: 1300px) { - #aside-content { - width: 300px; - } + #aside-content { + width: 300px; + } } @media screen and (max-width: 1200px) { - #aside-content { - display: none - } + #aside-content { + display: none + } } /* 最新文章侧边栏 */ .card-widget.card-recent-post { - padding: 0.4rem 0.6rem !important; + padding: 0.4rem 0.6rem !important; } /* 最新文章侧边栏时间显示 */ -#aside-content .aside-list > .aside-list-item .content > time { - display: none; +#aside-content .aside-list>.aside-list-item .content>time { + display: none; } /* 最新文章侧边栏标题 */ -#aside-content .aside-list > .aside-list-item .content > .title { - -webkit-line-clamp: 3; - font-weight: bold; - padding: 2px 0; +#aside-content .aside-list>.aside-list-item .content>.title { + -webkit-line-clamp: 3; + font-weight: bold; + padding: 2px 0; } /* 最新文章侧边栏悬浮 */ -#aside-content .aside-list > .aside-list-item { - padding: 8px; - padding-top: 6px !important; - padding-bottom: 6px !important; - border-radius: 12px; - transition: 0.3s; - margin: 4px 0; - cursor: pointer; +#aside-content .aside-list>.aside-list-item { + padding: 8px; + padding-top: 6px !important; + padding-bottom: 6px !important; + border-radius: 12px; + transition: 0.3s; + margin: 4px 0; + cursor: pointer; } @media screen and (min-width: 1300px) { - #aside-content .aside-list > .aside-list-item:active { - transform: scale(0.97); - } + #aside-content .aside-list>.aside-list-item:active { + transform: scale(0.97); + } } -#aside-content .aside-list > .aside-list-item:hover .thumbnail > img { - transform: scale(1); +#aside-content .aside-list>.aside-list-item:hover .thumbnail>img { + transform: scale(1); } -#aside-content .aside-list > .aside-list-item:not(:last-child) { - border-bottom: 0px dashed var(--heo-background) !important; +#aside-content .aside-list>.aside-list-item:not(:last-child) { + border-bottom: 0px dashed var(--heo-background) !important; } -#aside-content .aside-list > .aside-list-item .thumbnail { - -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); - border-radius: 8px; - border: var(--style-border); +#aside-content .aside-list>.aside-list-item .thumbnail { + -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); + border-radius: 8px; + border: var(--style-border); } -#aside-content .aside-list > .aside-list-item:hover { - background: var(--heo-main); - color: var(--heo-white); - transition: 0.3s; - box-shadow: var(--heo-shadow-main); +#aside-content .aside-list>.aside-list-item:hover { + background: var(--heo-main); + color: var(--heo-white); + transition: 0.3s; + box-shadow: var(--heo-shadow-main); } -#aside-content .aside-list > .aside-list-item:hover a { - color: var(--heo-card-bg) !important; +#aside-content .aside-list>.aside-list-item:hover a { + color: var(--heo-card-bg) !important; } /* 文章顶部波浪效果 */ /* 波浪css */ .main-hero-waves-area { - width: 100%; - position: absolute; - left: 0; - bottom: -11px; - z-index: 5; + width: 100%; + position: absolute; + left: 0; + bottom: -11px; + z-index: 5; } .waves-area .waves-svg { - width: 100%; - height: 60px; + width: 100%; + height: 60px; } -.parallax > use { - animation: move-forever 30s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; +.parallax>use { + animation: move-forever 30s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; } -.parallax > use:nth-child(1) { - animation-delay: -2s; - animation-duration: 7s; - fill: var(--heo-background); - opacity: 0.5; +.parallax>use:nth-child(1) { + animation-delay: -2s; + animation-duration: 7s; + fill: var(--heo-background); + opacity: 0.5; } -.parallax > use:nth-child(2) { - animation-delay: -3s; - animation-duration: 10s; - fill: var(--heo-background); - opacity: 0.6; +.parallax>use:nth-child(2) { + animation-delay: -3s; + animation-duration: 10s; + fill: var(--heo-background); + opacity: 0.6; } -.parallax > use:nth-child(3) { - animation-delay: -4s; - animation-duration: 13s; - fill: var(--heo-background); - opacity: 0.7; +.parallax>use:nth-child(3) { + animation-delay: -4s; + animation-duration: 13s; + fill: var(--heo-background); + opacity: 0.7; } -.parallax > use:nth-child(4) { - animation-delay: -5s; - animation-duration: 20s; - fill: var(--heo-background); +.parallax>use:nth-child(4) { + animation-delay: -5s; + animation-duration: 20s; + fill: var(--heo-background); } @keyframes move-forever { - 0% { - transform: translate3d(-90px, 0, 0); - } - 100% { - transform: translate3d(85px, 0, 0); - } + 0% { + transform: translate3d(-90px, 0, 0); + } + + 100% { + transform: translate3d(85px, 0, 0); + } } /*Shrinking for mobile*/ @media (max-width: 768px) { - .main-hero-waves-area { - display: none; - } + .main-hero-waves-area { + display: none; + } } /* 侧边栏按钮文字 */ a.card-archive-list-link-more { - color: var(--heo-white) !important; - background: var(--heo-card-btn-bg); - margin-top: 8px; + color: var(--heo-white) !important; + background: var(--heo-card-btn-bg); + margin-top: 8px; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a { - border-radius: 8px; - margin: 4px 0; - display: flex; - flex-direction: column; - align-content: space-between; - border: var(--style-border); +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a { + border-radius: 8px; + margin: 4px 0; + display: flex; + flex-direction: column; + align-content: space-between; + border: var(--style-border); } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span:first-child, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span:first-child { - width: auto; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span:first-child, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span:first-child { + width: auto; } #aside-content .card-archives ul.card-archive-list, #aside-content .card-categories ul.card-category-list { - display: flex; - flex-direction: row; - justify-content: space-between; - flex-wrap: wrap; + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: wrap; } .card-allinfo hr { - display: flex; - position: relative; - margin: 1rem 0; - border: 1px dashed var(--heo-theme-op); + display: flex; + position: relative; + margin: 1rem 0; + border: 1px dashed var(--heo-theme-op); } .card-allinfo .item-headline { - display: none; + display: none; } span.card-archive-list-count { - width: auto; - text-align: left; - font-size: 1.1rem; - line-height: 0.9; - font-weight: bold; + width: auto; + text-align: left; + font-size: 1.1rem; + line-height: 0.9; + font-weight: bold; } .card-archive-list-count-group { - display: flex; - flex-direction: row; - align-items: baseline; + display: flex; + flex-direction: row; + align-items: baseline; } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a span:last-child, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a span:last-child { - width: fit-content; - margin-left: 4px; +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a span:last-child, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a span:last-child { + width: fit-content; + margin-left: 4px; } .card-archive-list-count-unit { - width: auto; - text-align: left; - font-size: 14px; - font-weight: bold; + width: auto; + text-align: left; + font-size: 14px; + font-weight: bold; } .card-archive-list-date { - font-size: 14px; - opacity: 0.6; + font-size: 14px; + opacity: 0.6; } li.card-archive-list-item { - width: 100%; - flex: 0 0 48%; + width: 100%; + flex: 0 0 48%; } .card-category-list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; } .card-category-list-item { - width: 45%; + width: 45%; } .card-category-list-count { - display: none !important; + display: none !important; } .card-category-list-name { - width: 100% !important; - text-align: center; + width: 100% !important; + text-align: center; } /* 侧边栏统计 */ .webinfo-item { - display: flex; - white-space: nowrap; + display: flex; + white-space: nowrap; } .webinfo-item-title { - display: flex; + display: flex; } .webinfo-item-title i { - line-height: 2; - margin-right: 6px; - width: 16px; - text-align: center; + line-height: 2; + margin-right: 6px; + width: 16px; + text-align: center; } /* 侧边栏配置 */ @media screen and (min-width: 1300px) { - #aside-content { - padding-left: 1rem; - animation: slide-in .6s .3s backwards - } + #aside-content { + padding-left: 1rem; + animation: slide-in .6s .3s backwards + } - #aside-content .sticky_layout { - top: calc(60px + 0.5rem); - /*margin-top: 1rem;*/ - } + #aside-content .sticky_layout { + top: calc(60px + 0.5rem); + /*margin-top: 1rem;*/ + } - #page-header.nav-visible + .layout > .aside-content > .sticky_layout { - top: calc(60px + 0.5rem); - } + #page-header.nav-visible+.layout>.aside-content>.sticky_layout { + top: calc(60px + 0.5rem); + } - [data-theme=dark] #aside-content > .card-widget.card-info { - border: var(--style-border); - } + [data-theme=dark] #aside-content>.card-widget.card-info { + border: var(--style-border); + } - .coverdiv { - height: 130%; - } + .coverdiv { + height: 130%; + } } /* madium-zoom */ .medium-zoom-overlay { - background: var(--heo-maskbg) !important; - z-index: 99998 !important; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); + background: var(--heo-maskbg) !important; + z-index: 99998 !important; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); } .medium-zoom-image--opened { - border-radius: 2px; + border-radius: 2px; } /* 通用 */ #toggle-sidebar { - bottom: 80px; + bottom: 80px; } /* 按钮样式 */ .button--animated { - border-radius: 8px !important; - transition: 0.3s; + border-radius: 8px !important; + transition: 0.3s; } #error-wrap .error-content .error-info a:hover { - background-color: var(--heo-blue); - transition: 0.3s; - box-shadow: var(--heo-shadow-blue); + background-color: var(--heo-blue); + transition: 0.3s; + box-shadow: var(--heo-shadow-blue); } .button--animated:before { - display: none; + display: none; } /* hexo-widget-tree 侧边文章导航 */ a.tree-list-post-link { - font-size: 0.8rem; - line-height: 1.2 !important; + font-size: 0.8rem; + line-height: 1.2 !important; } li.tree-list-item { - line-height: 1.9; - margin: 0.3rem 0; + line-height: 1.9; + margin: 0.3rem 0; } /* 通用标题 */ .title-h2-a { - display: flex; - align-items: center; - justify-content: space-between; - margin-top: 0.5rem; + display: flex; + align-items: center; + justify-content: space-between; + margin-top: 0.5rem; } .title-h2-a a { - margin-left: 0.5rem; - color: var(--heo-secondtext); - font-weight: bold; + margin-left: 0.5rem; + color: var(--heo-secondtext); + font-weight: bold; } .title-h2-a a:hover { - color: var(--heo-lighttext) + color: var(--heo-lighttext) } .title-h2-a-left { - display: flex; - align-items: center; + display: flex; + align-items: center; } .title-h2-a-left h2 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 !important; + margin-bottom: 0 !important; } /* 基金 */ #card-funds .funds-list::-webkit-scrollbar { - display: none !important; + display: none !important; } .funds-tips { - font-size: 0.5rem; - width: 100%; - text-align: center; - color: var(--heo-secondtext); - margin: 0.5rem 0 0 0; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - position: absolute; - bottom: 0.5rem; - left: 0px; - padding: 0 1rem; + font-size: 0.5rem; + width: 100%; + text-align: center; + color: var(--heo-secondtext); + margin: 0.5rem 0 0 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + position: absolute; + bottom: 0.5rem; + left: 0px; + padding: 0 1rem; } .funds-list { - height: 200px; - overflow: scroll; + height: 200px; + overflow: scroll; } span.fund_name { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .funds-info { - margin-left: 4px; - color: var(--heo-secondtext); + margin-left: 4px; + color: var(--heo-secondtext); } .funds-list-item .content { - display: flex; - flex-direction: row; - justify-content: space-between; - flex-wrap: nowrap; + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: nowrap; } .fund_dayGrowth { - display: inline; - float: right; + display: inline; + float: right; } .fund-up { - color: var(--heo-red); + color: var(--heo-red); } .fund-down { - color: var(--heo-green); + color: var(--heo-green); } /* 音乐宣传 */ #aside-content .card-widget#card-music { - background: var(--heo-pink); - display: flex; - justify-content: center; - align-content: center; - padding: 0; - cursor: pointer; - border: none; + background: var(--heo-pink); + display: flex; + justify-content: center; + align-content: center; + padding: 0; + cursor: pointer; + border: none; } #aside-content .card-widget#card-music img { - max-height: 110px; - object-fit: cover; + max-height: 110px; + object-fit: cover; } #aside-content .card-widget#card-music:hover img { - transform: scale(1.03); - transition: 0.5s; - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; + transform: scale(1.03); + transition: 0.5s; + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; } .music-link { - display: flex; - justify-content: center; - align-content: center; + display: flex; + justify-content: center; + align-content: center; } /* 友情链接 */ #aside-content .card-widget#card-friendlinks { - background: var(--heo-main); - display: flex; - justify-content: center; - align-content: center; - padding: 0; - cursor: pointer; - border: none; + background: var(--heo-main); + display: flex; + justify-content: center; + align-content: center; + padding: 0; + cursor: pointer; + border: none; } #aside-content .card-widget#card-friendlinks img { - max-height: 110px; - object-fit: cover; + max-height: 110px; + object-fit: cover; } #aside-content .card-widget#card-friendlinks:hover img { - transform: scale(1.03); - transition: 0.5s; - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; + transform: scale(1.03); + transition: 0.5s; + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; } .friend-link { - display: flex; - justify-content: center; - align-content: center; + display: flex; + justify-content: center; + align-content: center; } /* 微信公众号 */ #aside-content .card-widget#card-wechat { - background: #07C160; - display: flex; - justify-content: center; - align-content: center; - padding: 0; - cursor: pointer; - border: none; - height: 110px; + background: #07C160; + display: flex; + justify-content: center; + align-content: center; + padding: 0; + cursor: pointer; + border: none; + height: 110px; } #aside-content .card-widget#card-wechat img { - max-height: 110px; - object-fit: cover; + max-height: 110px; + object-fit: cover; } .friend-link { - display: flex; - justify-content: center; - align-content: center; + display: flex; + justify-content: center; + align-content: center; } /* 微信公众号翻转 */ #flip-wrapper { - position: relative; - width: 235px; - height: 110px; - z-index: 1; + position: relative; + width: 235px; + height: 110px; + z-index: 1; } /* this need to be here - i dont know why?*/ #flip-wrapper { - -webkit-perspective: 1000; - perspective: 1000; + -webkit-perspective: 1000; + perspective: 1000; } #flip-content { - width: 100%; - height: 100%; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; - transition: cubic-bezier(0, 0, 0, 1.29) 0.3s; + width: 100%; + height: 100%; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + transition: cubic-bezier(0, 0, 0, 1.29) 0.3s; } #flip-wrapper:hover #flip-content { - -webkit-transform: rotateY(180deg); - transform: rotateY(180deg); + -webkit-transform: rotateY(180deg); + transform: rotateY(180deg); } .face { - position: absolute; - width: 100%; - height: 100%; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - /* background-color: #e71840; */ - /*background: url(../images/wechat/wechat1.png) center center no-repeat;*/ - background-size: 100%; + position: absolute; + width: 100%; + height: 100%; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + /* background-color: #e71840; */ + /*background: url(../images/wechat/wechat1.png) center center no-repeat;*/ + background-size: 100%; } .back.face { - display: block; - -webkit-transform: rotateY(180deg); - transform: rotateY(180deg); - box-sizing: border-box; - /* background-color: #212121; */ - /*background: url(../images/wechat/wechat2.png) center center no-repeat;*/ - background-size: 100%; + display: block; + -webkit-transform: rotateY(180deg); + transform: rotateY(180deg); + box-sizing: border-box; + /* background-color: #212121; */ + /*background: url(../images/wechat/wechat2.png) center center no-repeat;*/ + background-size: 100%; } /* 爱发电赞助 */ #aside-content .card-widget.card-power { - padding: .4rem .6rem !important + padding: .4rem .6rem !important } #aside-content .card-widget.card-power .power-charge { - margin-left: auto; - color: var(--heo-secondtext); - font-size: 14px; - line-height: 1 + margin-left: auto; + color: var(--heo-secondtext); + font-size: 14px; + line-height: 1 } #aside-content .card-widget.card-power .power-charge:hover { - color: var(--heo-lighttext) + color: var(--heo-lighttext) } .power-list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - margin: 0 -4px + display: flex; + flex-direction: row; + flex-wrap: wrap; + margin: 0 -4px } .power-list .power-item .power-item-link a { - padding: 2px 4px; - border-radius: 4px; - margin-left: 8px + padding: 2px 4px; + border-radius: 4px; + margin-left: 8px } .power-list .power-item .power-item-link a:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg) + background: var(--heo-lighttext); + color: var(--heo-card-bg) } #aside-content .power-item-body { - display: flex; - flex-direction: row; - flex-wrap: wrap + display: flex; + flex-direction: row; + flex-wrap: wrap } #power-star-image { - width: 60px; - height: 60px; - border-radius: 50%; - background-size: cover; - margin-right: 12px; - border: var(--style-border-always); - transition: .3s ease-out + width: 60px; + height: 60px; + border-radius: 50%; + background-size: cover; + margin-right: 12px; + border: var(--style-border-always); + transition: .3s ease-out } a#power-star { - display: flex; - padding: 8px; - border: var(--style-border-always); - border-radius: 8px; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - position: relative; - margin: 12px 0; - background: var(--heo-secondbg); - transition: .3s ease-out + display: flex; + padding: 8px; + border: var(--style-border-always); + border-radius: 8px; + flex-direction: row; + flex-wrap: nowrap; + justify-content: flex-start; + position: relative; + margin: 12px 0; + background: var(--heo-secondbg); + transition: .3s ease-out } a#power-star:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg); - box-shadow: var(--heo-shadow-theme) + background: var(--heo-lighttext); + color: var(--heo-card-bg); + box-shadow: var(--heo-shadow-theme) } a#power-star:hover #power-star-image { - transform: scale(.9); + transform: scale(.9); } div#power-star-title { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-size: 16px; - font-weight: 700; - line-height: 1; - margin-bottom: 8px + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 16px; + font-weight: 700; + line-height: 1; + margin-bottom: 8px } #power-star-desc { - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - overflow: hidden; - font-size: 12px; - max-width: 100%; - line-height: 1.2 + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; + font-size: 12px; + max-width: 100%; + line-height: 1.2 } .power-star-body { - display: flex; - flex-direction: column; - align-items: flex-start; - flex-wrap: wrap; - position: relative; - width: calc(100% - 68px); - justify-content: center + display: flex; + flex-direction: column; + align-items: flex-start; + flex-wrap: wrap; + position: relative; + width: calc(100% - 68px); + justify-content: center } /* 商务广告-设计周刊 */ #card-vip-designweekly.card-widget { - display: flex !important; - padding: 0; - cursor: pointer; + display: flex !important; + padding: 0; + cursor: pointer; } #card-vip-designweekly.card-widget .card-vip-designweekly-img { - width: 100%; - object-fit: cover; + width: 100%; + object-fit: cover; } .card-vip-tips { - display: flex; - position: absolute; - font-size: 12px; - bottom: 8px; - left: 8px; - padding: 1px 6px; - background: var(--heo-black-op); - border-radius: 8px; - color: var(--heo-white); + display: flex; + position: absolute; + font-size: 12px; + bottom: 8px; + left: 8px; + padding: 1px 6px; + background: var(--heo-black-op); + border-radius: 8px; + color: var(--heo-white); } /* 开关 */ #widget-tree-button { - background-color: var(--heo-secondbg) !important; - box-shadow: var(--heo-shadow-light2black) !important; - color: var(--heo-fontcolor); + background-color: var(--heo-secondbg) !important; + box-shadow: var(--heo-shadow-light2black) !important; + color: var(--heo-fontcolor); } #widget-tree:hover #widget-tree-button { - /* display: none!important; */ - opacity: 0; - left: -1.5rem; + /* display: none!important; */ + opacity: 0; + left: -1.5rem; } #widget-tree { - background-color: var(--heo-maskbg) !important; + background-color: var(--heo-maskbg) !important; } #widget-tree:hover { - left: 0 !important; - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px); + left: 0 !important; + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); } #widget-tree a { - -webkit-line-clamp: 2; - color: var(--heo-fontcolor) !important; + -webkit-line-clamp: 2; + color: var(--heo-fontcolor) !important; } #widget-tree a:hover { - color: var(--heo-hovertext) !important; + color: var(--heo-hovertext) !important; } .toggle-post-icon, .toggle-toc-icon { - color: var(--heo-fontcolor) !important; + color: var(--heo-fontcolor) !important; } @media screen and (max-width: 768px) { - #widget-tree { - display: none !important; - } + #widget-tree { + display: none !important; + } } /* guli置顶 */ .guli_top { - position: fixed; - z-index: 99; - right: 30px; - display: flex; - transition: 0.3s; - opacity: 0; - bottom: -25px; - width: 88px; - height: 123px; - user-select: none; + position: fixed; + z-index: 99; + right: 30px; + display: flex; + transition: 0.3s; + opacity: 0; + bottom: -25px; + width: 88px; + height: 123px; + user-select: none; } .guli_top.guli-fixed { - opacity: 1; - bottom: 25px; + opacity: 1; + bottom: 25px; } #guli_top .guli_body { - position: relative; - height: 123px; - z-index: 1003; + position: relative; + height: 123px; + z-index: 1003; } #guli_top .guli_body:hover { - cursor: pointer; + cursor: pointer; } #guli_top .guli_wing { - position: relative; - height: 64px; - z-index: 1002; - bottom: -120px; - transform: scale(0.01); - box-shadow: var(--heo-shadow-yellow); + position: relative; + height: 64px; + z-index: 1002; + bottom: -120px; + transform: scale(0.01); + box-shadow: var(--heo-shadow-yellow); } #guli_top.open_wing .guli_wing { - transform: scale(1.03); + transform: scale(1.03); } #guli_top.open_wing .guli_body { - transform: scale(1); + transform: scale(1); } @media screen and (max-width: 1300px) { - #guli_top { - display: none; - } + #guli_top { + display: none; + } } /* cookies */ #cookies-window { - min-width: 300px; - background: var(--heo-maskbgdeep); - color: var(--heo-fontcolor); - padding: 8px 16px; - display: flex; - flex-direction: column; - bottom: 20px; - right: 20px; - position: fixed; - border-radius: 12px; - transition: 0.3s; - z-index: 1002; - user-select: none; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: saturate(180%) blur(20px); - transform: translateZ(0); - border: var(--style-border); - animation: barrageIn 0.6s cubic-bezier(0.42, 0, 0.3, 1.11); + min-width: 300px; + background: var(--heo-maskbgdeep); + color: var(--heo-fontcolor); + padding: 8px 16px; + display: flex; + flex-direction: column; + bottom: 20px; + right: 20px; + position: fixed; + border-radius: 12px; + transition: 0.3s; + z-index: 1002; + user-select: none; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: saturate(180%) blur(20px); + transform: translateZ(0); + border: var(--style-border); + animation: barrageIn 0.6s cubic-bezier(0.42, 0, 0.3, 1.11); } #cookies-window.cw-hide { - opacity: 0; - animation: barrageOut 0.6s cubic-bezier(0.42, 0, 0.3, 1.11); - z-index: -1; + opacity: 0; + animation: barrageOut 0.6s cubic-bezier(0.42, 0, 0.3, 1.11); + z-index: -1; } #cookies-window .cookies-window-title { - padding-bottom: 4px; - border-bottom: var(--style-border); - font-size: 12px; - font-weight: bold; + padding-bottom: 4px; + border-bottom: var(--style-border); + font-size: 12px; + font-weight: bold; } #cookies-window .cookies-window-content { - font-size: 14px; - display: flex; - justify-content: space-around; - align-items: center; + font-size: 14px; + display: flex; + justify-content: space-around; + align-items: center; } .cookie-to { - margin-right: 4px; - font-weight: bold; + margin-right: 4px; + font-weight: bold; } .cookies-link { - margin-left: auto; - font-size: 16px; + margin-left: auto; + font-size: 16px; } .cookies-link i.heofont { - font-size: 16px; + font-size: 16px; } @media screen and (max-width: 1300px) { - #cookies-window { - display: none; - } + #cookies-window { + display: none; + } } .heo-tag { - padding: 1px 6px; - border-radius: 6px 6px 6px 0; - margin-left: 4px; - height: 20px; - line-height: 19px; + padding: 1px 6px; + border-radius: 6px 6px 6px 0; + margin-left: 4px; + height: 20px; + line-height: 19px; } @@ -7735,2164 +7736,2183 @@ div#power-star-title { margin-top: 2em; } */ -.layout > div:first-child { - width: calc(100% - 300px); +.layout>div:first-child { + width: calc(100% - 300px); } /* 当隐藏边栏时，显示 100% */ -.layout.hide-aside > div:first-child { - width: 100%; +.layout.hide-aside>div:first-child { + width: 100%; } @media screen and (min-width: 1200px) { - /* 侧边栏在左侧时，显示 100% */ - .layout.left-aside > div:first-child { - -webkit-box-ordinal-group: 2; - -moz-box-ordinal-group: 2; - -o-box-ordinal-group: 2; - -ms-flex-order: 2; - -webkit-order: 2; - order: 2; - } - /* 侧栏在左侧时，关闭左边距，打开右边距 */ - .layout.left-aside .aside-content { - padding-right: 15px; - padding-left: 0px !important; - } + /* 侧边栏在左侧时，显示 100% */ + .layout.left-aside>div:first-child { + -webkit-box-ordinal-group: 2; + -moz-box-ordinal-group: 2; + -o-box-ordinal-group: 2; + -ms-flex-order: 2; + -webkit-order: 2; + order: 2; + } + + /* 侧栏在左侧时，关闭左边距，打开右边距 */ + .layout.left-aside .aside-content { + padding-right: 15px; + padding-left: 0px !important; + } } /* 主页分类 */ div#categoryList { - display: flex; - width: 100%; - justify-content: space-between; + display: flex; + width: 100%; + justify-content: space-between; } .categoryItem { - overflow: hidden; - transform: scale(1); - transition: all 0.8s cubic-bezier(0.65, 0.15, 0.37, 1.19); - height: 48%; - border-radius: 12px; + overflow: hidden; + transform: scale(1); + transition: all 0.8s cubic-bezier(0.65, 0.15, 0.37, 1.19); + height: 48%; + border-radius: 12px; } a.categoryButton { - height: 100%; - width: 100%; - background: var(--heo-card-bg); - border-radius: 12px; - display: inline-block; - text-align: left; - line-height: 4em; - font-weight: bold; - font-size: 0.9rem; - color: var(--heo-white); - transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); - transform: scale(1); - overflow: hidden; - font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei; + height: 100%; + width: 100%; + background: var(--heo-card-bg); + border-radius: 12px; + display: inline-block; + text-align: left; + line-height: 4em; + font-weight: bold; + font-size: 0.9rem; + color: var(--heo-white); + transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); + transform: scale(1); + overflow: hidden; + font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei; } a.categoryButton i { - transform: scale(1.0) rotate(15deg); + transform: scale(1.0) rotate(15deg); } a.categoryButton img { - transform: scale(1.0) rotate(15deg); + transform: scale(1.0) rotate(15deg); } @media screen and (min-width: 1300px) { - a.categoryButton:active { - transform: scale(0.97); - } + a.categoryButton:active { + transform: scale(0.97); + } } @media screen and (max-width: 768px) { - a.categoryButton { - border-radius: 8px; - } + a.categoryButton { + border-radius: 8px; + } - .categoryItem { - border-radius: 0px; - height: 47%; - box-shadow: none !important; - } + .categoryItem { + border-radius: 0px; + height: 47%; + box-shadow: none !important; + } } @media screen and (max-width: 1300px) { - .categoryItem-mobile { - display: none; - } + .categoryItem-mobile { + display: none; + } } a.categoryButton:after { - top: 50px; - width: 1rem; - left: 21px; - height: 2px; - background: var(--heo-white); - content: ""; - border-radius: 1px; - position: absolute; + top: 50px; + width: 1rem; + left: 21px; + height: 2px; + background: var(--heo-white); + content: ""; + border-radius: 1px; + position: absolute; } .categoryButtonText { - padding-left: 21px; + padding-left: 21px; } a.categoryButton i { - font-size: 5rem; - opacity: 0.2; - position: absolute; - right: 0%; - top: 20%; - transition: 0.3s; - width: 100px; - text-align: center; - filter: blur(2px); + font-size: 5rem; + opacity: 0.2; + position: absolute; + right: 0%; + top: 20%; + transition: 0.3s; + width: 100px; + text-align: center; + filter: blur(2px); } a.categoryButton img { - font-size: 5rem; - opacity: 0.2; - position: absolute; - right: 0%; - top: 20%; - transition: 0.3s; - width: 50px; - text-align: center; - filter: blur(2px); - margin-right: 1rem; + font-size: 5rem; + opacity: 0.2; + position: absolute; + right: 0%; + top: 20%; + transition: 0.3s; + width: 50px; + text-align: center; + filter: blur(2px); + margin-right: 1rem; } @media screen and (max-width: 768px) { - a.categoryButton i { - display: none; - } + a.categoryButton i { + display: none; + } - a.categoryButton img { - display: none; - } + a.categoryButton img { + display: none; + } - .recent-post-top .categoryGroup { - min-width: 130px !important; - margin-bottom: 0.5rem; - margin-left: 1rem; - max-height: 164px; - overflow: hidden; - position: relative; - } + .recent-post-top .categoryGroup { + min-width: 130px !important; + margin-bottom: 0.5rem; + margin-left: 1rem; + max-height: 164px; + overflow: hidden; + position: relative; + } } .topGroup { - display: flex; + display: flex; } #bannerGroup { - display: flex; + display: flex; } div#banners { - display: none; + display: none; } .topGroup .todayCard { - display: none; + display: none; } @media screen and (min-width: 1300px) { - .topGroup { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; - height: calc(328px + .5rem); - align-content: space-between; - width: calc(50% - .25rem); - position: relative; - animation: slide-in .6s .1s backwards - } + .topGroup { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; + height: calc(328px + .5rem); + align-content: space-between; + width: calc(50% - .25rem); + position: relative; + animation: slide-in .6s .1s backwards + } - div#bannerGroup { - width: calc(50% - .25rem); - margin-right: .5rem; - height: calc(328px + .5rem); - display: flex; - flex-direction: column; - justify-content: space-between - } + div#bannerGroup { + width: calc(50% - .25rem); + margin-right: .5rem; + height: calc(328px + .5rem); + display: flex; + flex-direction: column; + justify-content: space-between + } - div#banners { - display: flex; - width: 100%; - height: 76%; - background: var(--heo-card-bg); - margin-bottom: 0.5rem; - border: var(--style-border); - border-radius: 12px; - overflow: hidden; - position: relative; - box-shadow: var(--heo-shadow-border); - flex-direction: column; - overflow: hidden; - transition: 0.3s; - will-change: transform; - animation: slide-in .6s .1s backwards; - } + div#banners { + display: flex; + width: 100%; + height: 76%; + background: var(--heo-card-bg); + margin-bottom: 0.5rem; + border: var(--style-border); + border-radius: 12px; + overflow: hidden; + position: relative; + box-shadow: var(--heo-shadow-border); + flex-direction: column; + overflow: hidden; + transition: 0.3s; + will-change: transform; + animation: slide-in .6s .1s backwards; + } - div#banners:hover { - box-shadow: var(--heo-shadow-main); - } + div#banners:hover { + box-shadow: var(--heo-shadow-main); + } - #banners.flink { - margin-bottom: 0.5rem; - } + #banners.flink { + margin-bottom: 0.5rem; + } - #banners .banner-button-group { - position: absolute; - right: 2rem; - top: 2rem; - display: flex; - } + #banners .banner-button-group { + position: absolute; + right: 2rem; + top: 2rem; + display: flex; + } - #banners .banner-button { - padding: 8px 12px; - background: var(--heo-fontcolor); - border-radius: 12px; - color: var(--heo-card-bg); - display: flex; - align-items: center; - z-index: 1; - transition: 0.3s; - cursor: pointer; - box-shadow: var(--heo-shadow-black); - } + #banners .banner-button { + padding: 8px 12px; + background: var(--heo-fontcolor); + border-radius: 12px; + color: var(--heo-card-bg); + display: flex; + align-items: center; + z-index: 1; + transition: 0.3s; + cursor: pointer; + box-shadow: var(--heo-shadow-black); + } - #banners .banner-button.secondary { - background: var(--heo-secondbg); - border: var(--style-border-always); - color: var(--heo-lighttext); - margin-right: 1rem; - box-shadow: var(--heo-shadow-border); - } + #banners .banner-button.secondary { + background: var(--heo-secondbg); + border: var(--style-border-always); + color: var(--heo-lighttext); + margin-right: 1rem; + box-shadow: var(--heo-shadow-border); + } - #banners .banner-button:hover { - background: var(--heo-theme); - color: var(--heo-white); - } + #banners .banner-button:hover { + background: var(--heo-theme); + color: var(--heo-white); + } - #banners .banner-button i { - margin-right: 8px; - /*font-size: 1rem;*/ - } + #banners .banner-button i { + margin-right: 8px; + /*font-size: 1rem;*/ + } - .banners-title { - top: 2rem; - left: 1.5rem; - position: absolute; - display: flex; - flex-direction: column; - } + .banners-title { + top: 2rem; + left: 1.5rem; + position: absolute; + display: flex; + flex-direction: column; + } - .flink .banners-title { - top: 1.5rem; - } + .flink .banners-title { + top: 1.5rem; + } - .banners-title-big { - font-size: 36px; - line-height: 1; - font-weight: bold; - margin-bottom: 8px; - } + .banners-title-big { + font-size: 36px; + line-height: 1; + font-weight: bold; + margin-bottom: 8px; + } - .banners-title-small { - font-size: 12px; - line-height: 1; - color: var(--heo-secondtext); - margin-top: 8px; - margin-bottom: 0.5rem; - } + .banners-title-small { + font-size: 12px; + line-height: 1; + color: var(--heo-secondtext); + margin-top: 8px; + margin-bottom: 0.5rem; + } - #banner-hover { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - background: var(--heo-lighttext); - color: var(--heo-card-bg); - padding-left: 0.5rem; - display: flex; - flex-direction: column; - justify-content: center; - opacity: 0; - transition: cubic-bezier(0.71, 0.15, 0.16, 1.15) 0.6s; - } + #banner-hover { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background: var(--heo-lighttext); + color: var(--heo-card-bg); + padding-left: 0.5rem; + display: flex; + flex-direction: column; + justify-content: center; + opacity: 0; + transition: cubic-bezier(0.71, 0.15, 0.16, 1.15) 0.6s; + } - .bannerText { - font-size: 4rem; - line-height: 4rem; - font-weight: bold; - } + .bannerText { + font-size: 4rem; + line-height: 4rem; + font-weight: bold; + } - .banner-righticon { - font-size: 4rem; - opacity: 0.6; - } + .banner-righticon { + font-size: 4rem; + opacity: 0.6; + } - #banners:hover #banner-hover { - opacity: 1; - padding-left: 2rem; - background: var(--heo-theme-op-deep); - backdrop-filter: blur(15px); - -webkit-backdrop-filter: blur(15px); - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; - transition: 0.3s; - background-size: 200%; - cursor: pointer; - } + #banners:hover #banner-hover { + opacity: 1; + padding-left: 2rem; + background: var(--heo-theme-op-deep); + backdrop-filter: blur(15px); + -webkit-backdrop-filter: blur(15px); + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; + transition: 0.3s; + background-size: 200%; + cursor: pointer; + } - #banners #banner-hover i { - font-size: 80px; - opacity: .4 - } + #banners #banner-hover i { + font-size: 80px; + opacity: .4 + } - .topGroup .todayCard { - position: absolute; - width: 100%; - height: 100%; - z-index: 1; - top: 0; - right: 0; - background: var(--heo-card-bg); - border-radius: 12px; - margin-left: .5rem; - overflow: hidden; - transition: .3s; - display: flex; - cursor: pointer; - pointer-events: all - } + .topGroup .todayCard { + position: absolute; + width: 100%; + height: 100%; + z-index: 1; + top: 0; + right: 0; + background: var(--heo-card-bg); + border-radius: 12px; + margin-left: .5rem; + overflow: hidden; + transition: .3s; + display: flex; + cursor: pointer; + pointer-events: all + } - .topGroup .todayCard::after { - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; - } + .topGroup .todayCard::after { + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; + } - .topGroup .todayCard.hide { - opacity: 0; - pointer-events: none; - } + .topGroup .todayCard.hide { + opacity: 0; + pointer-events: none; + } - .topGroup .todayCard .todayCard-info { - position: absolute; - bottom: 2rem; - left: 2rem; - z-index: 2; - color: var(--heo-white); - max-width: 60%; - transition: 0.3s; - } + .topGroup .todayCard .todayCard-info { + position: absolute; + bottom: 2rem; + left: 2rem; + z-index: 2; + color: var(--heo-white); + max-width: 60%; + transition: 0.3s; + } - .topGroup .todayCard.hide .todayCard-info { - bottom: 1rem; - opacity: 0; - } + .topGroup .todayCard.hide .todayCard-info { + bottom: 1rem; + opacity: 0; + } - .topGroup .todayCard .todayCard-info .todayCard-tips { - opacity: 0.8; - font-size: 0.6rem; - } + .topGroup .todayCard .todayCard-info .todayCard-tips { + opacity: 0.8; + font-size: 0.6rem; + } - .topGroup .todayCard .todayCard-info .todayCard-title { - font-size: 28px; - font-weight: bold; - line-height: 36px; - } + .topGroup .todayCard .todayCard-info .todayCard-title { + font-size: 28px; + font-weight: bold; + line-height: 36px; + } - .topGroup .banner-button-group { - position: absolute; - right: 2rem; - bottom: 2rem; - display: flex; - transition: 0.3s; - } + .topGroup .banner-button-group { + position: absolute; + right: 2rem; + bottom: 2rem; + display: flex; + transition: 0.3s; + } - .topGroup .todayCard.hide .banner-button-group { - bottom: 1rem; - } + .topGroup .todayCard.hide .banner-button-group { + bottom: 1rem; + } - .topGroup .banner-button { - background: var(--heo-white-op); - border-radius: 20px; - color: var(--heo-white); - display: flex; - align-items: center; - z-index: 1; - transition: 0.3s; - cursor: pointer; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); - height: 40px; - width: 124px; - justify-content: center; - } + .topGroup .banner-button { + background: var(--heo-white-op); + border-radius: 20px; + color: var(--heo-white); + display: flex; + align-items: center; + z-index: 1; + transition: 0.3s; + cursor: pointer; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); + height: 40px; + width: 124px; + justify-content: center; + } - .topGroup .banner-button:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg); - } + .topGroup .banner-button:hover { + background: var(--heo-lighttext); + color: var(--heo-card-bg); + } - .topGroup .banner-button i { - margin-right: 8px; - font-size: 1rem; - } + .topGroup .banner-button i { + margin-right: 8px; + font-size: 1rem; + } - .topGroup .todayCard .todayCard-cover { - position: absolute; - min-width: 100%; - min-height: 100%; - top: 0; - left: 0; - background-size: cover; - z-index: -1; - transition: 0.3s; - } + .topGroup .todayCard .todayCard-cover { + position: absolute; + min-width: 100%; + min-height: 100%; + top: 0; + left: 0; + background-size: cover; + z-index: -1; + transition: 0.3s; + } - .topGroup .todayCard.hide .todayCard-cover { - transform: scale(1.2); - } + .topGroup .todayCard.hide .todayCard-cover { + transform: scale(1.2); + } } @keyframes rowup { - from { - transform: translateX(0%); - } + from { + transform: translateX(0%); + } - to { - transform: translateX(-50%); - } + to { + transform: translateX(-50%); + } } .tags-group-icon { - width: 120px; - height: 120px; - border-radius: 30px; + width: 120px; + height: 120px; + border-radius: 30px; } .tags-group-all { - display: flex; - transform: rotate(-30deg); + display: flex; + transform: rotate(-30deg); } .tags-group-all.nowrapMove { - transform: rotate(0); - padding-bottom: 2rem; + transform: rotate(0); + padding-bottom: 2rem; } .tags-group-wrapper { - margin-top: 5rem; - display: flex; - flex-wrap: nowrap; - animation: rowup 60s linear infinite; + margin-top: 5rem; + display: flex; + flex-wrap: nowrap; + animation: rowup 60s linear infinite; } .nowrapMove .tags-group-wrapper { - margin-top: 7rem; - animation: rowup 120s linear infinite; + margin-top: 7rem; + animation: rowup 120s linear infinite; } .tags-group-icon-pair .tags-group-icon:nth-child(even) { - margin-top: 1rem; - transform: translate(-60px); + margin-top: 1rem; + transform: translate(-60px); } .tags-group-icon-pair { - margin-left: 1rem; + margin-left: 1rem; } .tags-group-icon { - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 66px; - font-weight: bold; - box-shadow: var(--heo-shadow-blackdeep); + display: flex; + align-items: center; + justify-content: center; + color: white; + font-size: 66px; + font-weight: bold; + box-shadow: var(--heo-shadow-blackdeep); } .nowrapMove .tags-group-icon { - border-radius: 50%; + border-radius: 50%; } .tags-group-icon img { - width: 60%; + width: 60%; } .nowrapMove .tags-group-icon img { - min-width: 100%; - min-height: 100%; - border-radius: 50%; - object-fit: cover; + min-width: 100%; + min-height: 100%; + border-radius: 50%; + object-fit: cover; } -#categoryList > div:nth-child(1) > a::before { - height: 24px; - width: 44px; - content: ""; - background: url(../images/top.png) no-repeat; - background-size: 38px 24px; - position: absolute; - top: 0px; - left: 0; +#categoryList>div:nth-child(1)>a::before { + height: 24px; + width: 44px; + content: ""; + background: url(../images/top.png) no-repeat; + background-size: 38px 24px; + position: absolute; + top: 0px; + left: 0; } .categoryItem:hover i { - opacity: 0.8; - transition: 0.8s; - transition-delay: 0.15s; - transform: scale(1.03) rotate(0deg); - font-size: 2.5rem; - filter: blur(0px); + opacity: 0.8; + transition: 0.8s; + transition-delay: 0.15s; + transform: scale(1.03) rotate(0deg); + font-size: 2.5rem; + filter: blur(0px); } .categoryItem:hover img { - opacity: 0.8; - transition: 0.8s; - transition-delay: 0.15s; - transform: scale(1.03) rotate(0deg); - font-size: 2.5rem; - filter: blur(0px); + opacity: 0.8; + transition: 0.8s; + transition-delay: 0.15s; + transform: scale(1.03) rotate(0deg); + font-size: 2.5rem; + filter: blur(0px); } @media screen and (min-width: 1300px) { - .categoryItem:hover i { - transform: scale(1.03) rotate(0deg); - } + .categoryItem:hover i { + transform: scale(1.03) rotate(0deg); + } - .categoryItem:hover img { - transform: scale(1.03) rotate(0deg); - } + .categoryItem:hover img { + transform: scale(1.03) rotate(0deg); + } } -#categoryList > a:nth-child() > i { - padding-right: 8px; +#categoryList>a:nth-child()>i { + padding-right: 8px; } .cate-button-text { - box-shadow: var(--heo-shadow-black); + box-shadow: var(--heo-shadow-black); } @media screen and (max-width: 768px) { - div#categoryList { - display: none; - } + div#categoryList { + display: none; + } } /* 新主页分类 */ .recent-post-top .categoryGroup { - display: flex; - flex-direction: column; - justify-content: space-between; - min-width: 200px; + display: flex; + flex-direction: column; + justify-content: space-between; + min-width: 200px; } .categoryGroup .categoryItem:nth-child(4) { - display: none; + display: none; } @media screen and (min-width: 1300px) { - .recent-post-top .categoryGroup { - flex-direction: row; - height: 24%; - animation: slide-in .6s .2s backwards - } + .recent-post-top .categoryGroup { + flex-direction: row; + height: 24%; + animation: slide-in .6s .2s backwards + } - .categoryItem { - width: calc(100% / 3 - 0.33rem); - height: 100%; - margin-right: 0.5rem; - } + .categoryItem { + width: calc(100% / 3 - 0.33rem); + height: 100%; + margin-right: 0.5rem; + } - .categoryItem:last-child { - margin-right: 0; - } + .categoryItem:last-child { + margin-right: 0; + } - .categoryItem:hover { - width: 50%; - } + .categoryItem:hover { + width: 50%; + } - .categoryGroup .categoryItem:nth-child(4) { - display: flex; - } + .categoryGroup .categoryItem:nth-child(4) { + display: flex; + } } a.categoryButton.bikan { - background: linear-gradient(to right, #358bff, #15c6ff); - background-size: 200%; + background: linear-gradient(to right, #358bff, #15c6ff); + background-size: 200%; } a.categoryButton.remen { - background: linear-gradient(to right, #ff6655, #ffbf37); - background-size: 200%; + background: linear-gradient(to right, #ff6655, #ffbf37); + background-size: 200%; } a.categoryButton.shiyong { - background: linear-gradient(to right, #18e7ae, #1eebeb); - background-size: 200%; + background: linear-gradient(to right, #18e7ae, #1eebeb); + background-size: 200%; } a.categoryButton.bannerItem4 { - background: linear-gradient(to right, #82a531, #e38969); - background-size: 200%; + background: linear-gradient(to right, #82a531, #e38969); + background-size: 200%; } [data-theme=dark] a.categoryButton.bikan { - background: linear-gradient(to right, #0653b8, #2fcbff); - background-size: 200%; + background: linear-gradient(to right, #0653b8, #2fcbff); + background-size: 200%; } [data-theme=dark] a.categoryButton.remen { - background: linear-gradient(to right, #e22a16, #da980c); - background-size: 200%; + background: linear-gradient(to right, #e22a16, #da980c); + background-size: 200%; } [data-theme=dark] a.categoryButton.shiyong { - background: linear-gradient(to right, #099e74, #0ea4a4); - background-size: 200%; + background: linear-gradient(to right, #099e74, #0ea4a4); + background-size: 200%; } [data-theme=dark] a.categoryButton.bannerItem4 { - background: linear-gradient(to right, #82a531, #e38969); - background-size: 200%; + background: linear-gradient(to right, #82a531, #e38969); + background-size: 200%; } a.categoryButton:hover { - background-position: 100% 0; + background-position: 100% 0; } /* 首页分类条展示 */ #category-bar { - padding: 0.4rem 1rem 0.4rem 0.7rem; - background: var(--heo-card-bg); - border-radius: 12px; - display: flex; - white-space: nowrap; - overflow: hidden; - margin-bottom: 1rem; - border: var(--style-border); - transition: 0.3s; - width: 100%; - justify-content: space-between; - -webkit-user-select: none; - display: flex; - align-items: center + padding: 0.4rem 1rem 0.4rem 0.7rem; + background: var(--heo-card-bg); + border-radius: 12px; + display: flex; + white-space: nowrap; + overflow: hidden; + margin-bottom: 1rem; + border: var(--style-border); + transition: 0.3s; + width: 100%; + justify-content: space-between; + -webkit-user-select: none; + display: flex; + align-items: center } @media screen and (min-width: 1300px) { - #category-bar:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); - } + #category-bar:hover { + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); + } - .category-in-bar-tips { - margin-bottom: .25rem; - } + .category-in-bar-tips { + margin-bottom: .25rem; + } } @media screen and (max-width: 768px) { - #category-bar { - border-radius: 0; - background: var(--heo-background); - margin-bottom: 0; - position: -webkit-sticky; - position: sticky; - z-index: 1; - padding: 0; - height: 50px; - margin-top: 0; - align-items: center - } + #category-bar { + border-radius: 0; + background: var(--heo-background); + margin-bottom: 0; + position: -webkit-sticky; + position: sticky; + z-index: 1; + padding: 0; + height: 50px; + margin-top: 0; + align-items: center + } } #category #category-bar { - padding: 0; - border: none; - box-shadow: none; + padding: 0; + border: none; + box-shadow: none; } #category a.category-bar-item.select a { - display: none; + display: none; } .category-in-bar { - display: flex; - white-space: nowrap; - align-items: center; - margin-bottom: 4px + display: flex; + white-space: nowrap; + align-items: center; + margin-bottom: 4px } .category-in-bar-tips { - margin-right: 1rem; + margin-right: 1rem; } .category-bar-items { - white-space: nowrap; - overflow-x: scroll; - overflow-y: hidden; - display: flex; - border-radius: 8px; - align-items: center; - height: 30px + white-space: nowrap; + overflow-x: scroll; + overflow-y: hidden; + display: flex; + border-radius: 8px; + align-items: center; + height: 30px } .category-in-bar .category-in-bar-tips { - margin-bottom: 0; + margin-bottom: 0; } .category-in-bar #category-bar { - margin-bottom: 0; + margin-bottom: 0; } .category-bar-items::-webkit-scrollbar { - display: none; + display: none; } .category-bar-item a { - padding: 0.1rem 0.5rem; - margin-right: 6px; - font-weight: 700; - border-radius: 8px; - display: flex; - align-items: center; - height: 30px + padding: 0.1rem 0.5rem; + margin-right: 6px; + font-weight: 700; + border-radius: 8px; + display: flex; + align-items: center; + height: 30px } .category-bar-item:hover a { - background: var(--heo-theme); - color: var(--heo-card-bg); + background: var(--heo-theme); + color: var(--heo-card-bg); } .category-bar-item.select a { - background: var(--heo-theme); - color: var(--heo-card-bg); - border-radius: 8px; + background: var(--heo-theme); + color: var(--heo-card-bg); + border-radius: 8px; } @media screen and (max-width: 768px) { - .category-bar-item.select a { - border-radius: 8px; - } + .category-bar-item.select a { + border-radius: 8px; + } - .category-bar-item a { - border-radius: 8px; - } + .category-bar-item a { + border-radius: 8px; + } - .category-in-bar { - position: -webkit-sticky; - position: sticky; - top: 60px; - background: var(--heo-background); - z-index: 1002; - } + .category-in-bar { + position: -webkit-sticky; + position: sticky; + top: 60px; + background: var(--heo-background); + z-index: 1002; + } } .category-bar-more { - margin-left: 1rem; - font-weight: bold; + margin-left: 1rem; + font-weight: bold; } .category-bar-more:hover { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } /* 主页哔哔bb */ #bber-talk { - width: 100%; - height: 25px; - line-height: 25px; - display: flex; - flex-direction: column; + width: 100%; + height: 25px; + line-height: 25px; + display: flex; + flex-direction: column; } #bbtalk { - overflow: hidden; - width: 100%; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + overflow: hidden; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } #bber-talk .li-style { - width: 90%; - max-width: 500px; - height: 25px; - text-align: center; - overflow: hidden; - text-overflow: ellipsis; - transition: 0.3s; - font-weight: bold; - margin: auto; - cursor: pointer; - white-space: nowrap; + width: 90%; + max-width: 500px; + height: 25px; + text-align: center; + overflow: hidden; + text-overflow: ellipsis; + transition: 0.3s; + font-weight: bold; + margin: auto; + cursor: pointer; + white-space: nowrap; } #bbTimeList .li-style:hover { - color: var(--heo-theme); - transition: 0.3s; + color: var(--heo-theme); + transition: 0.3s; } ul, li { - list-style: none; - display: block; - margin: 0; - padding: 0; + list-style: none; + display: block; + margin: 0; + padding: 0; } #bbTimeList { - background: var(--heo-card-bg); - color: var(--heo-fontcolor); - padding: 0.5rem 1rem; - border-radius: 12px; - box-shadow: var(--heo-shadow-lightblack); - display: flex; - transition: 0.3s; - margin-bottom: 1rem; - border: var(--style-border); - align-items: center; - height: 50px; + background: var(--heo-card-bg); + color: var(--heo-fontcolor); + padding: 0.5rem 1rem; + border-radius: 12px; + box-shadow: var(--heo-shadow-lightblack); + display: flex; + transition: 0.3s; + margin-bottom: 1rem; + border: var(--style-border); + align-items: center; + height: 50px; } #bbTimeList.more-page { - margin-bottom: 0; + margin-bottom: 0; } #bbTimeList:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); } @media screen and (min-width: 1300px) { - #bbTimeList { - margin-bottom: 1rem; - animation: slide-in .6s 0s backwards; - } + #bbTimeList { + margin-bottom: 1rem; + animation: slide-in .6s 0s backwards; + } } /* 哔哔前往 */ .bber-gotobb { - line-height: 25px; - margin-left: 1rem; - transition: 0.3s; - cursor: pointer; + line-height: 25px; + margin-left: 1rem; + transition: 0.3s; + cursor: pointer; } .bber-gotobb:hover { - opacity: 0.8; - color: var(--heo-theme); + opacity: 0.8; + color: var(--heo-theme); } /* 哔哔标志 */ .icon-logo-moment { - font-size: 2rem; - font-size: 2rem; - line-height: 22px; - margin-right: 1rem; - transition: 0.3s; - cursor: pointer; + font-size: 2rem; + font-size: 2rem; + line-height: 22px; + margin-right: 1rem; + transition: 0.3s; + cursor: pointer; } .icon-logo-moment:hover { - opacity: 0.8; - color: var(--heo-theme); + opacity: 0.8; + color: var(--heo-theme); } /*宠物挂件*/ .climb { - display: block; - position: absolute; - max-width: 270px; - z-index: 2; - margin-top: -26.6px; - margin-left: 5px; - cursor: pointer + display: block; + position: absolute; + max-width: 270px; + z-index: 2; + margin-top: -26.6px; + margin-left: 5px; + cursor: pointer } @media screen and (max-width: 1200px) { - .climb { - display: none !important - } + .climb { + display: none !important + } } /* 文章卡片相关 */ -#recent-posts > .recent-post-item > .recent-post-info { - padding: 0; +#recent-posts>.recent-post-item>.recent-post-info { + padding: 0; } .recent-post-item .recent-post-info .recent-post-info-top { - position: relative; - transition: 0.3s; - padding: 0 32px; - width: 100%; + position: relative; + transition: 0.3s; + padding: 0 32px; + width: 100%; } .recent-post-item .recent-post-info .recent-post-info-top .article-title { - line-height: 30px; - margin-top: 0; - font-weight: bold; - color: var(--heo-fontcolor); - margin-bottom: 0; - width: 100%; - transition: .3s; - font-size: 1rem; - -webkit-line-clamp: 2; - display: -webkit-box; - overflow: hidden; - -webkit-box-orient: vertical; + line-height: 30px; + margin-top: 0; + font-weight: bold; + color: var(--heo-fontcolor); + margin-bottom: 0; + width: 100%; + transition: .3s; + font-size: 1rem; + -webkit-line-clamp: 2; + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; } .recent-post-item .recent-post-info .recent-post-info-top .original { - display: flex; - color: var(--heo-secondtext); - font-size: .5rem; - position: relative; - margin-right: 8px + display: flex; + color: var(--heo-secondtext); + font-size: .5rem; + position: relative; + margin-right: 8px } .recent-post-info-top-tips { - display: flex; - margin-top: 20px; - user-select: none + display: flex; + margin-top: 20px; + user-select: none } @media screen and (max-width: 768px) { - .recent-post-info-top-tips { - display: none - } + .recent-post-info-top-tips { + display: none + } } -#recent-posts > .recent-post-item > .recent-post-info .sticky-warp { - line-height: 23px; - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-align: center; - -moz-box-align: center; - -o-box-align: center; - -ms-flex-align: center; - -webkit-align-items: center; - align-items: center; - -webkit-box-pack: center; - -moz-box-pack: center; - -o-box-pack: center; - -ms-flex-pack: center; - -webkit-justify-content: center; - justify-content: center; - margin-right: 8px +#recent-posts>.recent-post-item>.recent-post-info .sticky-warp { + line-height: 23px; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + -webkit-box-align: center; + -moz-box-align: center; + -o-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: center; + -moz-box-pack: center; + -o-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + margin-right: 8px } -#recent-posts > .recent-post-item > .recent-post-info .sticky { - color: #ff7242; - font-size: 12px +#recent-posts>.recent-post-item>.recent-post-info .sticky { + color: #ff7242; + font-size: 12px } .recent-post-item .recent-post-info .recent-post-info-top .lastestpost { - display: flex; - color: var(--heo-secondtext); - font-size: .5rem; - position: relative; - margin-right: 8px + display: flex; + color: var(--heo-secondtext); + font-size: .5rem; + position: relative; + margin-right: 8px } .recent-post-item .recent-post-info .recent-post-info-top a.unvisited-post { - display: flex; - color: var(--heo-secondtext); - font-size: .5rem; - position: relative + display: flex; + color: var(--heo-secondtext); + font-size: .5rem; + position: relative } .recent-post-item .recent-post-info .recent-post-info-top a.unvisited-post:visited { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } @media screen and (min-width: 1300px) { - .recent-post-item .recent-post-info .recent-post-info-top .article-title { - font-size: 20px; - -webkit-line-clamp: 2; - } + .recent-post-item .recent-post-info .recent-post-info-top .article-title { + font-size: 20px; + -webkit-line-clamp: 2; + } - .recent-post-item:hover .recent-post-info .recent-post-info-top .article-title { - -webkit-line-clamp: 2; - } + .recent-post-item:hover .recent-post-info .recent-post-info-top .article-title { + -webkit-line-clamp: 2; + } - #recent-posts > .recent-post-item .post_cover { - transition: 1s !important; - height: 225px; - width: 100%; - } + #recent-posts>.recent-post-item .post_cover { + transition: 1s !important; + height: 225px; + width: 100%; + } - .recent-post-item.post-card-large .recent-post-info .recent-post-info-top .content { - opacity: 0.8 !important; - -webkit-line-clamp: 2 !important; - } + .recent-post-item.post-card-large .recent-post-info .recent-post-info-top .content { + opacity: 0.8 !important; + -webkit-line-clamp: 2 !important; + } - .recent-post-item.post-card-large:hover .recent-post-info .recent-post-info-top .content { - opacity: 1 !important; - } + .recent-post-item.post-card-large:hover .recent-post-info .recent-post-info-top .content { + opacity: 1 !important; + } } .recent-post-item .recent-post-info .recent-post-info-top .content { - opacity: 0; - transition: 0.3s; - display: -webkit-box; - overflow: hidden; - -webkit-box-orient: vertical; - -webkit-line-clamp: 1; - line-height: 1.4; - color: var(--heo-secondtext); - margin-top: 0.4rem; + opacity: 0; + transition: 0.3s; + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; + line-height: 1.4; + color: var(--heo-secondtext); + margin-top: 0.4rem; } @media screen and (max-width: 1300px) { - .recent-post-item:hover .recent-post-info .recent-post-info-top .content { - - } + .recent-post-item:hover .recent-post-info .recent-post-info-top .content {} } @media screen and (min-width: 1300px) { - .recent-post-item:hover .recent-post-info .recent-post-info-top .content { - - } + .recent-post-item:hover .recent-post-info .recent-post-info-top .content {} } @media screen and (min-width: 768px) { - .recent-post-item.post-card-large .recent-post-info .recent-post-info-top .content { - opacity: 1; - -webkit-line-clamp: 4; - } + .recent-post-item.post-card-large .recent-post-info .recent-post-info-top .content { + opacity: 1; + -webkit-line-clamp: 4; + } - .recent-post-item.post-card-large:hover .recent-post-info .recent-post-info-top .content { - -webkit-line-clamp: 6; - } + .recent-post-item.post-card-large:hover .recent-post-info .recent-post-info-top .content { + -webkit-line-clamp: 6; + } } @media screen and (max-width: 768px) { - .recent-post-item .recent-post-info .recent-post-info-top { - padding: 0 20px; - top: 20px; - } + .recent-post-item .recent-post-info .recent-post-info-top { + padding: 0 20px; + top: 20px; + } - .recent-post-item .recent-post-info .recent-post-info-top .content { - opacity: 1; - -webkit-line-clamp: 2; - display: none; - } + .recent-post-item .recent-post-info .recent-post-info-top .content { + opacity: 1; + -webkit-line-clamp: 2; + display: none; + } - #recent-posts .recent-post-item .recent-post-info .article-title { - font-size: 19px; - } + #recent-posts .recent-post-item .recent-post-info .article-title { + font-size: 19px; + } } /* 文章卡片文字信息 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap a { - color: var(--heo-fontcolor); +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap a { + color: var(--heo-fontcolor); } /* AI */ .ai-btn-box { - font-size: 15.5px; - width: 100%; - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-orient: horizontal; - -moz-box-orient: horizontal; - -o-box-orient: horizontal; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-lines: multiple; - -moz-box-lines: multiple; - -o-box-lines: multiple; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; + font-size: 15.5px; + width: 100%; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + -webkit-box-orient: horizontal; + -moz-box-orient: horizontal; + -o-box-orient: horizontal; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -o-box-lines: multiple; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; } .ai-btn-item { - padding: 5px 10px; - margin: 10px 16px 0px 5px; - width: fit-content; - line-height: 1; - background: var(--heo-main); - color: #fff; - border-radius: 6px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-transition: all 0.3s; - -moz-transition: all 0.3s; - -o-transition: all 0.3s; - -ms-transition: all 0.3s; - transition: all 0.3s; - cursor: pointer; + padding: 5px 10px; + margin: 10px 16px 0px 5px; + width: fit-content; + line-height: 1; + background: var(--heo-main); + color: #fff; + border-radius: 6px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-transition: all 0.3s; + -moz-transition: all 0.3s; + -o-transition: all 0.3s; + -ms-transition: all 0.3s; + transition: all 0.3s; + cursor: pointer; } .ai-btn-item:hover { - background: var(--heo-theme); - color: var(--heo-card-bg); + background: var(--heo-theme); + color: var(--heo-card-bg); } .ai-recommend { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-orient: horizontal; - -moz-box-orient: horizontal; - -o-box-orient: horizontal; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-lines: multiple; - -moz-box-lines: multiple; - -o-box-lines: multiple; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + -webkit-box-orient: horizontal; + -moz-box-orient: horizontal; + -o-box-orient: horizontal; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -o-box-lines: multiple; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; } .ai-recommend .ai-recommend-item { - width: calc(50% - 20px); - margin: 10px; - background: var(--heo-secondbg); - border-radius: 4px; - padding: 10px; - cursor: pointer; - -webkit-transition: 0.3s; - -moz-transition: 0.3s; - -o-transition: 0.3s; - -ms-transition: 0.3s; - transition: 0.3s; - -webkit-animation: slide-in 0.6s 0.1s backwards; - -moz-animation: slide-in 0.6s 0.1s backwards; - -o-animation: slide-in 0.6s 0.1s backwards; - -ms-animation: slide-in 0.6s 0.1s backwards; - animation: slide-in 0.6s 0.1s backwards; + width: calc(50% - 20px); + margin: 10px; + background: var(--heo-secondbg); + border-radius: 4px; + padding: 10px; + cursor: pointer; + -webkit-transition: 0.3s; + -moz-transition: 0.3s; + -o-transition: 0.3s; + -ms-transition: 0.3s; + transition: 0.3s; + -webkit-animation: slide-in 0.6s 0.1s backwards; + -moz-animation: slide-in 0.6s 0.1s backwards; + -o-animation: slide-in 0.6s 0.1s backwards; + -ms-animation: slide-in 0.6s 0.1s backwards; + animation: slide-in 0.6s 0.1s backwards; } .ai-recommend .ai-recommend-item span.index { - padding: 4px; + padding: 4px; } .ai-recommend .ai-recommend-item:hover { - color: var(--heo-white); - background: var(--heo-main); + color: var(--heo-white); + background: var(--heo-main); } .ai-recommend .ai-recommend-item:hover a { - color: var(--heo-white); + color: var(--heo-white); } @media screen and (max-width: 768px) { - .ai-btn-box { - -webkit-box-pack: center; - -moz-box-pack: center; - -o-box-pack: center; - -ms-flex-pack: center; - -webkit-justify-content: center; - justify-content: center; - } + .ai-btn-box { + -webkit-box-pack: center; + -moz-box-pack: center; + -o-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + } - .ai-recommend .ai-recommend-item { - width: 100%; - } + .ai-recommend .ai-recommend-item { + width: 100%; + } } .ai-title i { - font-weight: 800; - font-size: 20px; - line-height: 20px; + font-weight: 800; + font-size: 20px; + line-height: 20px; } .ai-title .haofont.hao-icon-arrow-rotate-right { - font-size: 14px; - margin-left: 4px; - cursor: pointer; + font-size: 14px; + margin-left: 4px; + cursor: pointer; } /* 添加粒子效果 */ [data-theme="dark"] #universe { - display: block; - position: fixed; - margin: 0; - padding: 0; - border: 0; - outline: 0; - left: 0; - top: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 1; + display: block; + position: fixed; + margin: 0; + padding: 0; + border: 0; + outline: 0; + left: 0; + top: 0; + width: 100%; + height: 100%; + pointer-events: none; + z-index: 1; } canvas#universe { - display: none; + display: none; } .post-ai { - background: var(--heo-secondbg); - border-radius: 12px; - padding: 12px; - line-height: 1.3; - border: var(--style-border-always); - margin-top: 16px; - margin-bottom: 16px; + background: var(--heo-secondbg); + border-radius: 12px; + padding: 12px; + line-height: 1.3; + border: var(--style-border-always); + margin-top: 16px; + margin-bottom: 16px; } @media screen and (max-width: 768px) { - .post-ai { - margin-top: 22px; - } + .post-ai { + margin-top: 22px; + } } .ai-title { - display: flex; - color: var(--font-color); - border-radius: 8px; - align-items: center; - padding: 0 12px; - cursor: default; - user-select: none; + display: flex; + color: var(--font-color); + border-radius: 8px; + align-items: center; + padding: 0 12px; + cursor: default; + user-select: none; } .ai-title-text { - font-weight: bold; - margin-left: 8px; - line-height: 1; + font-weight: bold; + margin-left: 8px; + line-height: 1; } .ai-explanation { - margin-top: 12px; - padding: 8px 12px; - background: var(--heo-card-bg); - border-radius: 8px; - border: var(--style-border-always); - font-size: 15.8px; - line-height: 1.4; - display: none; + margin-top: 12px; + padding: 8px 12px; + background: var(--heo-card-bg); + border-radius: 8px; + border: var(--style-border-always); + font-size: 15.8px; + line-height: 1.4; + display: none; } .ai-suggestions { - display: flex; - flex-wrap: wrap; + display: flex; + flex-wrap: wrap; } .ai-suggestions .ai-suggestions-item { - margin-top: 12px; - padding: 8px 12px; - background: var(--heo-card-bg); - border-radius: 8px 8px 8px 0; - border: var(--style-border-always); - font-size: 15px; - line-height: 1.4; - display: flex; - width: fit-content; - margin-right: 12px; - cursor: pointer; - transition: 0.3s; + margin-top: 12px; + padding: 8px 12px; + background: var(--heo-card-bg); + border-radius: 8px 8px 8px 0; + border: var(--style-border-always); + font-size: 15px; + line-height: 1.4; + display: flex; + width: fit-content; + margin-right: 12px; + cursor: pointer; + transition: 0.3s; } .ai-suggestions .ai-suggestions-item:hover { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } .blinking-cursor { - background-color: var(--heo-main); - width: 10px; - height: 16px; - display: inline-block; - vertical-align: middle; - animation: blinking-cursor 0.5s infinite; - -webkit-animation: blinking-cursor 0.5s infinite; - margin-left: 4px; - margin-bottom: 3px; + background-color: var(--heo-main); + width: 10px; + height: 16px; + display: inline-block; + vertical-align: middle; + animation: blinking-cursor 0.5s infinite; + -webkit-animation: blinking-cursor 0.5s infinite; + margin-left: 4px; + margin-bottom: 3px; } @keyframes blinking-cursor { - 0% { - opacity: 1; - } - 40% { - opacity: 1; - } - 50% { - opacity: 0; - } - 90% { - opacity: 0; - } - 100% { - opacity: 1; - } + 0% { + opacity: 1; + } + + 40% { + opacity: 1; + } + + 50% { + opacity: 0; + } + + 90% { + opacity: 0; + } + + 100% { + opacity: 1; + } } .ai-tag { - font-size: 12px; - background-color: var(--heo-lighttext); - color: var(--heo-card-bg); - font-weight: bold; - border-radius: 4px; - margin-left: auto; - line-height: 1; - padding: 4px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: 0.3s; + font-size: 12px; + background-color: var(--heo-lighttext); + color: var(--heo-card-bg); + font-weight: bold; + border-radius: 4px; + margin-left: auto; + line-height: 1; + padding: 4px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: 0.3s; } .ai-tag:hover { - background: var(--heo-fontcolor); - color: var(--heo-card-bg); + background: var(--heo-fontcolor); + color: var(--heo-card-bg); } ins.adsbygoogle { - margin: 16px 0; - background: var(--heo-card-bg); - border-radius: 12px; - overflow: hidden; - border: var(--style-border-always); + margin: 16px 0; + background: var(--heo-card-bg); + border-radius: 12px; + overflow: hidden; + border: var(--style-border-always); } #ai-Toggle { - font-size: 12px; - background: var(--heo-lighttext); - color: var(--heo-card-bg); - padding: 4px; - border-radius: 4px; - margin-left: 6px; - transform: scale(0.8); - cursor: pointer; - transition: 0.3s; - font-weight: bold; + font-size: 12px; + background: var(--heo-lighttext); + color: var(--heo-card-bg); + padding: 4px; + border-radius: 4px; + margin-left: 6px; + transform: scale(0.8); + cursor: pointer; + transition: 0.3s; + font-weight: bold; } #ai-Toggle:hover { - background: var(--heo-fontcolor); - color: var(--heo-card-bg); + background: var(--heo-fontcolor); + color: var(--heo-card-bg); } /* 文章封面 */ #recent-post-top .recent-post-item .post_cover { - width: 100%; + width: 100%; } /* 文章卡片图标与文字间隙 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap i { - margin: 0 0.4rem 0 0; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap i { + margin: 0 0.4rem 0 0; } /* 文章卡片置顶标签 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .sticky { - color: var(--heo-fontcolor); +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .sticky { + color: var(--heo-fontcolor); } /* 文章卡片高度 */ #recent-posts .recent-post-item { - height: fit-content; - background: var(--heo-card-bg); - border-radius: 12px; - cursor: pointer; - border: var(--style-border); + height: fit-content; + background: var(--heo-card-bg); + border-radius: 12px; + cursor: pointer; + border: var(--style-border); } #recent-posts .recent-post-item:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); } @media screen and (max-width: 768px) { - #recent-posts .recent-post-item:hover { - border: var(--style-border-always); - box-shadow: none - } + #recent-posts .recent-post-item:hover { + border: var(--style-border-always); + box-shadow: none + } } /* 文章卡片偏移样式 */ @media screen and (max-width: 1300px) { - #recent-posts > .recent-post-item .right_radius, - #recent-posts > .recent-post-item .left_radius { - width: 75%; - display: flex; - height: 220px - } + #recent-posts>.recent-post-item .right_radius, + #recent-posts>.recent-post-item .left_radius { + width: 75%; + display: flex; + height: 220px + } - #recent-posts > .recent-post-item:hover .post_cover img.post_bg { - transform: scale(1.03); - transition: .3s ease-in-out; - filter: brightness(.85) - } + #recent-posts>.recent-post-item:hover .post_cover img.post_bg { + transform: scale(1.03); + transition: .3s ease-in-out; + filter: brightness(.85) + } - #recent-posts > .recent-post-item.post-card-large:hover .post_cover img.post_bg { - transform: scale(1.03); - } + #recent-posts>.recent-post-item.post-card-large:hover .post_cover img.post_bg { + transform: scale(1.03); + } - #recent-posts > .recent-post-item .post_cover img.post_bg { - min-width: 100%; - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; - transition: .3s ease-in-out; - min-height: 100%; - user-select: none - } + #recent-posts>.recent-post-item .post_cover img.post_bg { + min-width: 100%; + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; + transition: .3s ease-in-out; + min-height: 100%; + user-select: none + } - #recent-posts > .recent-post-item:hover > .recent-post-info { - transition: all 0.3s; - position: relative; - } + #recent-posts>.recent-post-item:hover>.recent-post-info { + transition: all 0.3s; + position: relative; + } - #recent-posts > .recent-post-item > .recent-post-info { - transition: all 0.3s; - } + #recent-posts>.recent-post-item>.recent-post-info { + transition: all 0.3s; + } } @media screen and (max-width: 375px) { - #recent-posts > .recent-post-item .left_radius, #recent-posts > .recent-post-item .right_radius { - height: 170px - } + + #recent-posts>.recent-post-item .left_radius, + #recent-posts>.recent-post-item .right_radius { + height: 170px + } } -#recent-posts > .recent-post-item:hover .post_cover img.post_bg { - transform: scale(1); - transition: 0s ease-in-out; - filter: brightness(1) +#recent-posts>.recent-post-item:hover .post_cover img.post_bg { + transform: scale(1); + transition: 0s ease-in-out; + filter: brightness(1) } @media screen and (min-width: 1200px) { - #recent-posts > .recent-post-item:hover .post_cover img.post_bg { - transform: scale(1.03); - transition: .3s ease-in-out; - filter: brightness(.85) - } + #recent-posts>.recent-post-item:hover .post_cover img.post_bg { + transform: scale(1.03); + transition: .3s ease-in-out; + filter: brightness(.85) + } } @media screen and (min-width: 1300px) { - #recent-posts > .recent-post-item .right_radius, - #recent-posts > .recent-post-item .left_radius { - width: 100%; - display: flex - } + #recent-posts>.recent-post-item .right_radius, + #recent-posts>.recent-post-item .left_radius { + width: 100%; + display: flex + } } -#recent-posts > .recent-post-item .right_radius a, -#recent-posts > .recent-post-item .left_radius a { - min-height: 100%; - min-width: 100%; +#recent-posts>.recent-post-item .right_radius a, +#recent-posts>.recent-post-item .left_radius a { + min-height: 100%; + min-width: 100%; } -#recent-posts > .recent-post-item > .recent-post-info { - display: inline-block; - overflow: hidden; +#recent-posts>.recent-post-item>.recent-post-info { + display: inline-block; + overflow: hidden; } /* 文章置顶卡片样式 */ .recent-top-post-group { - border-radius: 12px; - overflow: hidden; - overflow-x: auto; - width: 100%; - margin-bottom: 0rem; + border-radius: 12px; + overflow: hidden; + overflow-x: auto; + width: 100%; + margin-bottom: 0rem; } -.recent-top-post-group.more-page, .climb.more-page { - display: none; +.recent-top-post-group.more-page, +.climb.more-page { + display: none; } .recent-post-top { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - width: 100%; - overflow-x: scroll; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + width: 100%; + overflow-x: scroll; } .recent-post-top::-webkit-scrollbar { - display: none; - /* Chrome Safari */ + display: none; + /* Chrome Safari */ } .recent-post-top .recent-post-item { - display: flex; - width: 200px; - flex-direction: column; - align-items: flex-start; - margin-left: 0.5rem; - background: var(--heo-card-bg); - border-radius: 12px; - overflow: hidden; - min-width: 200px; - height: 164px; - max-height: 164px; - border: var(--style-border-always); - transition: 0.3s; - position: relative; - box-shadow: var(--heo-shadow-border); + display: flex; + width: 200px; + flex-direction: column; + align-items: flex-start; + margin-left: 0.5rem; + background: var(--heo-card-bg); + border-radius: 12px; + overflow: hidden; + min-width: 200px; + height: 164px; + max-height: 164px; + border: var(--style-border-always); + transition: 0.3s; + position: relative; + box-shadow: var(--heo-shadow-border); } @media screen and (max-width: 768px) { - .recent-post-top .recent-post-item { - border-radius: 8px; - box-shadow: none; - clip-path: inset(0 0 0 0 round 8px); - } + .recent-post-top .recent-post-item { + border-radius: 8px; + box-shadow: none; + clip-path: inset(0 0 0 0 round 8px); + } - .recent-post-top .recent-post-item:last-child { - margin-right: 1rem; - } + .recent-post-top .recent-post-item:last-child { + margin-right: 1rem; + } } @media screen and (min-width: 1300px) { - .recent-post-top .recent-post-item { - width: calc(100% / 3 - .25rem); - margin-left: 0 - } + .recent-post-top .recent-post-item { + width: calc(100% / 3 - .25rem); + margin-left: 0 + } - .recent-post-top .recent-post-item:active { - transform: scale(0.97); - } + .recent-post-top .recent-post-item:active { + transform: scale(0.97); + } - .recent-post-top .recent-post-item { - margin-right: 0; - margin-bottom: .5rem - } + .recent-post-top .recent-post-item { + margin-right: 0; + margin-bottom: .5rem + } - .recent-post-top { - overflow-x: visible; - } + .recent-post-top { + overflow-x: visible; + } - .recent-top-post-group { - overflow: visible; - overflow-x: visible; - } + .recent-top-post-group { + overflow: visible; + overflow-x: visible; + } } span.recent-post-top-text { - position: absolute; - top: 0; - left: -40px; - display: flex; - z-index: 1; - background: var(--heo-theme); - color: var(--heo-white); - padding: 2px 8px; - font-size: 0.6rem; - border-radius: 12px 0 12px 0; - transition: 0.3s; - cursor: pointer; + position: absolute; + top: 0; + left: -40px; + display: flex; + z-index: 1; + background: var(--heo-theme); + color: var(--heo-white); + padding: 2px 8px; + font-size: 0.6rem; + border-radius: 12px 0 12px 0; + transition: 0.3s; + cursor: pointer; } .recent-post-item:hover .recent-post-top-text { - left: 0; + left: 0; } @media screen and (min-width: 1300px) { - .recent-post-top .recent-post-item:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); - transform: scale(1.03); - } + .recent-post-top .recent-post-item:hover { + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); + transform: scale(1.03); + } - .recent-post-top .recent-post-item:active { - transform: scale(0.97); - } + .recent-post-top .recent-post-item:active { + transform: scale(0.97); + } } @media screen and (max-width: 768px) { - .recent-top-post-group { - border-radius: 0; - background: var(--heo-background); - } + .recent-top-post-group { + border-radius: 0; + background: var(--heo-background); + } - .recent-post-top-text { - display: none !important; - } + .recent-post-top-text { + display: none !important; + } - .recent-post-top .recent-post-item .post_cover img { - border-radius: 8px 8px 0 0 !important; - } + .recent-post-top .recent-post-item .post_cover img { + border-radius: 8px 8px 0 0 !important; + } } /* 封面 */ .recent-post-top .recent-post-item .post_cover a { - height: 100px; - overflow: hidden; - display: flex; + height: 100px; + overflow: hidden; + display: flex; } .recent-post-top .recent-post-item .post_cover img { - object-fit: cover; - width: 100%; - background: var(--heo-secondbg); - border-radius: 12px 12px 0 0; + object-fit: cover; + width: 100%; + background: var(--heo-secondbg); + border-radius: 12px 12px 0 0; } .recent-post-top .recent-post-item:hover .post_cover img { - transform: scale(1); + transform: scale(1); } .recent-post-item .post_cover { - -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); + -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); } /* 标题 */ .recent-post-top .recent-post-item .recent-post-info { - padding: 0.3rem 0.5rem 0.3rem 0.5rem !important; - transition: 0.3s; + padding: 0.3rem 0.5rem 0.3rem 0.5rem !important; + transition: 0.3s; } .recent-post-top .recent-post-item:hover .recent-post-info a { - color: var(--heo-fontcolor); + color: var(--heo-fontcolor); } @media screen and (max-width: 1300px) { - .recent-post-top .recent-post-item:hover .recent-post-info a { - color: var(--heo-theme); - transition: 0.3s; - } + .recent-post-top .recent-post-item:hover .recent-post-info a { + color: var(--heo-theme); + transition: 0.3s; + } } .recent-post-top .recent-post-item .recent-post-info .article-title { - -webkit-line-clamp: 2; - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - line-height: 1.5; - justify-content: center; - align-items: flex-end; - align-content: center; - padding-top: .5rem; - font-weight: bold; - font-size: 0.8rem !important; - padding: 0 !important; + -webkit-line-clamp: 2; + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + line-height: 1.5; + justify-content: center; + align-items: flex-end; + align-content: center; + padding-top: .5rem; + font-weight: bold; + font-size: 0.8rem !important; + padding: 0 !important; } .title-and-tips { - display: flex; - margin-top: 1rem; - align-items: center; + display: flex; + margin-top: 1rem; + align-items: center; } .title-and-tips .page-title { - line-height: 1; - margin: 0; + line-height: 1; + margin: 0; } .title-and-tips .page-tips { - background: var(--heo-yellow-op); - color: var(--heo-yellow); - margin-bottom: auto; - border-radius: 8px; - padding: 2px 6px; - font-size: 0.5rem; - margin-left: 8px; + background: var(--heo-yellow-op); + color: var(--heo-yellow); + margin-bottom: auto; + border-radius: 8px; + padding: 2px 6px; + font-size: 0.5rem; + margin-left: 8px; } /* 主页卡片阴影 */ #aside-content .card-widget { - box-shadow: var(--heo-shadow-border); - background: var(--heo-card-bg); - border: var(--style-border); - transition: 0.3s; - border-radius: 12px; - transition: 0.3s; - position: relative; - overflow: hidden; - margin-top: 1rem; - padding: 1rem 1.2rem; + box-shadow: var(--heo-shadow-border); + background: var(--heo-card-bg); + border: var(--style-border); + transition: 0.3s; + border-radius: 12px; + transition: 0.3s; + position: relative; + overflow: hidden; + margin-top: 1rem; + padding: 1rem 1.2rem; } -#recent-posts > .recent-post-item { - box-shadow: var(--heo-shadow-light2black); - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-align: center; - align-items: center; - transition: all 0.3s ease 0s; +#recent-posts>.recent-post-item { + box-shadow: var(--heo-shadow-light2black); + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-align: center; + align-items: center; + transition: all 0.3s ease 0s; } -#recent-posts > .recent-post-item { - margin-top: .5rem; - margin-bottom: 1rem; - position: relative; - overflow: hidden; - margin-top: 1rem; - animation: slide-in .6s .4s backwards; - will-change: transform +#recent-posts>.recent-post-item { + margin-top: .5rem; + margin-bottom: 1rem; + position: relative; + overflow: hidden; + margin-top: 1rem; + animation: slide-in .6s .4s backwards; + will-change: transform } /* 图片在左侧 */ -#recent-posts > .recent-post-item.left, .recent-post-item.alternate.odd { - flex-direction: row !important; +#recent-posts>.recent-post-item.left, +.recent-post-item.alternate.odd { + flex-direction: row !important; } -#recent-posts > .recent-post-item.left .cover_radius, .recent-post-item.alternate.odd .cover_radius { - border-radius: 12px 0px 0px 12px !important; +#recent-posts>.recent-post-item.left .cover_radius, +.recent-post-item.alternate.odd .cover_radius { + border-radius: 12px 0px 0px 12px !important; } /* 图片在右侧 */ -#recent-posts > .recent-post-item.right, .recent-post-item.alternate.even { - flex-direction: row-reverse !important; +#recent-posts>.recent-post-item.right, +.recent-post-item.alternate.even { + flex-direction: row-reverse !important; } -#recent-posts > .recent-post-item.right .cover_radius, .recent-post-item.alternate.even .cover_radius { - border-radius: 0px 12px 12px 0px !important; +#recent-posts>.recent-post-item.right .cover_radius, +.recent-post-item.alternate.even .cover_radius { + border-radius: 0px 12px 12px 0px !important; } @media screen and (min-width: 1300px) { - #recent-posts > .recent-post-item { - flex-direction: column; - } + #recent-posts>.recent-post-item { + flex-direction: column; + } - #recent-posts > .recent-post-item { - width: calc(50% - 0.5rem); - margin-top: 0.25rem; - margin-bottom: 0.75rem; - box-shadow: var(--heo-shadow-border); - clip-path: inset(0 0 0 0 round 12px); - } + #recent-posts>.recent-post-item { + width: calc(50% - 0.5rem); + margin-top: 0.25rem; + margin-bottom: 0.75rem; + box-shadow: var(--heo-shadow-border); + clip-path: inset(0 0 0 0 round 12px); + } - #category #recent-posts .recent-post-item, #tag #recent-posts .recent-post-item { - margin-top: .5rem; - margin-bottom: 1rem; - position: relative; - overflow: hidden; - margin-top: 1rem; - animation: slide-in .6s .4s backwards; - will-change: transform; - width: calc(100% / 2 - .5rem); - margin-top: .25rem; - margin-bottom: .75rem; - box-shadow: var(--heo-shadow-border) - } + #category #recent-posts .recent-post-item, + #tag #recent-posts .recent-post-item { + margin-top: .5rem; + margin-bottom: 1rem; + position: relative; + overflow: hidden; + margin-top: 1rem; + animation: slide-in .6s .4s backwards; + will-change: transform; + width: calc(100% / 2 - .5rem); + margin-top: .25rem; + margin-bottom: .75rem; + box-shadow: var(--heo-shadow-border) + } - /* 设置分列 */ - /* 1 列：左右排列 */ - #recent-posts > .recent-post-item.col1, #category #recent-posts .recent-post-item.col1, #tag #recent-posts .recent-post-item.col1 { - width: calc(100% - .5rem); + /* 设置分列 */ + /* 1 列：左右排列 */ + #recent-posts>.recent-post-item.col1, + #category #recent-posts .recent-post-item.col1, + #tag #recent-posts .recent-post-item.col1 { + width: calc(100% - .5rem); - } + } - /* 2 列 */ - #recent-posts > .recent-post-item.col2, #category #recent-posts .recent-post-item.col2, #tag #recent-posts .recent-post-item.col2 { - width: calc(100% / 2 - .5rem); - } + /* 2 列 */ + #recent-posts>.recent-post-item.col2, + #category #recent-posts .recent-post-item.col2, + #tag #recent-posts .recent-post-item.col2 { + width: calc(100% / 2 - .5rem); + } - /* 3 列 */ - #recent-posts > .recent-post-item.col3, #category #recent-posts .recent-post-item.col3, #tag #recent-posts .recent-post-item.col3 { - width: calc(100% / 3 - .5rem); - } + /* 3 列 */ + #recent-posts>.recent-post-item.col3, + #category #recent-posts .recent-post-item.col3, + #tag #recent-posts .recent-post-item.col3 { + width: calc(100% / 3 - .5rem); + } - #category-bar { - margin-bottom: .75rem; - box-shadow: var(--heo-shadow-border); - animation: slide-in .6s .3s backwards - } + #category-bar { + margin-bottom: .75rem; + box-shadow: var(--heo-shadow-border); + animation: slide-in .6s .3s backwards + } - #category #category-bar { - animation: none - } + #category #category-bar { + animation: none + } - /* 首页文章第一个 */ - #recent-posts { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - align-items: flex-start; - align-content: flex-start; - -webkit-user-select: none - } + /* 首页文章第一个 */ + #recent-posts { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + align-items: flex-start; + align-content: flex-start; + -webkit-user-select: none + } } @media screen and (min-width: 1200px) { - #category #recent-posts .recent-post-item, #tag #recent-posts .recent-post-item { - animation: slide-in .6s .4s backwards - } - #category-bar { - animation: slide-in .6s .3s backwards - } + #category #recent-posts .recent-post-item, + #tag #recent-posts .recent-post-item { + animation: slide-in .6s .4s backwards + } + + #category-bar { + animation: slide-in .6s .3s backwards + } } #recent-posts { - position: relative + position: relative } /* 主页卡片手机端美化 */ @media screen and (max-width: 768px) { - #recent-posts > .recent-post-item { - border-radius: 0; - } + #recent-posts>.recent-post-item { + border-radius: 0; + } - #recent-posts > .recent-post-item { - margin: 1.5rem 0; - border-radius: 12px; - margin-top: .5rem; - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - display: block; - position: relative; - clip-path: inset(0 0 0 0 round 12px) - } + #recent-posts>.recent-post-item { + margin: 1.5rem 0; + border-radius: 12px; + margin-top: .5rem; + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + display: block; + position: relative; + clip-path: inset(0 0 0 0 round 12px) + } - #recent-posts { - padding: 0 1rem - } + #recent-posts { + padding: 0 1rem + } - #category #recent-posts, #tag #recent-posts { - padding: 0 - } + #category #recent-posts, + #tag #recent-posts { + padding: 0 + } - #recent-posts .recent-post-item .post_cover { - border-radius: 0 !important; - width: 100%; - } + #recent-posts .recent-post-item .post_cover { + border-radius: 0 !important; + width: 100%; + } - #bbTimeList { - margin-top: 0; - border-radius: 0; - background: var(--heo-background); - padding: 0.5rem 20px; - } + #bbTimeList { + margin-top: 0; + border-radius: 0; + background: var(--heo-background); + padding: 0.5rem 20px; + } - a.article-meta__categories { - left: 12px !important; - top: 12px !important; - border-radius: 4px !important; - padding: 2px 9px !important; - font-size: 12px - } + a.article-meta__categories { + left: 12px !important; + top: 12px !important; + border-radius: 4px !important; + padding: 2px 9px !important; + font-size: 12px + } - #bbTimeList { - margin-bottom: 0rem; - } + #bbTimeList { + margin-bottom: 0rem; + } } /* 置顶卡片数量优化 */ @media screen and (min-width: 1300px) { - .topGroup .recent-post-item:nth-child(7) { - display: none; - } + .topGroup .recent-post-item:nth-child(7) { + display: none; + } } /* 手机端精简优化 */ @media screen and (max-width: 768px) { - /* 边栏头像 */ - #sidebar-menus > div.author-avatar { - display: none; - } + /* 边栏头像 */ + #sidebar-menus>div.author-avatar { + display: none; + } - /* 文章标签 */ - #recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap { - bottom: 0.5rem !important; - } + /* 文章标签 */ + #recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap { + bottom: 0.5rem !important; + } - #recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap time { - display: absolute; - right: 0; - } + #recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap time { + display: absolute; + right: 0; + } - /* 背景 */ - #web_bg { - background: none !important; - } + /* 背景 */ + #web_bg { + background: none !important; + } - #recent-posts > .recent-post-item .post_cover img.post_bg { - border-radius: 12px 12px 0 0 !important; - } + #recent-posts>.recent-post-item .post_cover img.post_bg { + border-radius: 12px 12px 0 0 !important; + } - #recent-posts > .recent-post-item .post_cover img.post_bg:hover { - transform: scale(1); - } + #recent-posts>.recent-post-item .post_cover img.post_bg:hover { + transform: scale(1); + } - #recent-posts > .recent-post-item:hover img.post_bg { - transform: scale(1); - } + #recent-posts>.recent-post-item:hover img.post_bg { + transform: scale(1); + } - .recent-post-top .recent-post-item:hover .post_cover img { - transform: scale(1); - } + .recent-post-top .recent-post-item:hover .post_cover img { + transform: scale(1); + } - #recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap, - #recent-posts > .recent-post-item > .recent-post-info > .article-title, - #recent-posts > .recent-post-item > .recent-post-info > .content { - padding: 0 20px !important - } + #recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap, + #recent-posts>.recent-post-item>.recent-post-info>.article-title, + #recent-posts>.recent-post-item>.recent-post-info>.content { + padding: 0 20px !important + } } /* 文章卡片标题 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-title { - line-height: 1.4; - margin-top: 0px; - font-weight: bold; - color: var(--heo-fontcolor); - margin-bottom: 0px; - position: absolute; - width: 100%; - left: 0; - padding: 0 40px; - transition: 0.3s; +#recent-posts>.recent-post-item>.recent-post-info>.article-title { + line-height: 1.4; + margin-top: 0px; + font-weight: bold; + color: var(--heo-fontcolor); + margin-bottom: 0px; + position: absolute; + width: 100%; + left: 0; + padding: 0 40px; + transition: 0.3s; } -#recent-posts > .recent-post-item > .recent-post-info > .article-title:hover { - color: var(--heo-fontcolor); +#recent-posts>.recent-post-item>.recent-post-info>.article-title:hover { + color: var(--heo-fontcolor); } @media screen and (min-width: 768px) { - #recent-posts > .recent-post-item > .recent-post-info > .article-title { - top: 40px; - } + #recent-posts>.recent-post-item>.recent-post-info>.article-title { + top: 40px; + } - #recent-posts > .recent-post-item:hover > .recent-post-info > .article-title { - top: 20px; - } + #recent-posts>.recent-post-item:hover>.recent-post-info>.article-title { + top: 20px; + } - #recent-posts > .recent-post-item.post-card-large:hover > .recent-post-info > .article-title { - top: 30px; - } + #recent-posts>.recent-post-item.post-card-large:hover>.recent-post-info>.article-title { + top: 30px; + } - #recent-posts .recent-post-item:hover .recent-post-info .article-title { - color: var(--heo-theme); - } + #recent-posts .recent-post-item:hover .recent-post-info .article-title { + color: var(--heo-theme); + } } /* 日期右侧显示 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap > .post-meta-date { - right: 0px; - text-align: right; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap>.post-meta-date { + right: 0px; + text-align: right; } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap > .post-meta-date i { - display: none; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap>.post-meta-date i { + display: none; } .post-meta-date .far { - opacity: 0.6; + opacity: 0.6; } .post-meta-date .article-meta-label { - display: none; + display: none; } -#post-meta .post-meta-date, #post-meta .post-meta-author { - opacity: .6; - margin-right: 0.8rem; +#post-meta .post-meta-date, +#post-meta .post-meta-author { + opacity: .6; + margin-right: 0.8rem; } #post-info #post-meta a.post-meta-pv, #post-info #post-meta a.post-meta-commentcount, #post-info #post-meta a.post-meta-editor { - color: var(--heo-white); - display: flex; - align-items: center; - padding: 8px; + color: var(--heo-white); + display: flex; + align-items: center; + padding: 8px; } #post-info #post-meta a.post-meta-pv:hover, #post-info #post-meta a.post-meta-commentcount:hover, #post-info #post-meta a.post-meta-editor:hover { - opacity: 1; - background: var(--heo-white-op) + opacity: 1; + background: var(--heo-white-op) } /* 文章目录 */ #aside-content #card-toc .toc-content .toc-link.active { - line-height: 24px; - border-radius: 12px; - border-left-color: var(--heo-hovertext); - background-color: var(--heo-card-bg); - color: var(--heo-lighttext); - font-weight: 700; - font-size: 20px; - position: relative; + line-height: 24px; + border-radius: 12px; + border-left-color: var(--heo-hovertext); + background-color: var(--heo-card-bg); + color: var(--heo-lighttext); + font-weight: 700; + font-size: 20px; + position: relative; } [data-theme=dark].toc-list .toc-item.active .toc-link { - color: var(--heo-white); + color: var(--heo-white); } #aside-content #card-toc .toc-content .toc-item.active .toc-link { - opacity: 1; - border-radius: 8px; + opacity: 1; + border-radius: 8px; } #aside-content #card-toc .toc-content .toc-link { - line-height: 24px; - padding: 8px; - border-left: 0 solid transparent; - border-radius: 12px; - color: var(--heo-secondtext); - cursor: default; - min-height: 40px; - display: flex; - align-items: center; + line-height: 24px; + padding: 8px; + border-left: 0 solid transparent; + border-radius: 12px; + color: var(--heo-secondtext); + cursor: default; + min-height: 40px; + display: flex; + align-items: center; } #aside-content #card-toc .toc-content a.toc-link:not(.active) { - opacity: 0.6; - cursor: pointer; - filter: blur(1px); - transition: 0.3s; + opacity: 0.6; + cursor: pointer; + filter: blur(1px); + transition: 0.3s; } #aside-content #card-toc:hover .toc-content a.toc-link:not(.active) { - filter: blur(0px); - opacity: 1; + filter: blur(0px); + opacity: 1; } #aside-content #card-toc .toc-content a:hover.toc-link:not(.active) { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } /* 目录卡片边距 */ #card-toc { - padding: 0.5rem 0.5rem !important; + padding: 0.5rem 0.5rem !important; } /* 不显示分割线 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap .article-meta__separator { - display: none; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap .article-meta__separator { + display: none; } .article-meta { - margin: 0 8px 0 0; - white-space: nowrap; - overflow: hidden; - display: inline-block; - text-overflow: ellipsis; + margin: 0 8px 0 0; + white-space: nowrap; + overflow: hidden; + display: inline-block; + text-overflow: ellipsis; } /* 不显示标签分割点 */ .article-meta__link { - display: none; + display: none; } .article-meta__tags { - margin-right: 4px; - padding: 0 0.2rem 0 0; + margin-right: 4px; + padding: 0 0.2rem 0 0; } /* 多分类兼容性调整 */ -#recent-posts > div > i .post_cover { - display: none; +#recent-posts>div>i .post_cover { + display: none; } /* 文章标签置底 */ -#recent-posts > .recent-post-item > .recent-post-info { - height: 174px; - width: 100%; - cursor: pointer; - position: relative; - padding: 0; - display: inline-block; - overflow: hidden +#recent-posts>.recent-post-item>.recent-post-info { + height: 174px; + width: 100%; + cursor: pointer; + position: relative; + padding: 0; + display: inline-block; + overflow: hidden } @media screen and (max-width: 768px) { - #recent-posts .recent-post-item .recent-post-info { - height: 7rem; - } + #recent-posts .recent-post-item .recent-post-info { + height: 7rem; + } } -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap { - position: absolute; - bottom: 16px; - transition: 0.3s; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - width: 100%; - left: 0; - padding: 0 32px; - white-space: nowrap; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap { + position: absolute; + bottom: 16px; + transition: 0.3s; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + width: 100%; + left: 0; + padding: 0 32px; + white-space: nowrap; } @media screen and (min-width: 1300px) { - #recent-posts > .recent-post-item.top:hover > .recent-post-info > .article-meta-wrap { - bottom: 30px; - } + #recent-posts>.recent-post-item.top:hover>.recent-post-info>.article-meta-wrap { + bottom: 30px; + } - #recent-posts > .recent-post-item.top.post-card-large:hover > .recent-post-info > .article-meta-wrap { - bottom: 20px; - } + #recent-posts>.recent-post-item.top.post-card-large:hover>.recent-post-info>.article-meta-wrap { + bottom: 20px; + } - #recent-posts > .recent-post-item.top > .recent-post-info > .article-meta-wrap { - bottom: 30px; - } + #recent-posts>.recent-post-item.top>.recent-post-info>.article-meta-wrap { + bottom: 30px; + } } /* 首页文章标签样式 */ -#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap a:hover { - background-color: var(--heo-none); - color: var(--heo-lighttext); - cursor: pointer; - border-radius: 4px; +#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap a:hover { + background-color: var(--heo-none); + color: var(--heo-lighttext); + cursor: pointer; + border-radius: 4px; } /* 首页顶部banner区域 */ #home_top { - max-width: 1400px; - margin: auto; - margin-top: 0.5rem; - padding: 0 1.5rem; + max-width: 1400px; + margin: auto; + margin-top: 0.5rem; + padding: 0 1.5rem; } @media screen and (max-width: 768px) { - #home_top { - padding: 0; - margin-top: 0; - } + #home_top { + padding: 0; + margin-top: 0; + } } @@ -9901,86 +9921,86 @@ span.recent-post-top-text { /* sketch */ #aside-content .card-tag-cloud a[href*="/tags/Sketch/"] { - color: var(--heo-lighttext) !important; - font-weight: 500; + color: var(--heo-lighttext) !important; + font-weight: 500; } /* 设计 */ #aside-content .card-tag-cloud a[href*="/tags/%E8%AE%BE%E8%AE%A1/"] { - color: var(--heo-lighttext) !important; - font-weight: 500; + color: var(--heo-lighttext) !important; + font-weight: 500; } /* 干货 */ #aside-content .card-tag-cloud a[href*="/tags/%E5%B9%B2%E8%B4%A7/"] { - color: var(--heo-lighttext) !important; - font-weight: 500; + color: var(--heo-lighttext) !important; + font-weight: 500; } /* 教程 */ #aside-content .card-tag-cloud a[href*="/tags/%E6%95%99%E7%A8%8B/"] { - color: var(--heo-lighttext) !important; - font-weight: 500; + color: var(--heo-lighttext) !important; + font-weight: 500; } #aside-content .card-tag-cloud a sup { - opacity: 0.4; - margin-left: 2px; + opacity: 0.4; + margin-left: 2px; } /* 描述 */ -#recent-posts > .recent-post-item > .recent-post-info > .content { - line-height: 1.4; - color: var(--heo-secondtext); - margin-top: 0px; - cursor: pointer; - transition: 0.3s; - opacity: 1; - position: absolute; - width: 100%; - left: 0; - padding: 0 40px; +#recent-posts>.recent-post-item>.recent-post-info>.content { + line-height: 1.4; + color: var(--heo-secondtext); + margin-top: 0px; + cursor: pointer; + transition: 0.3s; + opacity: 1; + position: absolute; + width: 100%; + left: 0; + padding: 0 40px; } @media screen and (min-width: 768px) { - #recent-posts > .recent-post-item > .recent-post-info > .content { - opacity: 0; - top: 120px; - } + #recent-posts>.recent-post-item>.recent-post-info>.content { + opacity: 0; + top: 120px; + } - #recent-posts > .recent-post-item:hover > .recent-post-info > .content { - opacity: 1; - top: 90px; - } + #recent-posts>.recent-post-item:hover>.recent-post-info>.content { + opacity: 1; + top: 90px; + } - @media screen and (max-width: 1300px) { - #recent-posts > .post-card-large > .recent-post-info > .content { - opacity: 1 !important; - } + @media screen and (max-width: 1300px) { + #recent-posts>.post-card-large>.recent-post-info>.content { + opacity: 1 !important; + } - #recent-posts > .post-card-large:hover > .recent-post-info > .content { - top: 110px; - } + #recent-posts>.post-card-large:hover>.recent-post-info>.content { + top: 110px; + } - #recent-posts > .post-card-large > .recent-post-info > .content { - -webkit-line-clamp: 3 !important; - } + #recent-posts>.post-card-large>.recent-post-info>.content { + -webkit-line-clamp: 3 !important; + } - #recent-posts > .post-card-large:hover > .recent-post-info > .content { - -webkit-line-clamp: 5 !important; - } + #recent-posts>.post-card-large:hover>.recent-post-info>.content { + -webkit-line-clamp: 5 !important; + } - /* 大文章高度 */ - #recent-posts > .post-card-large { - height: 20em !important; - } - } + /* 大文章高度 */ + #recent-posts>.post-card-large { + height: 20em !important; + } + } } @media screen and (max-width: 768px) { - #recent-posts > .recent-post-item > .recent-post-info > .content { - top: 5rem; - } + #recent-posts>.recent-post-item>.recent-post-info>.content { + top: 5rem; + } } /* @@ -9990,195 +10010,195 @@ span.recent-post-top-text { } */ /* 描述行数限制 */ -#recent-posts > .recent-post-item > .recent-post-info > .content { - -webkit-line-clamp: 2; +#recent-posts>.recent-post-item>.recent-post-info>.content { + -webkit-line-clamp: 2; } /* 作者打招呼 */ div#author-info__sayhi { - text-align: left; - color: var(--heo-white); - background: var(--heo-white-op); - font-size: 12px; - margin-right: auto; - padding: 2px 8px; - border-radius: 12px; - width: fit-content; - cursor: pointer; - -webkit-user-select: none; - transition: 0.3s; + text-align: left; + color: var(--heo-white); + background: var(--heo-white-op); + font-size: 12px; + margin-right: auto; + padding: 2px 8px; + border-radius: 12px; + width: fit-content; + cursor: pointer; + -webkit-user-select: none; + transition: 0.3s; } div#author-info__sayhi:hover { - background: var(--heo-white-op); - color: var(--heo-white); - transform: scale(1.1) + background: var(--heo-white-op); + color: var(--heo-white); + transform: scale(1.1) } /* 选中第一个卡片，与左侧元素对齐 */ -#aside-content > .card-widget:first-child { - margin-top: 0px; +#aside-content>.card-widget:first-child { + margin-top: 0px; } /* 作者卡片背景 */ -#aside-content > .card-widget.card-info { - transition: 0.3s; - border: none; - box-shadow: none; - background: var(--heo-main); - margin-top: 0px; +#aside-content>.card-widget.card-info { + transition: 0.3s; + border: none; + box-shadow: none; + background: var(--heo-main); + margin-top: 0px; } -#aside-content > .card-widget.card-info { - background: var(--heo-card-bg); - box-shadow: var(--heo-shadow-black); - position: relative; +#aside-content>.card-widget.card-info { + background: var(--heo-card-bg); + box-shadow: var(--heo-shadow-black); + position: relative; } -#aside-content > .card-widget.card-info::before { - background: linear-gradient(-25deg, var(--heo-main), var(--heo-main-op-deep), var(--heo-main), var(--heo-main-op-deep)); - background-size: 400%; - position: absolute; - width: 100%; - height: 100%; - left: 0; - top: 0; - content: ''; - animation: gradient 15s ease infinite; +#aside-content>.card-widget.card-info::before { + background: linear-gradient(-25deg, var(--heo-main), var(--heo-main-op-deep), var(--heo-main), var(--heo-main-op-deep)); + background-size: 400%; + position: absolute; + width: 100%; + height: 100%; + left: 0; + top: 0; + content: ''; + animation: gradient 15s ease infinite; } @keyframes gradient { - 0% { - background-position: 0% 50%; - } + 0% { + background-position: 0% 50%; + } - 50% { - background-position: 100% 50%; - } + 50% { + background-position: 100% 50%; + } - 100% { - background-position: 0% 50%; - } + 100% { + background-position: 0% 50%; + } } @media screen and (max-width: 1300px) { - #aside-content > .card-widget:first-child { - min-height: 329px; - } + #aside-content>.card-widget:first-child { + min-height: 329px; + } } /* 作者卡片描述 */ -#aside-content > div.card-widget.card-info > div > div.card-info-avatar.is-center > div.author-info__description { - line-height: 1.38; - margin: .3rem 0; - text-align: justify; - color: rgba(255, 255, 255, 0.8); +#aside-content>div.card-widget.card-info>div>div.card-info-avatar.is-center>div.author-info__description { + line-height: 1.38; + margin: .3rem 0; + text-align: justify; + color: rgba(255, 255, 255, 0.8); } -#aside-content > div.card-widget.card-info > div > div.card-info-avatar.is-center > div.author-info__description b { - color: var(--heo-white); +#aside-content>div.card-widget.card-info>div>div.card-info-avatar.is-center>div.author-info__description b { + color: var(--heo-white); } /* 作者卡片描述2 */ .author-info__description2 { - line-height: 1.38; - margin: .3rem 0; - text-align: justify; - width: 100%; - z-index: 2; - color: rgba(255, 255, 255, 0.8); + line-height: 1.38; + margin: .3rem 0; + text-align: justify; + width: 100%; + z-index: 2; + color: rgba(255, 255, 255, 0.8); } .author-info__description2 b { - color: var(--heo-white); + color: var(--heo-white); } .card-widget.card-info .banner-button-group { - position: absolute; - right: 1rem; - bottom: 1rem; - display: flex; + position: absolute; + right: 1rem; + bottom: 1rem; + display: flex; } .card-widget.card-info .banner-button-group .banner-button { - padding: 8px 12px; - background: var(--heo-white-op); - border-radius: 12px; - color: var(--heo-white); - display: flex; - align-items: center; - z-index: 1; - transition: 0.3s; - cursor: pointer; + padding: 8px 12px; + background: var(--heo-white-op); + border-radius: 12px; + color: var(--heo-white); + display: flex; + align-items: center; + z-index: 1; + transition: 0.3s; + cursor: pointer; } .card-widget.card-info .banner-button-group .banner-button:hover { - background: var(--heo-white); - color: var(--heo-black); + background: var(--heo-white); + color: var(--heo-black); } .card-widget.card-info .banner-button-group .banner-button i { - margin-right: 8px; - font-size: 1rem; + margin-right: 8px; + font-size: 1rem; } /* 头像背景 */ /* 隐藏文章数等信息 */ #aside-content .card-info .card-info-data { - display: none; + display: none; } /* 作者头像 */ #aside-content .card-info a img { - border-radius: 0px; - height: 200px; - display: inherit; - filter: drop-shadow(-5px 14px 8px #00000008); - position: absolute; - right: -24px; - bottom: -82px; - width: auto; - z-index: 0; - transition: cubic-bezier(0.48, -0.21, 0, 1.5) 0.3s; + border-radius: 0px; + height: 200px; + display: inherit; + filter: drop-shadow(-5px 14px 8px #00000008); + position: absolute; + right: -24px; + bottom: -82px; + width: auto; + z-index: 0; + transition: cubic-bezier(0.48, -0.21, 0, 1.5) 0.3s; } #aside-content .card-info a img:hover { - bottom: -42px; + bottom: -42px; } [data-theme=light] #aside-content .card-info a img { - filter: drop-shadow(-5px 14px 8px #ffffff08); + filter: drop-shadow(-5px 14px 8px #ffffff08); } .card-widget.card-info { - padding: 0 !important; + padding: 0 !important; } -#aside-content > div.card-widget.card-info > div.card-content { - padding: 1rem 1.2rem; - min-height: 330px; - position: relative; +#aside-content>div.card-widget.card-info>div.card-content { + padding: 1rem 1.2rem; + min-height: 330px; + position: relative; } -#aside-content > div.card-widget.card-info > div.card-info-avatarimg { - overflow: hidden; - background: var(--heo-yellow); - transition: 1.5s; - min-height: 160px; - position: relative; - box-shadow: var(--heo-shadow-yellow); +#aside-content>div.card-widget.card-info>div.card-info-avatarimg { + overflow: hidden; + background: var(--heo-yellow); + transition: 1.5s; + min-height: 160px; + position: relative; + box-shadow: var(--heo-shadow-yellow); } -#aside-content > div.card-widget.card-info > div.card-info-avatarimg:hover img { - transform: scale(1.03); +#aside-content>div.card-widget.card-info>div.card-info-avatarimg:hover img { + transform: scale(1.03); } /* 作者文章列表链接 */ -#aside-content > div.card-widget.card-info > div > div.card-info-data > div:nth-child() > a > div.headline { - font-weight: bold; +#aside-content>div.card-widget.card-info>div>div.card-info-data>div:nth-child()>a>div.headline { + font-weight: bold; } /* 作者名称和头像间距 */ @@ -10188,183 +10208,183 @@ div#author-info__sayhi:hover { /* pad端隐藏部分侧边栏 */ @media screen and (max-width: 900px) { - #aside-content .card-announcement { - display: none; - } + #aside-content .card-announcement { + display: none; + } - #aside-content #card-funds { - display: none; - } + #aside-content #card-funds { + display: none; + } } -#aside-content .card-info .card-info-data > .card-info-data-item:hover { - background: var(--heo-post-blockquote-bg); - transform: scale(0.97); +#aside-content .card-info .card-info-data>.card-info-data-item:hover { + background: var(--heo-post-blockquote-bg); + transform: scale(0.97); } -#aside-content > div.card-widget.card-info > div.card-content > div.card-info-data > .card-info-data-item:hover > a > div.headline, -#aside-content > div.card-widget.card-info > div.card-content > div.card-info-data > .card-info-data-item:hover > a > div.length-num { - color: var(--heo-blue); +#aside-content>div.card-widget.card-info>div.card-content>div.card-info-data>.card-info-data-item:hover>a>div.headline, +#aside-content>div.card-widget.card-info>div.card-content>div.card-info-data>.card-info-data-item:hover>a>div.length-num { + color: var(--heo-blue); } /* 公告 */ .announcement_content p { - margin: 0.5rem 0 0 0; - line-height: 1.38; + margin: 0.5rem 0 0 0; + line-height: 1.38; } /* 卡片标题 */ #aside-content .item-headline { - padding-bottom: 0; - margin-left: 8px; - font-size: 1em; - font-weight: 700; - display: flex; - align-items: center + padding-bottom: 0; + margin-left: 8px; + font-size: 1em; + font-weight: 700; + display: flex; + align-items: center } #aside-content .item-headline span { - margin-left: 4px; + margin-left: 4px; } #aside-content .item-headline i { - min-width: 19.5px; + min-width: 19.5px; } -#aside-content .item-headline + div, -#aside-content .item-headline + ul { - padding: 0; - -webkit-user-select: none; +#aside-content .item-headline+div, +#aside-content .item-headline+ul { + padding: 0; + -webkit-user-select: none; } @media screen and (min-width: 1300px) { - #aside-content .card-widget { - margin-top: 1rem; - } + #aside-content .card-widget { + margin-top: 1rem; + } } @media screen and (max-width: 768px) { - #aside-content .card-widget { - border-radius: 12px; - } + #aside-content .card-widget { + border-radius: 12px; + } } /* 卡片根据时间查看文章底部查看更多按钮 */ -#aside-content > div.sticky_layout > div.card-widget.card-archives > div > ul > li.card-archive-list-item.more.is-center { - margin-top: 8px; - background: var(--heo-card-btn-bg); - border-radius: 8px; - transition: .3s ease-out !important +#aside-content>div.sticky_layout>div.card-widget.card-archives>div>ul>li.card-archive-list-item.more.is-center { + margin-top: 8px; + background: var(--heo-card-btn-bg); + border-radius: 8px; + transition: .3s ease-out !important } -#aside-content > div.sticky_layout > div.card-widget.card-archives > div > ul > li.card-archive-list-item.more.is-center :hover { - color: var(--heo-white); - background: var(--heo-blue); - border-radius: 8px; - transition: .3s ease-out !important +#aside-content>div.sticky_layout>div.card-widget.card-archives>div>ul>li.card-archive-list-item.more.is-center :hover { + color: var(--heo-white); + background: var(--heo-blue); + border-radius: 8px; + transition: .3s ease-out !important } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item.more span, -#aside-content .card-categories ul.card-category-list > .card-category-list-item.more span { - transition: .3s ease-out !important +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item.more span, +#aside-content .card-categories ul.card-category-list>.card-category-list-item.more span { + transition: .3s ease-out !important } -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item:hover.more span, -#aside-content .card-categories ul.card-category-list > .card-category-list-item.more span { - transition: .3s ease-out !important +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item:hover.more span, +#aside-content .card-categories ul.card-category-list>.card-category-list-item.more span { + transition: .3s ease-out !important } -#aside-content > div.sticky_layout > div.card-widget.card-archives > div > ul > li.card-archive-list-item.more.is-center :hover span { - background: none; +#aside-content>div.sticky_layout>div.card-widget.card-archives>div>ul>li.card-archive-list-item.more.is-center :hover span { + background: none; } #web_bg { - width: 100%; - height: 100%; - top: 0; - left: 0; - opacity: 1; - position: fixed; - z-index: -999; - background: var(--heo-background); + width: 100%; + height: 100%; + top: 0; + left: 0; + opacity: 1; + position: fixed; + z-index: -999; + background: var(--heo-background); } /* 标签云卡片 */ #aside-content .card-tag-cloud a { - color: var(--heo-fontcolor); - font-size: 0.8rem; - border-radius: 8px; + color: var(--heo-fontcolor); + font-size: 0.8rem; + border-radius: 8px; } #aside-content .card-tag-cloud a:hover { - background: var(--heo-theme); - color: var(--heo-card-bg) !important; - box-shadow: var(--heo-shadow-theme); + background: var(--heo-theme); + color: var(--heo-card-bg) !important; + box-shadow: var(--heo-shadow-theme); } #aside-content .card-tag-cloud a.tags-cloud-more { - width: 100%; - text-align: center; - border-radius: 8px !important; - border: var(--style-border); - margin-top: 8px; - font-size: var(--global-font-size) !important; + width: 100%; + text-align: center; + border-radius: 8px !important; + border: var(--style-border); + margin-top: 8px; + font-size: var(--global-font-size) !important; } @media screen and (min-width: 1300px) { - #aside-content .card-tag-cloud a:active { - transform: scale(0.97); - } + #aside-content .card-tag-cloud a:active { + transform: scale(0.97); + } } /* 时间轴卡片 */ -#aside-content .card-archives ul.card-archive-list > .card-archive-list-item a:hover, -#aside-content .card-categories ul.card-category-list > .card-category-list-item a:hover { - color: var(--heo-card-bg); - background-color: var(--heo-theme); - box-shadow: var(--heo-shadow-theme); - border-radius: 8px; - padding: 0.15rem 0.5rem; - border: var(--style-border-hover); +#aside-content .card-archives ul.card-archive-list>.card-archive-list-item a:hover, +#aside-content .card-categories ul.card-category-list>.card-category-list-item a:hover { + color: var(--heo-card-bg); + background-color: var(--heo-theme); + box-shadow: var(--heo-shadow-theme); + border-radius: 8px; + padding: 0.15rem 0.5rem; + border: var(--style-border-hover); } @media screen and (min-width: 1300px) { - #aside-content .card-archives ul.card-archive-list > .card-archive-list-item a:active, - #aside-content .card-categories ul.card-category-list > .card-category-list-item a:active { - transform: scale(0.97); - } + #aside-content .card-archives ul.card-archive-list>.card-archive-list-item a:active, + #aside-content .card-categories ul.card-category-list>.card-category-list-item a:active { + transform: scale(0.97); + } } /* 翻页 */ a.extend.next { - right: 0; + right: 0; } a.extend.prev { - left: 0; + left: 0; } @media screen and (max-width: 768px) { - #pagination { - margin-bottom: 0rem; - margin-top: 0; - } + #pagination { + margin-bottom: 0rem; + margin-top: 0; + } } @media screen and (min-width: 1300px) { - #pagination { - margin-top: 0.25rem; - } + #pagination { + margin-top: 0.25rem; + } } .lg-container { - display: none; + display: none; } /* 文章页 @@ -10372,690 +10392,694 @@ a.extend.prev { /* 文章头图 */ #page-header.post-bg::before { - transition: 0.3s; - opacity: 0.93; - height: 20rem; - background-color: var(--heo-main); - opacity: 1; - position: absolute; - top: 0px; - left: 0px; - display: block; - width: 100%; - content: ""; + transition: 0.3s; + opacity: 0.93; + height: 20rem; + background-color: var(--heo-main); + opacity: 1; + position: absolute; + top: 0px; + left: 0px; + display: block; + width: 100%; + content: ""; } @media screen and (max-width: 768px) { - #page-header.post-bg { - height: 30rem !important; - margin-bottom: -12px; - } + #page-header.post-bg { + height: 30rem !important; + margin-bottom: -12px; + } - #page-header.post-bg:before { - height: 15rem; - } + #page-header.post-bg:before { + height: 15rem; + } - .post-bg #post-cover { - min-height: 15rem !important; - height: 70% !important; - opacity: 1 !important; - } + .post-bg #post-cover { + min-height: 15rem !important; + height: 70% !important; + opacity: 1 !important; + } } @media screen and (min-width: 1300px) { - #page-header.post-bg { - height: 25rem; - } + #page-header.post-bg { + height: 25rem; + } - #page-header { - height: 25rem; - } + #page-header { + height: 25rem; + } - #page-header.post-bg:before { - height: 25rem; - /* opacity: 0; */ - background-color: var(--heo-main); - animation: slide-in-op 0.6s 0s forwards; - } + #page-header.post-bg:before { + height: 25rem; + /* opacity: 0; */ + background-color: var(--heo-main); + animation: slide-in-op 0.6s 0s forwards; + } - #post-info .post-title { - width: 1100px; - font-size: 2.6rem !important; - } + #post-info .post-title { + width: 1100px; + font-size: 2.6rem !important; + } } #page-header.post-bg { - /* backdrop-filter: blur(500px); */ - background-color: var(--heo-background); - transition: 0.6s; - overflow: hidden; + /* backdrop-filter: blur(500px); */ + background-color: var(--heo-background); + transition: 0.6s; + overflow: hidden; } .post-bg #post-cover { - width: 100%; - height: 100%; - object-fit: cover; - min-width: 50vw; - min-height: 20rem; - opacity: 0.8; + width: 100%; + height: 100%; + object-fit: cover; + min-width: 50vw; + min-height: 20rem; + opacity: 0.8; } .coverdiv { - width: 70%; - height: 100%; - position: relative; - margin: 0 -20% 0 auto; - overflow: hidden; - margin-bottom: 0; - transform: rotate(10deg) translateY(-10%) scale(2); - filter: blur(10px); + width: 70%; + height: 100%; + position: relative; + margin: 0 -20% 0 auto; + overflow: hidden; + margin-bottom: 0; + transform: rotate(10deg) translateY(-10%) scale(2); + filter: blur(10px); } .coverdiv.loaded { - display: block; + display: block; } .coverdiv:after { - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; - box-shadow: 110px -130px 300px 60px var(--heo-main) inset; + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; + box-shadow: 110px -130px 300px 60px var(--heo-main) inset; } @media screen and (max-width: 768px) { - .coverdiv { - margin: 0 0 0 auto; - transform: rotate(0) translateY(0) scale(1); - filter: blur(0); - width: 100%; - position: fixed; - height: 30rem; - z-index: 1 - } + .coverdiv { + margin: 0 0 0 auto; + transform: rotate(0) translateY(0) scale(1); + filter: blur(0); + width: 100%; + position: fixed; + height: 30rem; + z-index: 1 + } - .coverdiv:after { - box-shadow: 0 0 105px 99px var(--heo-main) inset; - height: 70% - } + .coverdiv:after { + box-shadow: 0 0 105px 99px var(--heo-main) inset; + height: 70% + } } @media screen and (min-width: 1300px) { - .coverdiv { - width: 70%; - height: 100%; - position: relative; - margin: 0 -20% 0 auto; - overflow: hidden; - margin-bottom: 0; - transform: rotate(10deg) translateY(-8%) scale(1.8); - filter: blur(10px); - opacity: 0; - } + .coverdiv { + width: 70%; + height: 100%; + position: relative; + margin: 0 -20% 0 auto; + overflow: hidden; + margin-bottom: 0; + transform: rotate(10deg) translateY(-8%) scale(1.8); + filter: blur(10px); + opacity: 0; + } - .coverdiv.loaded { - display: block; - opacity: 0.5; - animation: showCover 1s 0.3s backwards; - transform: rotate(10deg) translateY(-10%) scale(2); - } + .coverdiv.loaded { + display: block; + opacity: 0.5; + animation: showCover 1s 0.3s backwards; + transform: rotate(10deg) translateY(-10%) scale(2); + } } @media screen and (min-width: 768px) { - .coverdiv { - width: 70%; - height: 100%; - position: relative; - margin: 0 -20% 0 auto; - overflow: hidden; - margin-bottom: 0; - transform: rotate(10deg) translateY(-8%) scale(1.8); - filter: blur(10px); - opacity: 0; - } + .coverdiv { + width: 70%; + height: 100%; + position: relative; + margin: 0 -20% 0 auto; + overflow: hidden; + margin-bottom: 0; + transform: rotate(10deg) translateY(-8%) scale(1.8); + filter: blur(10px); + opacity: 0; + } - .coverdiv.loaded { - display: block; - opacity: 0.5; - animation: showCover 1s 0.3s backwards; - transform: rotate(10deg) translateY(-10%) scale(2); - } + .coverdiv.loaded { + display: block; + opacity: 0.5; + animation: showCover 1s 0.3s backwards; + transform: rotate(10deg) translateY(-10%) scale(2); + } - @keyframes showCover { - from { - opacity: 0; - transform: rotate(10deg) translateY(-8%) scale(1.8); - } - to { - opacity: 0.5; - transform: rotate(10deg) translateY(-10%) scale(2); - } - } + @keyframes showCover { + from { + opacity: 0; + transform: rotate(10deg) translateY(-8%) scale(1.8); + } + + to { + opacity: 0.5; + transform: rotate(10deg) translateY(-10%) scale(2); + } + } } #page-header { - background-image: none !important; - display: flex; - justify-content: center; + background-image: none !important; + display: flex; + justify-content: center; } /* 顶部遮罩 */ #post-cover-rgb { - position: absolute; - width: 100% !important; - height: 100% !important; - background: var(--heo-lighttext); + position: absolute; + width: 100% !important; + height: 100% !important; + background: var(--heo-lighttext); } /* 文章背景阴影 */ -.layout > div:first-child:not(.recent-posts) { - box-shadow: var(--heo-shadow-border); - padding: 1rem 2rem; - border-radius: 12px; - background: var(--heo-card-bg); - border: var(--style-border); - width: calc(100% - 300px); - align-self: flex-start; - animation: slide-in .6s .1s backwards; - position: relative; - overflow: hidden +.layout>div:first-child:not(.recent-posts) { + box-shadow: var(--heo-shadow-border); + padding: 1rem 2rem; + border-radius: 12px; + background: var(--heo-card-bg); + border: var(--style-border); + width: calc(100% - 300px); + align-self: flex-start; + animation: slide-in .6s .1s backwards; + position: relative; + overflow: hidden } #tag { - padding: 3rem 2rem 1rem 2rem + padding: 3rem 2rem 1rem 2rem } @media screen and (min-width: 1300px) { - #tag { - padding: 4rem 2rem 1rem 2rem; - } + #tag { + padding: 4rem 2rem 1rem 2rem; + } } #page { - box-shadow: none; + box-shadow: none; } .post-comment { - background: var(--heo-card-bg); + background: var(--heo-card-bg); } -.layout > div:first-child:not(.recent-posts):hover { - box-shadow: var(--heo-shadow-border); +.layout>div:first-child:not(.recent-posts):hover { + box-shadow: var(--heo-shadow-border); } @media screen and (max-width: 768px) { - .layout > div:first-child:not(.recent-posts) { - border-radius: 0; - padding: 0rem 1rem !important; - box-shadow: none !important; - background: var(--heo-background); - } + .layout>div:first-child:not(.recent-posts) { + border-radius: 0; + padding: 0rem 1rem !important; + box-shadow: none !important; + background: var(--heo-background); + } - .layout { - padding: 0 1.5rem; - } + .layout { + padding: 0 1.5rem; + } } @media screen and (max-width: 768px) { - .layout { - padding: 0; - } + .layout { + padding: 0; + } - .layout > div:first-child:not(.recent-posts) { - z-index: 10; - } + .layout>div:first-child:not(.recent-posts) { + z-index: 10; + } - .post .layout > div:first-child:not(.recent-posts) { - border-radius: 12px 12px 0 0; - } + .post .layout>div:first-child:not(.recent-posts) { + border-radius: 12px 12px 0 0; + } - .post .layout#content-inner { - background: var(--heo-main); - } + .post .layout#content-inner { + background: var(--heo-main); + } - .page .layout#content-inner { - background: var(--heo-background); - } + .page .layout#content-inner { + background: var(--heo-background); + } - #aside-content { - z-index: 99; - background: var(--heo-background); - padding: 0 1rem; - display: flex; - flex-direction: column; - width: 100%; - } + #aside-content { + z-index: 99; + background: var(--heo-background); + padding: 0 1rem; + display: flex; + flex-direction: column; + width: 100%; + } } .layout#content-inner { - max-width: 1400px; + max-width: 1400px; } .layout#content-inner p img { - margin: auto + margin: auto } /* 隐藏主页头图 */ .full_page #post-cover { - display: none; + display: none; } /* 文章头部 */ #page-header #post-info { - top: 0; - position: absolute; - padding: 0 3rem; - margin: 0 auto; - z-index: 10; - color: var(--heo-white); - max-width: 1400px; - display: flex; - flex-direction: column; - align-items: flex-start; - height: calc(100% + 0px); - justify-content: center; - animation: slide-in 0.6s 0s backwards; + top: 0; + position: absolute; + padding: 0 3rem; + margin: 0 auto; + z-index: 10; + color: var(--heo-white); + max-width: 1400px; + display: flex; + flex-direction: column; + align-items: flex-start; + height: calc(100% + 0px); + justify-content: center; + animation: slide-in 0.6s 0s backwards; } @media screen and (max-width: 768px) { - #page-header #post-info { - padding: 0 6%; - justify-content: normal; - padding-top: 18rem; - } + #page-header #post-info { + padding: 0 6%; + justify-content: normal; + padding-top: 18rem; + } } @media screen and (min-width: 1300px) { - #page-header #post-info { - height: calc(100% + 0px); - top: 0; - display: flex; - justify-content: center; - } + #page-header #post-info { + height: calc(100% + 0px); + top: 0; + display: flex; + justify-content: center; + } } -#post-info #post-meta > .meta-secondline > span:first-child { - margin-right: 0.8rem; +#post-info #post-meta>.meta-secondline>span:first-child { + margin-right: 0.8rem; } .meta-secondline span { - display: flex; - align-items: center; - line-height: 1; + display: flex; + align-items: center; + line-height: 1; } @media screen and (max-width: 768px) { - .meta-secondline span { - line-height: 1.5; - } + .meta-secondline span { + line-height: 1.5; + } } /* 文章时间分类信息 */ #post-firstinfo { - text-align: left; - display: flex; - white-space: nowrap; - -webkit-user-select: none; + text-align: left; + display: flex; + white-space: nowrap; + -webkit-user-select: none; } #post-firstinfo .post-meta__tags { - color: var(--heo-white); - opacity: 0.8; - margin-right: 8px; - padding: 0 8px 0 4px; - border-radius: 12px; - display: flex; - align-items: center; - flex-direction: row + color: var(--heo-white); + opacity: 0.8; + margin-right: 8px; + padding: 0 8px 0 4px; + border-radius: 12px; + display: flex; + align-items: center; + flex-direction: row } #post-firstinfo .post-meta__tags:hover { - color: var(--heo-white); - opacity: 1; - background: var(--heo-white-op) + color: var(--heo-white); + opacity: 1; + background: var(--heo-white-op) } span.post-meta-categories { - background-color: var(--heo-white-op); - padding: 0 0.5rem; - border-radius: 12px; - line-height: 32px; - height: 32px; - transition: 0.3s; - transition: .3s ease-out + background-color: var(--heo-white-op); + padding: 0 0.5rem; + border-radius: 12px; + line-height: 32px; + height: 32px; + transition: 0.3s; + transition: .3s ease-out } span.post-meta-categories:not(:first-child) { - margin-left: 8px; + margin-left: 8px; } span.post-meta-categories:hover { - background-color: var(--heo-white); + background-color: var(--heo-white); } a.post-meta-categories { - color: var(--heo-white); - font-size: 0.7rem; - width: 100%; - height: 100%; - display: flex; + color: var(--heo-white); + font-size: 0.7rem; + width: 100%; + height: 100%; + display: flex; } span.post-meta-categories:hover a.post-meta-categories { - color: var(--heo-main); + color: var(--heo-main); } .meta-firstline .tag_share { - margin-left: 1rem; + margin-left: 1rem; } .meta-firstline .tag_share .post-meta__tag-list { - display: flex; - flex-direction: row; - align-items: center + display: flex; + flex-direction: row; + align-items: center } #post-firstinfo .meta-firstline { - display: flex; - align-items: center; - height: 32px; + display: flex; + align-items: center; + height: 32px; } @media screen and (max-width: 768px) { - #post-firstinfo .meta-firstline { - margin-bottom: 0.4rem; - } + #post-firstinfo .meta-firstline { + margin-bottom: 0.4rem; + } } /* 文章作者信息和时间 */ .meta-avatar img { - width: 30px; - border-radius: 30px; - height: 30px; + width: 30px; + border-radius: 30px; + height: 30px; } a.post-meta-original { - background: var(--heo-white-op) !important; - color: var(--heo-white) !important; - padding: 0 0.5rem; - font-size: 0.7rem; - margin: auto; - border-radius: 12px; - font-weight: bold; - height: 32px; - line-height: 32px; - width: 100%; - height: 100%; - display: flex; + background: var(--heo-white-op) !important; + color: var(--heo-white) !important; + padding: 0 0.5rem; + font-size: 0.7rem; + margin: auto; + border-radius: 12px; + font-weight: bold; + height: 32px; + line-height: 32px; + width: 100%; + height: 100%; + display: flex; } a.post-meta-original:hover { - color: var(--heo-main) !important; - background: var(--heo-white) !important; + color: var(--heo-main) !important; + background: var(--heo-white) !important; } .meta-avatar img:hover { - transform: rotate(360deg); + transform: rotate(360deg); } @media screen and (max-width: 768px) { - .meta-share-time { - display: none !important; - } + .meta-share-time { + display: none !important; + } - #post-info #post-meta { - z-index: 1; - } + #post-info #post-meta { + z-index: 1; + } - #post-info:after { - position: absolute; - content: ''; - width: 100%; - height: 200%; - bottom: 0; - left: 0; - box-shadow: 0px -214px 287px 45px var(--heo-main) inset; - z-index: 0; - } + #post-info:after { + position: absolute; + content: ''; + width: 100%; + height: 200%; + bottom: 0; + left: 0; + box-shadow: 0px -214px 287px 45px var(--heo-main) inset; + z-index: 0; + } - .meta-secondline { - justify-content: center !important; - } + .meta-secondline { + justify-content: center !important; + } - .post-meta__tag-list { - display: none; - } + .post-meta__tag-list { + display: none; + } - .typed-cursor { - display: none; - } + .typed-cursor { + display: none; + } - .meta-avatar { - display: none !important; - } + .meta-avatar { + display: none !important; + } - #post-firstinfo { - white-space: nowrap; - margin: 0 auto; - z-index: 1; - } + #post-firstinfo { + white-space: nowrap; + margin: 0 auto; + z-index: 1; + } - .meta-firstline .tag_share { - display: none; - } + .meta-firstline .tag_share { + display: none; + } } .post-meta__tag-list::-webkit-scrollbar { - display: none; + display: none; } .meta-share-time a:hover { - background: none !important; + background: none !important; } .meta-share-time .meta-avatar-name { - opacity: 1; - color: var(--heo-white) !important; - font-weight: bold; + opacity: 1; + color: var(--heo-white) !important; + font-weight: bold; } .meta-share-time { - display: flex; + display: flex; } .meta-share-time .meta-info { - margin: 0 0.5rem; + margin: 0 0.5rem; } .meta-secondline { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: flex-start; - align-items: center; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: flex-start; + align-items: center; } .meta-avatar { - display: flex; + display: flex; } .meta-avatar .meta-avatar-name { - margin: 0 0.5rem; + margin: 0 0.5rem; } /* 热度图标 */ #post-info #post-meta .fab { - margin-bottom: 3px; - font-size: 15px; + margin-bottom: 3px; + font-size: 15px; } /* 热度间隔 */ span.post-meta-pv-cv { - margin-left: 0.8rem; + margin-left: 0.8rem; } /* 微信公众号同步 */ span.post-meta-wechat { - margin-right: 10px; - opacity: 0.6; + margin-right: 10px; + opacity: 0.6; } span.post-meta-position { - margin-right: 0.8rem; - opacity: 0.6; + margin-right: 0.8rem; + opacity: 0.6; } /* 隐藏信息文字 */ #post-info #post-meta .post-meta-label { - display: none; + display: none; } /* 图标数字间距 */ #post-info #post-meta .post-meta-icon { - margin-right: 0.2rem; + margin-right: 0.2rem; } /* 每组间距 */ #post-info #post-meta .post-meta-separator { - margin: 0px 0.4rem; + margin: 0px 0.4rem; } /* 文章信息数值 */ .post-meta-pv-cv #visit { - font-weight: 800; + font-weight: 800; } -#post-meta > div > span.post-meta-wordcount > span.word-count { - font-weight: 800; +#post-meta>div>span.post-meta-wordcount>span.word-count { + font-weight: 800; } -#post-meta > div > span.post-meta-wordcount > span:nth-child(7) { - font-weight: 800; +#post-meta>div>span.post-meta-wordcount>span:nth-child(7) { + font-weight: 800; } -#post-firstinfo > div > span.post-meta-categories > a { - font-weight: 800; +#post-firstinfo>div>span.post-meta-categories>a { + font-weight: 800; } /* 文章信息透明度 */ .post-meta-wordcount { - opacity: 0.6; - margin-right: 0.8rem + opacity: 0.6; + margin-right: 0.8rem } @media screen and (max-width: 768px) { - .post-meta-wordcount { - margin-left: 0; - } + .post-meta-wordcount { + margin-left: 0; + } } .post-meta-pv-cv { - opacity: 0.6; + opacity: 0.6; } -.post-meta-pv, .post-meta-commentcount, .post-meta-editor { - opacity: 0.6; - margin-right: 2px +.post-meta-pv, +.post-meta-commentcount, +.post-meta-editor { + opacity: 0.6; + margin-right: 2px } -#twikoo-count, #ArtalkCount { - font-weight: 800; - color: var(--heo-white); +#twikoo-count, +#ArtalkCount { + font-weight: 800; + color: var(--heo-white); } #comment-count { - font-weight: 800; - color: var(--heo-white); + font-weight: 800; + color: var(--heo-white); } .el-textarea .el-input__count { - color: var(--heo-secondtext) !important; - -webkit-user-select: none; - bottom: 8px !important; - right: 12px !important + color: var(--heo-secondtext) !important; + -webkit-user-select: none; + bottom: 8px !important; + right: 12px !important } .post-meta-commentcount i { - margin-right: 0.5rem; + margin-right: 0.5rem; } /* 文章内图片保持一行 */ .inline-image { - display: flex; - margin: 8px auto; - width: fit-content; - justify-content: center; + display: flex; + margin: 8px auto; + width: fit-content; + justify-content: center; } .inline-image a:hover { - background: 0 0 !important; - box-shadow: none !important; + background: 0 0 !important; + box-shadow: none !important; } .inline-image img { - margin: 0; - display: inline-flex; - margin-bottom: 0 !important; + margin: 0; + display: inline-flex; + margin-bottom: 0 !important; } /* 文章标题 */ #post-info .post-title { - color: var(--heo-white); - font-weight: 700; - font-size: 2.3rem; - line-height: 1.2; - text-align: left; - margin: 1rem 0 1rem 0 !important; - -webkit-line-clamp: 2; - padding: 0; - overflow: hidden; + color: var(--heo-white); + font-weight: 700; + font-size: 2.3rem; + line-height: 1.2; + text-align: left; + margin: 1rem 0 1rem 0 !important; + -webkit-line-clamp: 2; + padding: 0; + overflow: hidden; } @media screen and (max-width: 768px) { - #post-info .post-title { - font-size: 1.2rem; - -webkit-line-clamp: 3; - margin: 0.2rem auto !important; - text-align: center; - z-index: 1; - } + #post-info .post-title { + font-size: 1.2rem; + -webkit-line-clamp: 3; + margin: 0.2rem auto !important; + text-align: center; + z-index: 1; + } } /* 文章顶部其他信息 */ -#post-meta > div { - text-align: left; +#post-meta>div { + text-align: left; } #post-info #post-meta { - color: var(--heo-white); - margin-top: 0.4rem; - transition: 0.3s; - display: flex; - -webkit-user-select: none; + color: var(--heo-white); + margin-top: 0.4rem; + transition: 0.3s; + display: flex; + -webkit-user-select: none; } #post-info #post-meta a { - text-decoration: none; - color: var(--heo-fontcolor); - line-height: 1; - border-radius: 12px + text-decoration: none; + color: var(--heo-fontcolor); + line-height: 1; + border-radius: 12px } #post-info #post-meta a:hover { - text-decoration: none; - color: var(--heo-white) + text-decoration: none; + color: var(--heo-white) } #post-info #post-meta i { - line-height: 1 + line-height: 1 } /* 文章标题前图标 */ @@ -11065,8 +11089,8 @@ span.post-meta-position { #article-container h4:before, #article-container h5:before, #article-container h6:before { - top: calc(50% - .45rem); - content: ''; + top: calc(50% - .45rem); + content: ''; } /* 文章标题前图标悬浮 */ @@ -11076,7 +11100,7 @@ span.post-meta-position { #article-container h4:hover:before, #article-container h5:hover:before, #article-container h6:hover:before { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } /* 标题悬浮效果 */ @@ -11086,398 +11110,401 @@ span.post-meta-position { #article-container h4:hover, #article-container h5:hover, #article-container h6:hover { - padding-left: 1.3rem; + padding-left: 1.3rem; } /* 文章tab样式 */ -#article-container ul > li:not(.tab):before { - border: 0.21em solid var(--heo-main); - background: var(--heo-main); +#article-container ul>li:not(.tab):before { + border: 0.21em solid var(--heo-main); + background: var(--heo-main); } #article-container ol, #article-container ul { - padding: 0; + padding: 0; } #article-container .tabs { - margin: 1rem 0 !important; - border-radius: 12px; - overflow: hidden; - box-shadow: var(--heo-shadow-border); - padding: 8px; - background: var(--heo-card-bg); - border: var(--style-border); + margin: 1rem 0 !important; + border-radius: 12px; + overflow: hidden; + box-shadow: var(--heo-shadow-border); + padding: 8px; + background: var(--heo-card-bg); + border: var(--style-border); } #article-container .tabs .nav-tabs { - background: var(--heo-card-bg); - padding: 16px; - display: flex; - justify-content: center; - flex-wrap: wrap; - flex-direction: row; + background: var(--heo-card-bg); + padding: 16px; + display: flex; + justify-content: center; + flex-wrap: wrap; + flex-direction: row; } @media screen and (max-width: 768px) { - #article-container .tabs .nav-tabs { - padding: 0; - margin-bottom: 8px; - } + #article-container .tabs .nav-tabs { + padding: 0; + margin-bottom: 8px; + } } -#article-container .tabs > .nav-tabs > .tab.active button { - border: var(--style-border-hover-always); - background: var(--heo-background); - border-radius: 8px; +#article-container .tabs>.nav-tabs>.tab.active button { + border: var(--style-border-hover-always); + background: var(--heo-background); + border-radius: 8px; } -#article-container .tabs > .nav-tabs > .tab button { - transition: all 0s; - -webkit-transition: all 0s; - background: var(--heo-secondbg); - transition: 0.3s; - border: var(--style-border-always); - border-radius: 8px; - font-size: 14px; - padding: 8px 16px; - display: block; - line-height: 1; - width: 100%; - color: var(--heo-fontcolor); +#article-container .tabs>.nav-tabs>.tab button { + transition: all 0s; + -webkit-transition: all 0s; + background: var(--heo-secondbg); + transition: 0.3s; + border: var(--style-border-always); + border-radius: 8px; + font-size: 14px; + padding: 8px 16px; + display: block; + line-height: 1; + width: 100%; + color: var(--heo-fontcolor); } -#article-container .tabs > .nav-tabs > .tab:not(.active) button:hover { - background: var(--heo-main); - color: var(--heo-white); - transition: 0.3s; - border: var(--style-border-hover-always); +#article-container .tabs>.nav-tabs>.tab:not(.active) button:hover { + background: var(--heo-main); + color: var(--heo-white); + transition: 0.3s; + border: var(--style-border-hover-always); } .tab-item-content { - background: var(--heo-card-bg); + background: var(--heo-card-bg); } /* tab边框 */ #article-container .tabs { - border: 3px solid var(--heo-secondbg) !important; + border: 3px solid var(--heo-secondbg) !important; } /* 切换tab标签 */ -#article-container .tabs > .tab-contents .tab-item-content.active { - animation: tabshow 0s; - -webkit-animation: tabshow 0s; - padding: 1.2rem 1.2rem; - border-radius: 8px; +#article-container .tabs>.tab-contents .tab-item-content.active { + animation: tabshow 0s; + -webkit-animation: tabshow 0s; + padding: 1.2rem 1.2rem; + border-radius: 8px; } @media screen and (max-width: 768px) { - #article-container .tabs > .tab-contents .tab-item-content.active { - padding: 0.5rem 0.5rem; - } + #article-container .tabs>.tab-contents .tab-item-content.active { + padding: 0.5rem 0.5rem; + } } .tab-contents { - border-radius: 8px; - overflow: hidden; + border-radius: 8px; + overflow: hidden; } /* 文章details折叠 */ details:not(.tk-admin-config-group):not(.card-friend-class-name) { - display: block; - position: relative; - margin-bottom: 1rem; - min-height: 54px; - overflow: hidden; - border-radius: 12px; - border: var(--style-border); - transition: border 0.3s; + display: block; + position: relative; + margin-bottom: 1rem; + min-height: 54px; + overflow: hidden; + border-radius: 12px; + border: var(--style-border); + transition: border 0.3s; } details:not(.tk-admin-config-group):not(.card-friend-class-name):hover { - border: var(--style-border-hover-always); + border: var(--style-border-hover-always); } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary { - position: absolute; - padding: 0.5rem 1rem; - background: var(--heo-card-bg); - margin: 0; - transition: 0.3s; - box-shadow: var(--heo-shadow-border); - position: absolute; - left: 0; - width: 100%; - font-weight: bold; - white-space: nowrap; /* 禁止换行 */ - overflow: hidden; /* 超出部分隐藏 */ - text-overflow: ellipsis; /* 超出部分用省略号表示 */ + position: absolute; + padding: 0.5rem 1rem; + background: var(--heo-card-bg); + margin: 0; + transition: 0.3s; + box-shadow: var(--heo-shadow-border); + position: absolute; + left: 0; + width: 100%; + font-weight: bold; + white-space: nowrap; + /* 禁止换行 */ + overflow: hidden; + /* 超出部分隐藏 */ + text-overflow: ellipsis; + /* 超出部分用省略号表示 */ } -details:not(.tk-admin-config-group):not(.card-friend-class-name) > *:nth-child(2) { - margin-top: calc(54px + 1rem) !important; +details:not(.tk-admin-config-group):not(.card-friend-class-name)>*:nth-child(2) { + margin-top: calc(54px + 1rem) !important; } details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) summary { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary::before { - content: ''; - padding: 4px; + content: ''; + padding: 4px; } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary:hover { - cursor: pointer; - background: var(--heo-main); - color: var(--heo-white); - transition: 0.3s; - box-shadow: var(--heo-shadow-main); + cursor: pointer; + background: var(--heo-main); + color: var(--heo-white); + transition: 0.3s; + box-shadow: var(--heo-shadow-main); } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary:focus { - outline: none; + outline: none; } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary::marker { - color: var(--heo-main); - transition: 0.3s; + color: var(--heo-main); + transition: 0.3s; } details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) summary::marker { - color: var(--heo-white); + color: var(--heo-white); } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary:hover::marker { - color: var(--heo-white); + color: var(--heo-white); } details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) { - border-radius: 12px; - border: var(--style-border-hover-always); - padding: 0 1.5rem; - background: var(--heo-card-bg); + border-radius: 12px; + border: var(--style-border-hover-always); + padding: 0 1.5rem; + background: var(--heo-card-bg); } details:not(.tk-admin-config-group):not(.card-friend-class-name) summary:hover:after { - position: absolute; - content: '+'; - text-align: center; - top: calc(50% - 2px); - transform: translateY(-50%); - right: 16px; - line-height: 1; + position: absolute; + content: '+'; + text-align: center; + top: calc(50% - 2px); + transform: translateY(-50%); + right: 16px; + line-height: 1; } -details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) > summary:hover:after { - content: '-'; +details[open]:not(.tk-admin-config-group):not(.card-friend-class-name)>summary:hover:after { + content: '-'; } @media screen and (max-width: 768px) { - details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) { - padding: 0 16px; - } + details[open]:not(.tk-admin-config-group):not(.card-friend-class-name) { + padding: 0 16px; + } } /* 文章点样式 */ -#article-container ul > li:not(.tab):hover:before { - border-color: var(--heo-none); +#article-container ul>li:not(.tab):hover:before { + border-color: var(--heo-none); } /* 文章中的超链接 */ #article-container a { - text-decoration: none; - border-bottom: 2px dotted var(--heo-main); - color: var(--heo-fontcolor); - font-weight: 700; - padding: 0 4px; - border-radius: 4px 4px 0 0 + text-decoration: none; + border-bottom: 2px dotted var(--heo-main); + color: var(--heo-fontcolor); + font-weight: 700; + padding: 0 4px; + border-radius: 4px 4px 0 0 } #article-container .site-card:hover a:not(.fancybox) { - text-decoration: none; - border-bottom: 2px solid var(--heo-none); - color: var(--heo-white); - background: var(--heo-main); - box-shadow: var(--heo-shadow-main) + text-decoration: none; + border-bottom: 2px solid var(--heo-none); + color: var(--heo-white); + background: var(--heo-main); + box-shadow: var(--heo-shadow-main) } #article-container a.fancybox { - border-bottom: 0; - padding: 0; - margin: auto; - display: contents; - width: fit-content; - -webkit-user-select: none + border-bottom: 0; + padding: 0; + margin: auto; + display: contents; + width: fit-content; + -webkit-user-select: none } #article-container a.fancybox img { - cursor: zoom-in + cursor: zoom-in } .site-card-avatar a.fancybox { - padding: 0 !important; + padding: 0 !important; } #article-container p { - margin: 1rem 0; - text-align: left; - letter-spacing: 0.6px; + margin: 1rem 0; + text-align: left; + letter-spacing: 0.6px; } /* 文章表格间距 */ .table-wrap { - margin: 1rem 0px; - border-radius: 8px; + margin: 1rem 0px; + border-radius: 8px; } table th, table td { - border: var(--style-border-always); + border: var(--style-border-always); } table thead { - background: var(--heo-secondbg); + background: var(--heo-secondbg); } /* 文章中的加粗文本颜色 */ b, strong { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } /* 文章字号 */ #article-container p { - font-size: 0.9rem; - line-height: 1.7; - font-weight: 400; + font-size: 0.9rem; + line-height: 1.7; + font-weight: 400; } #article-container.post-content h1, #article-container.post-content h2, #article-container.post-content h3, #article-container.post-content h4 { - /*display: flex;*/ - align-items: center; - justify-content: space-between; - flex-direction: row-reverse; + /*display: flex;*/ + align-items: center; + justify-content: space-between; + flex-direction: row-reverse; } #article-container.post-content h1 { - font-size: 1.5rem; - line-height: 1.3; + font-size: 1.5rem; + line-height: 1.3; } #article-container.post-content h2 { - font-size: 1.3rem; - line-height: 1.3; - border-top: 1px dashed var(--heo-theme-op); - padding-top: 1.5rem; + font-size: 1.3rem; + line-height: 1.3; + border-top: 1px dashed var(--heo-theme-op); + padding-top: 1.5rem; } #article-container.post-content h3 { - font-size: 1.1rem; - line-height: 1.3; + font-size: 1.1rem; + line-height: 1.3; } #article-container.post-content h4 { - font-size: 1.0rem; - line-height: 1.3; + font-size: 1.0rem; + line-height: 1.3; } @media screen and (max-width: 768px) { - #article-container p { - line-height: 1.5; - } + #article-container p { + line-height: 1.5; + } } /* 链接外挂标签 */ #article-container .tag-Link { - background: var(--heo-secondbg); - border-radius: 8px !important; - display: flex; - border: var(--style-border); - flex-direction: column; - padding: 0.5rem 1rem; - border-width: 1px !important; - margin-top: 1rem; + background: var(--heo-secondbg); + border-radius: 8px !important; + display: flex; + border: var(--style-border); + flex-direction: column; + padding: 0.5rem 1rem; + border-width: 1px !important; + margin-top: 1rem; } #article-container .tag-Link:hover { - border: 1px solid var(--heo-main); + border: 1px solid var(--heo-main); } #article-container .tag-Link .tag-link-tips { - border-bottom: var(--style-border-always); - padding-bottom: 4px; - font-size: 0.6rem; - color: var(--heo-gray); - font-weight: normal; - pointer-events: none; + border-bottom: var(--style-border-always); + padding-bottom: 4px; + font-size: 0.6rem; + color: var(--heo-gray); + font-weight: normal; + pointer-events: none; } #article-container .tag-Link:hover .tag-link-tips { - color: var(--heo-white); + color: var(--heo-white); } #article-container .tag-Link .tag-link-bottom { - display: flex; - margin-top: 0.5rem; - align-items: center; - justify-content: space-around; - pointer-events: none; + display: flex; + margin-top: 0.5rem; + align-items: center; + justify-content: space-around; + pointer-events: none; } #article-container .tag-Link .tag-link-bottom .tag-link-left { - width: 60px; - min-width: 60px; - height: 60px; - background-size: cover; - border-radius: 8px; - background-color: var(--heo-card-bg); - display: flex; - align-items: center; - justify-content: center + width: 60px; + min-width: 60px; + height: 60px; + background-size: cover; + border-radius: 8px; + background-color: var(--heo-card-bg); + display: flex; + align-items: center; + justify-content: center } #article-container .tag-Link .tag-link-bottom .tag-link-left i { - margin: 0; - padding: 0; - margin: auto; - font-size: 24px; - color: var(--heo-fontcolor) + margin: 0; + padding: 0; + margin: auto; + font-size: 24px; + color: var(--heo-fontcolor) } #article-container .tag-Link .tag-link-bottom .tag-link-right { - margin-left: 1rem; - pointer-events: none; + margin-left: 1rem; + pointer-events: none; } #article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-title { - font-size: 0.94rem; - line-height: 1.2; - pointer-events: none; + font-size: 0.94rem; + line-height: 1.2; + pointer-events: none; } #article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-sitename { - font-size: 0.7rem; - color: var(--heo-gray); - font-weight: normal; - margin-top: 4px; - pointer-events: none; + font-size: 0.7rem; + color: var(--heo-gray); + font-weight: normal; + margin-top: 4px; + pointer-events: none; } #article-container .tag-Link:hover .tag-link-bottom .tag-link-right .tag-link-sitename { - color: var(--heo-white); + color: var(--heo-white); } #article-container .tag-Link .tag-link-bottom i { - margin-left: auto; - padding-left: 0.5rem; - pointer-events: none; + margin-left: auto; + padding-left: 0.5rem; + pointer-events: none; } /* 文章标题 */ @@ -11487,120 +11514,120 @@ h3, h4, h5, h6 { - margin-top: 1rem; - padding-top: 0; - padding-left: 0 !important; - font-weight: weight; + margin-top: 1rem; + padding-top: 0; + padding-left: 0 !important; + font-weight: weight; } #post h2 { - margin-top: 1.5rem; + margin-top: 1.5rem; } -#article-container > h2:nth-child(1), -#article-container > h1:nth-child(1) { - margin: 0; +#article-container>h2:nth-child(1), +#article-container>h1:nth-child(1) { + margin: 0; } /* 隐藏阅读进度 */ #aside-content #card-toc .toc-content:before { - display: none; + display: none; } /* 文章引用 */ blockquote { - border: var(--style-border-always); - background-color: var(--heo-secondbg); - color: var(--heo-secondtext); - border-radius: 8px; - margin: 1rem 0; - padding: 0.5rem 0.8rem; + border: var(--style-border-always); + background-color: var(--heo-secondbg); + color: var(--heo-secondtext); + border-radius: 8px; + margin: 1rem 0; + padding: 0.5rem 0.8rem; } blockquote p { - padding: 0; + padding: 0; } /* 文章内标题 */ #article-container .headerlink::before { - content: "\e621"; - font-family: haofont !important; + content: "\e621"; + font-family: haofont !important; } #article-container .headerlink { - float: right; - opacity: 0.08; - border-bottom-style: none; - border-bottom: none; - position: relative; - padding: 0px; - border: none; - border-radius: 8px !important; - line-height: 1; - font-size: 1rem; + float: right; + opacity: 0.08; + border-bottom-style: none; + border-bottom: none; + position: relative; + padding: 0px; + border: none; + border-radius: 8px !important; + line-height: 1; + font-size: 1rem; } #article-container .headerlink:hover { - background: none !important; - opacity: 1; - border-bottom: none !important; - box-shadow: none !important; - background: var(--heo-none); - color: var(--heo-lighttext) !important; - text-decoration: none; + background: none !important; + opacity: 1; + border-bottom: none !important; + box-shadow: none !important; + background: var(--heo-none); + color: var(--heo-lighttext) !important; + text-decoration: none; } /* 文章边栏 */ #sidebar { - background: var(--heo-maskbg); + background: var(--heo-maskbg); } /* 文章图片 */ #article-container img { - border-radius: 12px; - margin-bottom: 0.5rem; - object-fit: cover; + border-radius: 12px; + margin-bottom: 0.5rem; + object-fit: cover; } #article-container img.error { - content: url(../images/404.gif) + content: url(../images/404.gif) } /* 文章视频 */ .doge-inner-player { - border-radius: 12px !important; + border-radius: 12px !important; } /* 文章数字头 */ #article-container ol li:before, #article-container ul li:before { - background: var(--heo-main); - cursor: default; + background: var(--heo-main); + cursor: default; } #article-container ol li:hover:before, #article-container ul li:hover:before { - transform: rotate(0deg); + transform: rotate(0deg); } #article-container .gutter { - opacity: 0.6; + opacity: 0.6; } #article-container .code-lang { - margin-left: 6px; + margin-left: 6px; } /* 结尾寄语 */ #readmore-talk { - text-align: center; - color: var(--heo-lighttext); - padding: 8px; - border-radius: 12px; - background: #f2b94b0c; + text-align: center; + color: var(--heo-lighttext); + padding: 8px; + border-radius: 12px; + background: #f2b94b0c; } /* 相关推荐 */ @@ -11608,312 +11635,312 @@ blockquote p { border-radius: 12px; } */ -.relatedPosts > .relatedPosts-list .cover::after { - content: ' '; - display: block; - position: absolute; - z-index: 0; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: url(../images/404.gif) 50%; - background-size: cover; +.relatedPosts>.relatedPosts-list .cover::after { + content: ' '; + display: block; + position: absolute; + z-index: 0; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: url(../images/404.gif) 50%; + background-size: cover; } -.relatedPosts > .relatedPosts-list a { - display: flex; - width: 100%; - height: 100%; +.relatedPosts>.relatedPosts-list a { + display: flex; + width: 100%; + height: 100%; } @media screen and (min-width: 768px) { - #post > div.relatedPosts > div.relatedPosts-list > div { - -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); - } + #post>div.relatedPosts>div.relatedPosts-list>div { + -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); + } - #post > div.relatedPosts > div.relatedPosts-list > div { - border-radius: 12px; - } + #post>div.relatedPosts>div.relatedPosts-list>div { + border-radius: 12px; + } - .relatedPosts > .headline { - font-size: 0.8em; - } + .relatedPosts>.headline { + font-size: 0.8em; + } - @media screen and (max-width: 1300px) { - #post > div.relatedPosts > div.relatedPosts-list > div:nth-child(7) { - display: none; - } + @media screen and (max-width: 1300px) { + #post>div.relatedPosts>div.relatedPosts-list>div:nth-child(7) { + display: none; + } - #post > div.relatedPosts > div.relatedPosts-list > div:nth-child(8) { - display: none; - } - } + #post>div.relatedPosts>div.relatedPosts-list>div:nth-child(8) { + display: none; + } + } } -.relatedPosts > .headline { - margin-bottom: 0.8rem !important; - font-size: 1.2em; +.relatedPosts>.headline { + margin-bottom: 0.8rem !important; + font-size: 1.2em; } /* 文章标签 */ #post .tag_share .post-meta__tags { - background: var(--heo-card-bg); - border: var(--style-border-always); - color: var(--heo-fontcolor); - border-radius: 8px; - margin: 0; - display: flex; - align-items: center; - white-space: nowrap; - height: 34px; + background: var(--heo-card-bg); + border: var(--style-border-always); + color: var(--heo-fontcolor); + border-radius: 8px; + margin: 0; + display: flex; + align-items: center; + white-space: nowrap; + height: 34px; } #post .tag_share .post-meta__tags:hover { - background: var(--heo-lighttext); - box-shadow: var(--heo-shadow-main); - color: var(--heo-white); + background: var(--heo-lighttext); + box-shadow: var(--heo-shadow-main); + color: var(--heo-white); } @media screen and (min-width: 1300px) { - #post .tag_share .post-meta__tags { - background: var(--heo-card-bg); - border: var(--style-border); - } + #post .tag_share .post-meta__tags { + background: var(--heo-card-bg); + border: var(--style-border); + } - #post .tag_share .post-meta__tags:hover { - border: var(--style-border-hover); - } + #post .tag_share .post-meta__tags:hover { + border: var(--style-border-hover); + } } .post-copyright__author { - display: flex; - align-items: center; + display: flex; + align-items: center; } .post-copyright__original { - background: var(--heo-fontcolor); - color: var(--heo-card-bg); - padding: 0.2rem 0.5rem; - font-size: 0.7rem; - border-radius: 8px; - margin-right: 0.5rem; - font-weight: bold; - line-height: 1.5; - white-space: nowrap; + background: var(--heo-fontcolor); + color: var(--heo-card-bg); + padding: 0.2rem 0.5rem; + font-size: 0.7rem; + border-radius: 8px; + margin-right: 0.5rem; + font-weight: bold; + line-height: 1.5; + white-space: nowrap; } .post-copyright__original:hover { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } @media screen and (max-width: 768px) { - #post .post-copyright { - box-shadow: var(--heo-shadow-border); - } + #post .post-copyright { + box-shadow: var(--heo-shadow-border); + } - .post-copyright .post-meta-original { - display: none; - } + .post-copyright .post-meta-original { + display: none; + } - .post-copyright__original { - display: none; - } + .post-copyright__original { + display: none; + } - #post .post-copyright:after { - display: none; - } + #post .post-copyright:after { + display: none; + } } /* 复制按钮 */ .post-copyright-copybtn { - margin-left: 0.5rem; - color: var(--heo-fontcolor); - opacity: 0.4; - transition: 0.3s; + margin-left: 0.5rem; + color: var(--heo-fontcolor); + opacity: 0.4; + transition: 0.3s; } .post-copyright-copybtn:hover { - opacity: 1; - transition: 0.3s; + opacity: 1; + transition: 0.3s; } #post .post-copyright .post-copyright__notice .post-copyright-info a { - padding: 0 4px; + padding: 0 4px; } #post .post-copyright .post-copyright-title { - padding-left: 0; - color: var(--heo-fontcolor); - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: 1; - -webkit-box-orient: vertical; - font-size: 1rem; - font-weight: bold; + padding-left: 0; + color: var(--heo-fontcolor); + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + font-size: 1rem; + font-weight: bold; } #post .post-copyright .post-copyright-title:hover { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } -#post > div.post-copyright > div.post-copyright__author > span > span { - padding: 0; - color: var(--heo-fontcolor); - font-weight: bold; - font-size: 1rem; - line-height: 1.38; - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: 1; - -webkit-box-orient: vertical; +#post>div.post-copyright>div.post-copyright__author>span>span { + padding: 0; + color: var(--heo-fontcolor); + font-weight: bold; + font-size: 1rem; + line-height: 1.38; + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; } @media screen and (max-width: 768px) { - #post > div.post-copyright > div.post-copyright__author > span > span { - -webkit-line-clamp: 3; - } + #post>div.post-copyright>div.post-copyright__author>span>span { + -webkit-line-clamp: 3; + } - #post .post-copyright .post-copyright-info { - -webkit-line-clamp: 2; - } + #post .post-copyright .post-copyright-info { + -webkit-line-clamp: 2; + } - #post .post-copyright .post-copyright-title { - -webkit-line-clamp: 3; - line-height: 1.2; - } + #post .post-copyright .post-copyright-title { + -webkit-line-clamp: 3; + line-height: 1.2; + } } /* 链接 */ -#post > div.post-copyright > div.post-copyright__type { - line-height: 16px; - display: flex; - margin-top: 8px; +#post>div.post-copyright>div.post-copyright__type { + line-height: 16px; + display: flex; + margin-top: 8px; } -#post > div.post-copyright > div.post-copyright__type > span > a { - font-size: 14px; - opacity: 0.6; - line-height: 16px; +#post>div.post-copyright>div.post-copyright__type>span>a { + font-size: 14px; + opacity: 0.6; + line-height: 16px; } -#post > div.post-copyright > div.post-copyright__type > span > a:hover { - opacity: 1; - background: none; +#post>div.post-copyright>div.post-copyright__type>span>a:hover { + opacity: 1; + background: none; } #post-copyright-url a { - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: 1; - -webkit-box-orient: vertical; + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; } /* 装饰圈 */ #post .post-copyright:before { - display: none; + display: none; } .post-reward:hover .reward-button { - color: var(--heo-white); - background: var(--heo-theme); - box-shadow: none; + color: var(--heo-white); + background: var(--heo-theme); + box-shadow: none; } .share-button .fa-qrcode:before { - font-size: 1rem; + font-size: 1rem; } .post-qr-code-img { - box-shadow: var(--heo-shadow-lightblack); - border-radius: 12px; - border: var(--style-border-always); + box-shadow: var(--heo-shadow-lightblack); + border-radius: 12px; + border: var(--style-border-always); } .post-reward .reward-main .reward-all .reward-item .post-qr-code-desc { - padding-top: 0rem; - margin-top: -8px; - margin-bottom: 8px; + padding-top: 0rem; + margin-top: -8px; + margin-bottom: 8px; } .post-reward .reward-main .reward-all { - border-radius: 12px; - background: var(--heo-card-bg); - border: var(--style-border-always); - padding: 0.8rem; - display: flex; - box-shadow: var(--heo-shadow-border); - flex-direction: column; - align-items: center; + border-radius: 12px; + background: var(--heo-card-bg); + border: var(--style-border-always); + padding: 0.8rem; + display: flex; + box-shadow: var(--heo-shadow-border); + flex-direction: column; + align-items: center; } /* 赞赏描述 */ .reward-dec { - font-size: 0.6rem; + font-size: 0.6rem; } /* 赞赏名单 */ .reward-text { - margin-bottom: 0rem; - font-weight: bold; + margin-bottom: 0rem; + font-weight: bold; } /* 赞赏名单按钮 */ a.reward-main-btn { - background: var(--heo-secondbg); - color: var(--heo-fontcolor); - display: flex; - flex-direction: column; - border-radius: 12px; - padding: 4px 0; - border: var(--style-border-always); - margin: 8px; - width: 100%; + background: var(--heo-secondbg); + color: var(--heo-fontcolor); + display: flex; + flex-direction: column; + border-radius: 12px; + padding: 4px 0; + border: var(--style-border-always); + margin: 8px; + width: 100%; } a.reward-main-btn:hover { - color: var(--heo-white); - background: var(--heo-red); - background-image: url(../images/hua.gif); - box-shadow: var(--heo-shadow-red); + color: var(--heo-white); + background: var(--heo-red); + background-image: url(../images/hua.gif); + box-shadow: var(--heo-shadow-red); } .reward-title { - font-weight: bold; - color: var(--heo-red); + font-weight: bold; + color: var(--heo-red); } /* 赞赏背景 */ #quit-box { - position: fixed; - width: 100vw; - height: calc(100vh); - background: rgba(0, 0, 0, .2); - opacity: 0.01; - top: 0; - left: 0; - display: none; - z-index: 109; - margin: 0 !important + position: fixed; + width: 100vw; + height: calc(100vh); + background: rgba(0, 0, 0, .2); + opacity: 0.01; + top: 0; + left: 0; + display: none; + z-index: 109; + margin: 0 !important } .post-tools-left #quit-box { - display: none; + display: none; } @media screen and (max-width: 768px) { - #quit-box { - z-index: 109; - display: none !important; - } + #quit-box { + z-index: 109; + display: none !important; + } } @@ -11923,470 +11950,485 @@ a.reward-main-btn:hover { .prev-post.pull-left, #pagination .prev-post, #pagination .next-post { - background: #363636; + background: #363636; } #preimg { - position: absolute; - width: 100%; - height: 100%; - opacity: .4; - -webkit-transition: all .6s, filter 375ms ease-in .2s; - -moz-transition: all .6s, filter 375ms ease-in .2s; - -o-transition: all .6s, filter 375ms ease-in .2s; - -ms-transition: all .6s, filter 375ms ease-in .2s; - transition: all .6s, filter 375ms ease-in .2s; - object-fit: cover; - border-radius: 0; + position: absolute; + width: 100%; + height: 100%; + opacity: .4; + -webkit-transition: all .6s, filter 375ms ease-in .2s; + -moz-transition: all .6s, filter 375ms ease-in .2s; + -o-transition: all .6s, filter 375ms ease-in .2s; + -ms-transition: all .6s, filter 375ms ease-in .2s; + transition: all .6s, filter 375ms ease-in .2s; + object-fit: cover; + border-radius: 0; } .prev-post.pull-left:hover #preimg { - opacity: 1; - transform: scale(1.1); + opacity: 1; + transform: scale(1.1); } .next-post.pull-right:hover #preimg { - opacity: 1; - transform: scale(1.1); + opacity: 1; + transform: scale(1.1); } @media screen and (min-width: 768px) { - #pagination .next-post a { - border-left: var(--heo-main-op); - border-left-width: .5px; - border-left-style: solid; - display: flex; - align-items: flex-start; - height: 150px; - } + #pagination .next-post a { + border-left: var(--heo-main-op); + border-left-width: .5px; + border-left-style: solid; + display: flex; + align-items: flex-start; + height: 150px; + } - #pagination .next-post.pull-full a { - border-left-width: 0px; - } + #pagination .next-post.pull-full a { + border-left-width: 0px; + } - #pagination .prev-post a { - border-right: var(--heo-main-op); - border-right-width: .5px; - border-right-style: solid - } + #pagination .prev-post a { + border-right: var(--heo-main-op); + border-right-width: .5px; + border-right-style: solid + } - #pagination .pagination-info { - padding: 1rem 1.5rem 1rem 1.5rem; - position: relative; - display: flex; - top: 0; - transform: none; - flex-direction: column; - justify-content: center; - margin: auto; - height: 100%; - } + #pagination .pagination-info { + padding: 1rem 1.5rem 1rem 1.5rem; + position: relative; + display: flex; + top: 0; + transform: none; + flex-direction: column; + justify-content: center; + margin: auto; + height: 100%; + } - #pagination .next-post a:hover div, #pagination .prev-post a:hover div { - color: var(--heo-white) !important - } + #pagination .next-post a:hover div, + #pagination .prev-post a:hover div { + color: var(--heo-white) !important + } } @media screen and (max-width: 768px) { - #pagination .next-post a:hover, #pagination .prev-post a:hover { - background: var(--heo-none) - } + #pagination .next-post a:hover, + #pagination .prev-post a:hover { + background: var(--heo-none) + } } #pagination img.prev-cover, #pagination img.next-cover { - opacity: 0.15; - transform: scale(1.03); - transition: 0.3s; - filter: blur(0px); - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; + opacity: 0.15; + transform: scale(1.03); + transition: 0.3s; + filter: blur(0px); + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; } #pagination .prev-post:hover img.prev-cover, #pagination .next-post:hover img.prev-cover, #pagination .prev-post:hover img.next-cover, #pagination .next-post:hover img.next-cover { - opacity: 0.25; - transform: scale(1.03); - filter: blur(5px); + opacity: 0.25; + transform: scale(1.03); + filter: blur(5px); } -#pagination .next_info, #post #pagination .prev_info { - font-weight: 700; - -webkit-line-clamp: 2; - white-space: normal; - line-height: 1.3; - font-size: .9rem; - display: -webkit-box; - -webkit-box-orient: vertical; - overflow: hidden; - margin-bottom: 10px +#pagination .next_info, +#post #pagination .prev_info { + font-weight: 700; + -webkit-line-clamp: 2; + white-space: normal; + line-height: 1.3; + font-size: .9rem; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + margin-bottom: 10px } #post #pagination { - overflow: hidden; - position: inherit; - border: var(--style-border-always) + overflow: hidden; + position: inherit; + border: var(--style-border-always) } #pagination.pagination-post { - background: var(--heo-card-bg); + background: var(--heo-card-bg); } @media screen and (min-width: 1300px) { - #post #pagination { - position: fixed; - width: 300px; - bottom: -100px; - right: 20px; - z-index: 1000; - height: fit-content; - transition: cubic-bezier(.42, 0, .3, 1.11) .3s; - border: var(--style-border); - border-radius: 12px; - overflow: hidden; - cursor: pointer; - opacity: 0; - z-index: 999 - } + #post #pagination { + position: fixed; + width: 300px; + bottom: -100px; + right: 20px; + z-index: 1000; + height: fit-content; + transition: cubic-bezier(.42, 0, .3, 1.11) .3s; + border: var(--style-border); + border-radius: 12px; + overflow: hidden; + cursor: pointer; + opacity: 0; + z-index: 999 + } - #post #pagination.show-window { - bottom: 20px; - opacity: 1 - } + #post #pagination.show-window { + bottom: 20px; + opacity: 1 + } - #post #pagination:hover { - border: 1px solid var(--heo-main) - } + #post #pagination:hover { + border: 1px solid var(--heo-main) + } - #pagination .next-post a, #pagination .prev-post a { - border: none; - height: fit-content; - padding: .5rem 0 - } + #pagination .next-post a, + #pagination .prev-post a { + border: none; + height: fit-content; + padding: .5rem 0 + } - #pagination.pagination-post { - border-radius: 0 - } + #pagination.pagination-post { + border-radius: 0 + } - #pagination .next_info, #post #pagination .prev_info { - font-size: 14px; - font-weight: 400; - margin-bottom: 0 - } + #pagination .next_info, + #post #pagination .prev_info { + font-size: 14px; + font-weight: 400; + margin-bottom: 0 + } - #pagination .pagination-info { - padding: .5rem 1rem; - transform: none - } + #pagination .pagination-info { + padding: .5rem 1rem; + transform: none + } - #post #pagination { - background: 0 0 - } + #post #pagination { + background: 0 0 + } - #pagination .next_info, #post #pagination .prev_info { - color: var(--heo-fontcolor); - } + #pagination .next_info, + #post #pagination .prev_info { + color: var(--heo-fontcolor); + } - #pagination .next-post, #pagination .prev-post, .next-post.pull-right, .prev-post.pull-left { - background: var(--heo-maskbgdeep); - -webkit-backdrop-filter: blur(5px); - backdrop-filter: blur(5px); - transform: translateZ(0) - } + #pagination .next-post, + #pagination .prev-post, + .next-post.pull-right, + .prev-post.pull-left { + background: var(--heo-maskbgdeep); + -webkit-backdrop-filter: blur(5px); + backdrop-filter: blur(5px); + transform: translateZ(0) + } - #pagination .next-post a:hover, #pagination .prev-post a:hover { - background: var(--heo-main); - } + #pagination .next-post a:hover, + #pagination .prev-post a:hover { + background: var(--heo-main); + } - #pagination .next-post .label, #post #pagination .prev-post .label { - color: var(--heo-fontcolor) - } + #pagination .next-post .label, + #post #pagination .prev-post .label { + color: var(--heo-fontcolor) + } - #pagination.pagination-post .next-post.pull-full img, #pagination.pagination-post .next-post.pull-right img, #pagination.pagination-post .prev-post.pull-full img, #pagination.pagination-post .prev-post.pull-left img { - display: none; - top: 0 - } + #pagination.pagination-post .next-post.pull-full img, + #pagination.pagination-post .next-post.pull-right img, + #pagination.pagination-post .prev-post.pull-full img, + #pagination.pagination-post .prev-post.pull-left img { + display: none; + top: 0 + } - #post #pagination .prev-post .label, - #pagination .next-post .label { - color: var(--heo-fontcolor) - } + #post #pagination .prev-post .label, + #pagination .next-post .label { + color: var(--heo-fontcolor) + } - .prev-post.pull-left { - display: none - } + .prev-post.pull-left { + display: none + } - .next-post.pull-right { - width: 100% !important - } + .next-post.pull-right { + width: 100% !important + } - #pagination .next-post .pagination-info { - text-align: left; - position: relative - } + #pagination .next-post .pagination-info { + text-align: left; + position: relative + } - #pagination .next-post .label, #post #pagination .prev-post .label { - color: var(--heo-fontcolor); - font-weight: 700; - font-size: 12px; - margin-bottom: .5rem; - border-bottom: var(--style-border); - line-height: 1; - padding-bottom: .5rem - } + #pagination .next-post .label, + #post #pagination .prev-post .label { + color: var(--heo-fontcolor); + font-weight: 700; + font-size: 12px; + margin-bottom: .5rem; + border-bottom: var(--style-border); + line-height: 1; + padding-bottom: .5rem + } } @media screen and (max-width: 768px) { - .prev-post.pull-left { - border-bottom: var(--style-border-always); - } + .prev-post.pull-left { + border-bottom: var(--style-border-always); + } - #post #pagination { - border-radius: 12px; - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - } + #post #pagination { + border-radius: 12px; + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + } - #post #pagination .prev-post .label, - #pagination .next-post .label { - text-align: left; - } + #post #pagination .prev-post .label, + #pagination .next-post .label { + text-align: left; + } - #post #pagination .prev_info, - #pagination .next_info { - text-align: left; - } + #post #pagination .prev_info, + #pagination .next_info { + text-align: left; + } } /* 翻页 */ @media screen and (max-width: 768px) { - #pagination .page-number { - display: none; - } + #pagination .page-number { + display: none; + } - #pagination .pagination .space { - display: none; - } + #pagination .pagination .space { + display: none; + } - #pagination .pagination .extend { - width: 100%; - height: 2.5rem; - margin: .2rem 0 1rem 0; - border-radius: 12px; - line-height: 2.5rem; - background: var(--heo-card-bg); - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border) - } + #pagination .pagination .extend { + width: 100%; + height: 2.5rem; + margin: .2rem 0 1rem 0; + border-radius: 12px; + line-height: 2.5rem; + background: var(--heo-card-bg); + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border) + } - #pagination .pagination .extend i { - display: none; - } + #pagination .pagination .extend i { + display: none; + } - #pagination .pagination .extend:hover { - background: var(--heo-theme); - color: var(--heo-white); - } + #pagination .pagination .extend:hover { + background: var(--heo-theme); + color: var(--heo-white); + } - #pagination .pagination { - background: var(--heo-background); - transition: 0.3s; - display: flex; - } + #pagination .pagination { + background: var(--heo-background); + transition: 0.3s; + display: flex; + } } @media screen and (min-width: 768px) { - #pagination .page-number { - width: 2rem; - background: var(--heo-card-bg); - height: 2rem; - line-height: calc(2rem - 2px); - border-radius: 8px !important; - margin: 0 0.3rem; - box-shadow: var(--heo-shadow-border); - border: var(--style-border); - transition: 0.3s; - } + #pagination .page-number { + width: 2rem; + background: var(--heo-card-bg); + height: 2rem; + line-height: calc(2rem - 2px); + border-radius: 8px !important; + margin: 0 0.3rem; + box-shadow: var(--heo-shadow-border); + border: var(--style-border); + transition: 0.3s; + } - #pagination .page-number.current { - background: var(--heo-theme); - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-theme); - } + #pagination .page-number.current { + background: var(--heo-theme); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-theme); + } - #pagination .page-number.current:hover { - background: var(--heo-theme); - box-shadow: var(--heo-shadow-theme); - color: var(--heo-white); - } + #pagination .page-number.current:hover { + background: var(--heo-theme); + box-shadow: var(--heo-shadow-theme); + color: var(--heo-white); + } - #pagination .page-number:hover { - color: var(--heo-theme); - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); - transform: scale(1.03); - } + #pagination .page-number:hover { + color: var(--heo-theme); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); + transform: scale(1.03); + } - #pagination a.extend.next:hover, - #pagination a.extend.prev:hover { - color: var(--heo-theme); - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); - transform: scale(1.03); - } + #pagination a.extend.next:hover, + #pagination a.extend.prev:hover { + color: var(--heo-theme); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); + transform: scale(1.03); + } - @media screen and (min-width: 1300px) { - #pagination .page-number:hover { - transform: scale(1.03); - } + @media screen and (min-width: 1300px) { + #pagination .page-number:hover { + transform: scale(1.03); + } - #pagination a.extend.next:hover, - #pagination a.extend.prev:hover { - transform: scale(1.03); - } + #pagination a.extend.next:hover, + #pagination a.extend.prev:hover { + transform: scale(1.03); + } - #pagination .page-number:active { - transform: scale(0.97); - } + #pagination .page-number:active { + transform: scale(0.97); + } - #pagination a.extend.next:active, - #pagination a.extend.prev:active { - transform: scale(0.97); - } + #pagination a.extend.next:active, + #pagination a.extend.prev:active { + transform: scale(0.97); + } - } + } - #pagination span.space { - margin: 0 0.3rem; - } + #pagination span.space { + margin: 0 0.3rem; + } - #pagination a.extend.next, - #pagination a.extend.prev { - width: 4rem; - height: 2rem; - line-height: 1.9rem; - border-radius: 8px !important; - background: var(--heo-card-bg); - box-shadow: var(--heo-shadow-border); - position: absolute; - border: var(--style-border); - display: flex; - align-items: center; - justify-content: center; - overflow: hidden; - transition: 0.3s; - } + #pagination a.extend.next, + #pagination a.extend.prev { + width: 4rem; + height: 2rem; + line-height: 1.9rem; + border-radius: 8px !important; + background: var(--heo-card-bg); + box-shadow: var(--heo-shadow-border); + position: absolute; + border: var(--style-border); + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; + transition: 0.3s; + } - #pagination a.extend.next i, - #pagination a.extend.prev i { - transition: 0.3s; - } + #pagination a.extend.next i, + #pagination a.extend.prev i { + transition: 0.3s; + } - #pagination a.extend.next { - overflow: hidden; - } + #pagination a.extend.next { + overflow: hidden; + } - #pagination a.extend.next .pagination_tips_next { - margin-left: -32px; - transition: .3s ease-out 0s; - opacity: 0; - } + #pagination a.extend.next .pagination_tips_next { + margin-left: -32px; + transition: .3s ease-out 0s; + opacity: 0; + } - #pagination a.extend.next:hover .pagination_tips_next { - margin-left: 2px; - opacity: 1; - white-space: nowrap; - } + #pagination a.extend.next:hover .pagination_tips_next { + margin-left: 2px; + opacity: 1; + white-space: nowrap; + } - #pagination a.extend.prev .pagination_tips_prev { - margin-right: -32px; - transition: .3s ease-out 0s; - opacity: 0; - } + #pagination a.extend.prev .pagination_tips_prev { + margin-right: -32px; + transition: .3s ease-out 0s; + opacity: 0; + } - #pagination a.extend.prev:hover .pagination_tips_prev { - margin-right: 2px; - opacity: 1; - white-space: nowrap; - } + #pagination a.extend.prev:hover .pagination_tips_prev { + margin-right: 2px; + opacity: 1; + white-space: nowrap; + } - #pagination { - overflow: visible; - } + #pagination { + overflow: visible; + } - #pagination .pagination { - position: relative; - display: flex; - justify-content: center; - } + #pagination .pagination { + position: relative; + display: flex; + justify-content: center; + } } /* 相关推荐 */ -.relatedPosts > .relatedPosts-list > div:hover #preimg { - opacity: 1; - transform: scale(1.1); +.relatedPosts>.relatedPosts-list>div:hover #preimg { + opacity: 1; + transform: scale(1.1); } @media screen and (max-width: 768px) { - .relatedPosts { - display: none; - } + .relatedPosts { + display: none; + } - .relatedPosts > .relatedPosts-list > div { - border-radius: 4px; - } + .relatedPosts>.relatedPosts-list>div { + border-radius: 4px; + } } @media screen and (min-width: 1300px) { - .relatedPosts > .relatedPosts-list > div { - width: calc(25% - 8px); - } + .relatedPosts>.relatedPosts-list>div { + width: calc(25% - 8px); + } } -.relatedPosts > .relatedPosts-list > div:hover a .title { - color: var(--heo-white); +.relatedPosts>.relatedPosts-list>div:hover a .title { + color: var(--heo-white); } /* 分割线 */ -#post > hr { - display: none; +#post>hr { + display: none; } /* 文章tips */ .post-tips { - color: var(--heo-gray); - font-size: 14px; - position: absolute; - bottom: 1rem; - left: 2rem; + color: var(--heo-gray); + font-size: 14px; + position: absolute; + bottom: 1rem; + left: 2rem; } .post-tips a { - color: var(--heo-gray) !important; - border: none !important; + color: var(--heo-gray) !important; + border: none !important; } .post-tips a:hover { - color: var(--heo-main) !important; + color: var(--heo-main) !important; } @media screen and (max-width: 768px) { - .post-tips { - left: 1rem; - } + .post-tips { + left: 1rem; + } } /* 评论 */ @@ -12396,376 +12438,378 @@ a.reward-main-btn:hover { /* ---------------------------------------------------------------- */ /* ---------------------------------------------------------------- */ div#post-comment { - margin-top: 2rem; + margin-top: 2rem; } -#post-comment > div.comment-head > div.comment-privacy { - display: block; - justify-content: space-between; - margin-left: 8px; - font-size: 13px; - margin-left: auto; +#post-comment>div.comment-head>div.comment-privacy { + display: block; + justify-content: space-between; + margin-left: 8px; + font-size: 13px; + margin-left: auto; } -#post-comment > div.comment-head > div.comment-privacy a:hover { - color: var(--heo-theme); +#post-comment>div.comment-head>div.comment-privacy a:hover { + color: var(--heo-theme); } #post-comment .comment-tips { - background-color: rgba(103, 194, 58, 0.13); - border: var(--style-border-always); - border-color: var(--heo-green); - color: var(--heo-green); - border-radius: 8px; - padding: 8px 12px; - margin-top: 0.5rem; - display: none; - width: 100%; + background-color: rgba(103, 194, 58, 0.13); + border: var(--style-border-always); + border-color: var(--heo-green); + color: var(--heo-green); + border-radius: 8px; + padding: 8px 12px; + margin-top: 0.5rem; + display: none; + width: 100%; } .tk-content img { - max-height: 1100px !important; - max-width: 100% !important; - border-radius: 12px + max-height: 1100px !important; + max-width: 100% !important; + border-radius: 12px } #post-comment .comment-tips.show { - display: flex; - font-weight: bold; + display: flex; + font-weight: bold; } .el-input--small .el-input__inner { - padding: 8px; - padding-left: 16px + padding: 8px; + padding-left: 16px } /* 头像 */ .tk-avatar { - width: 32px !important; - height: 32px !important; - box-shadow: var(--heo-shadow-border); - margin-right: 16px !important + width: 32px !important; + height: 32px !important; + box-shadow: var(--heo-shadow-border); + margin-right: 16px !important } .tk-avatar.tk-has-avatar { - width: 32px !important; - height: 32px !important; - border-radius: 32px !important; + width: 32px !important; + height: 32px !important; + border-radius: 32px !important; } .tk-avatar.tk-has-avatar img { - border-radius: 32px !important; + border-radius: 32px !important; } .tk-row .tk-avatar { - display: none; + display: none; } .tk-avatar .tk-avatar-img { - height: 32px !important; + height: 32px !important; } .tk-avatar .tk-avatar-img:hover { - transform: rotate(360deg); + transform: rotate(360deg); } img.tk-avatar-img { - height: 32px !important; + height: 32px !important; } .tk-avatar { - margin-right: 0.5rem !important; + margin-right: 0.5rem !important; } /* 评论输入框提示 */ /* 设置文字内容 :nth-child(1)的作用是选择第几个 */ .el-input.el-input--small.el-input-group.el-input-group--prepend:nth-child(1):before { - content: '输入QQ号会自动获取昵称和头像'; + content: '输入QQ号会自动获取昵称和头像'; } .el-input.el-input--small.el-input-group.el-input-group--prepend:nth-child(2):before { - content: '收到回复将会发送到你的邮箱'; + content: '收到回复将会发送到你的邮箱'; } .el-input.el-input--small.el-input-group.el-input-group--prepend:nth-child(3):before { - content: '可以通过昵称访问你的网站'; + content: '可以通过昵称访问你的网站'; } /* 当用户点击输入框时显示 */ .el-input.el-input--small.el-input-group.el-input-group--prepend:focus-within::before { - display: block; - animation: commonTipsIn 0.3s; + display: block; + animation: commonTipsIn 0.3s; } .el-input.el-input--small.el-input-group.el-input-group--prepend:focus-within::after { - display: block; - animation: commonTriangleIn 0.3s; + display: block; + animation: commonTriangleIn 0.3s; } @keyframes commonTipsIn { - 0% { - top: -50px; - opacity: 0; - } + 0% { + top: -50px; + opacity: 0; + } - 100% { - top: -55px; - opacity: 1; - } + 100% { + top: -55px; + opacity: 1; + } } @keyframes commonTriangleIn { - 0% { - transform: translate(-50%, -36px); - opacity: 0; - } + 0% { + transform: translate(-50%, -36px); + opacity: 0; + } - 100% { - transform: translate(-50%, -46px); - opacity: 1; - } + 100% { + transform: translate(-50%, -46px); + opacity: 1; + } } /* 主内容区 */ .el-input.el-input--small.el-input-group.el-input-group--prepend::before { - /* 先隐藏起来 */ - display: none; - /* 绝对定位 */ - position: absolute; - /* 向上移动55像素 */ - top: -55px; - /* 文字强制不换行，防止left:50%导致的文字换行 */ - white-space: nowrap; - /* 圆角 */ - border-radius: 10px; - /* 距离左边50% */ - left: 50%; - /* 然后再向左边挪动自身的一半，即可实现居中 */ - transform: translate(-50%); - /* 填充 */ - padding: 14px 18px; - background: #444; - color: #fff; - z-index: 100; + /* 先隐藏起来 */ + display: none; + /* 绝对定位 */ + position: absolute; + /* 向上移动55像素 */ + top: -55px; + /* 文字强制不换行，防止left:50%导致的文字换行 */ + white-space: nowrap; + /* 圆角 */ + border-radius: 10px; + /* 距离左边50% */ + left: 50%; + /* 然后再向左边挪动自身的一半，即可实现居中 */ + transform: translate(-50%); + /* 填充 */ + padding: 14px 18px; + background: #444; + color: #fff; + z-index: 100; } /* 小角标 */ .el-input.el-input--small.el-input-group.el-input-group--prepend::after { - display: none; - content: ''; - position: absolute; - /* 内容大小（宽高）为0且边框大小不为0的情况下，每一条边（4个边）都是一个三角形，组成一个正方形。 + display: none; + content: ''; + position: absolute; + /* 内容大小（宽高）为0且边框大小不为0的情况下，每一条边（4个边）都是一个三角形，组成一个正方形。 我们先将所有边框透明，再给其中的一条边添加颜色就可以实现小三角图标 */ - border: 15px solid transparent; - border-top-color: #444; - left: 50%; - transform: translate(-50%, -46px); + border: 15px solid transparent; + border-top-color: #444; + left: 50%; + transform: translate(-50%, -46px); } /* 昵称 */ .tk-nick { - font-size: 1rem !important; - line-height: 32px; + font-size: 1rem !important; + line-height: 32px; } /* 填写项标题 */ -.el-input-group__append, .el-input-group__prepend { - background-color: var(--heo-card-bg) !important; - color: var(--heo-fontcolor) !important; - border-color: var(--heo-card-border) !important; - border: none !important; - font-weight: 700 +.el-input-group__append, +.el-input-group__prepend { + background-color: var(--heo-card-bg) !important; + color: var(--heo-fontcolor) !important; + border-color: var(--heo-card-border) !important; + border: none !important; + font-weight: 700 } /* 输入框 */ .el-input__inner { - background: var(--heo-secondbg) !important; - border: none !important; - color: var(--heo-fontcolor) !important; - padding-left: 8px + background: var(--heo-secondbg) !important; + border: none !important; + color: var(--heo-fontcolor) !important; + padding-left: 8px } .el-input.el-input--small.el-input-group.el-input-group--prepend { - border-radius: 12px; - background: var(--heo-secondbg); - border: var(--style-border-always); + border-radius: 12px; + background: var(--heo-secondbg); + border: var(--style-border-always); } -.el-input-group--prepend .el-input__inner, .el-input-group__append { - border-radius: 12px !important +.el-input-group--prepend .el-input__inner, +.el-input-group__append { + border-radius: 12px !important } .page .el-input.el-input--small.el-input-group.el-input-group--prepend { - background: var(--heo-card-bg) + background: var(--heo-card-bg) } @media screen and (max-width: 769px) { - .el-input__inner { - background: var(--heo-card-bg) !important - } + .el-input__inner { + background: var(--heo-card-bg) !important + } - .el-input.el-input--small.el-input-group.el-input-group--prepend { - background: var(--heo-card-bg); - margin-bottom: 0 - } + .el-input.el-input--small.el-input-group.el-input-group--prepend { + background: var(--heo-card-bg); + margin-bottom: 0 + } } .page .el-input__inner { - background: var(--heo-card-bg) !important + background: var(--heo-card-bg) !important } .el-input__inner:focus { - border: none !important + border: none !important } /* 评论输入框 */ .el-textarea__inner { - background: var(--heo-secondbg) !important; - color: var(--heo-fontcolor) !important; - border-radius: 12px !important; - min-height: 100px !important; - padding: 16px 16px 40px 16px !important; - border: var(--style-border-always) !important; - box-shadow: none !important; + background: var(--heo-secondbg) !important; + color: var(--heo-fontcolor) !important; + border-radius: 12px !important; + min-height: 100px !important; + padding: 16px 16px 40px 16px !important; + border: var(--style-border-always) !important; + box-shadow: none !important; } @media screen and (max-width: 768px) { - .el-textarea__inner { - background: var(--card-bg) !important; - overflow: hidden; - resize: none !important; - } + .el-textarea__inner { + background: var(--card-bg) !important; + overflow: hidden; + resize: none !important; + } } #page .el-textarea__inner { - background: var(--heo-card-bg) !important; - box-shadow: var(--heo-shadow-border); + background: var(--heo-card-bg) !important; + box-shadow: var(--heo-shadow-border); } .el-textarea__inner:focus { - border: var(--style-border-hover-always) !important; - box-shadow: var(--heo-shadow-main); + border: var(--style-border-hover-always) !important; + box-shadow: var(--heo-shadow-main); } #page .tk-meta-input .el-input { - box-shadow: var(--heo-shadow-border); + box-shadow: var(--heo-shadow-border); } #twikoo .tk-row .tk-col { - flex-direction: column-reverse !important; + flex-direction: column-reverse !important; } /* 评论数量字号 */ -#twikoo > div.tk-comments > div.tk-comments-container > div.tk-comments-title > span:nth-child(1) { - /* display: none !important; */ - font-size: 1.0rem; +#twikoo>div.tk-comments>div.tk-comments-container>div.tk-comments-title>span:nth-child(1) { + /* display: none !important; */ + font-size: 1.0rem; } /* 加载时背景颜色 */ .el-loading-mask { - background-color: none !important; + background-color: none !important; } /* 所有标签 */ .tk-tag { - transform: translateY(-2px); + transform: translateY(-2px); } /* 评论博主标签圆角 */ .tk-tag-green { - border-radius: 4px !important; - border: 0px solid #e1f3d8 !important; - font-size: 0.5rem !important; + border-radius: 4px !important; + border: 0px solid #e1f3d8 !important; + font-size: 0.5rem !important; } /* 审核中的评论 */ .tk-tag-yellow { - border-radius: 4px !important; - border: 0px solid #e1f3d8 !important; - font-size: 0.5rem !important; + border-radius: 4px !important; + border: 0px solid #e1f3d8 !important; + font-size: 0.5rem !important; } [data-theme=dark] .tk-tag-green { - background-color: #3b70fc; - border: none; - border-radius: 4px; - color: #fff; + background-color: #3b70fc; + border: none; + border-radius: 4px; + color: #fff; } /* 评论置顶 */ .tk-tag-red { - border-radius: 4px !important; - border: 0px solid #f3d8d8 !important; - font-size: 0.5rem !important; + border-radius: 4px !important; + border: 0px solid #f3d8d8 !important; + font-size: 0.5rem !important; } [data-theme=dark] .tk-tag-red { - background-color: #c23a3a21 !important; + background-color: #c23a3a21 !important; } /* 预览按钮 */ .el-button { - background-color: var(--heo-fontcolor) !important; - border: 0px solid var(--heo-main) !important; - color: var(--heo-background) !important; - border-radius: 8px !important; + background-color: var(--heo-fontcolor) !important; + border: 0px solid var(--heo-main) !important; + color: var(--heo-background) !important; + border-radius: 8px !important; } .el-button:hover { - background: var(--heo-main) !important; - color: var(--heo-white) !important; + background: var(--heo-main) !important; + color: var(--heo-white) !important; } .el-button.tk-preview { - display: none !important; + display: none !important; } -#twikoo > div.tk-comments > div.tk-submit > div.tk-row.actions > a { - display: none !important; +#twikoo>div.tk-comments>div.tk-submit>div.tk-row.actions>a { + display: none !important; } #twikoo { - /* z-index: 102; */ + /* z-index: 102; */ } /* 魔改教程入口 */ .twikoo-info { - color: var(--heo-secondtext); + color: var(--heo-secondtext); } /* 点赞和评论 */ .tk-action-link { - color: var(--heo-lighttext) !important; + color: var(--heo-lighttext) !important; } .tk-action-icon svg { - fill: var(--heo-lighttext) !important; + fill: var(--heo-lighttext) !important; } /* 取消按钮 */ button.el-button.tk-cancel.el-button--default.el-button--small { - background: var(--heo-secondbg) !important; - border-radius: 8px !important; - color: var(--heo-fontcolor) !important; + background: var(--heo-secondbg) !important; + border-radius: 8px !important; + color: var(--heo-fontcolor) !important; } .tk-submit-action-icon.__markdown { - display: none; + display: none; } /* 发送按钮正常状态 */ .tk-comments .el-button--primary { - border-color: var(--heo-fontcolor) !important; - color: var(--heo-card-bg) !important; - border-radius: 12px !important; - box-shadow: var(--heo-shadow-black); - transition: .3s; - width: 5rem; - position: absolute; - top: -43px; - right: 0; - margin-left: .5rem !important; - height: 32px + border-color: var(--heo-fontcolor) !important; + color: var(--heo-card-bg) !important; + border-radius: 12px !important; + box-shadow: var(--heo-shadow-black); + transition: .3s; + width: 5rem; + position: absolute; + top: -43px; + right: 0; + margin-left: .5rem !important; + height: 32px } /* 发送按钮禁用状态 */ @@ -12773,556 +12817,556 @@ button.el-button.tk-cancel.el-button--default.el-button--small { .tk-comments .el-button--primary.is-disabled:active, .tk-comments .el-button--primary.is-disabled:focus, .tk-comments .el-button--primary.is-disabled:hover { - opacity: 0.2; + opacity: 0.2; } .tk-row-actions-start { - position: absolute; - top: -84px; - left: 17px + position: absolute; + top: -84px; + left: 17px } .tk-submit { - margin-top: .8rem !important + margin-top: .8rem !important } @media screen and (max-width: 768px) { - .tk-submit .el-button--primary { - width: 5rem; - height: 122px; - top: -132px - } + .tk-submit .el-button--primary { + width: 5rem; + height: 122px; + top: -132px + } - .tk-row-actions-start { - top: -176px - } + .tk-row-actions-start { + top: -176px + } } .tk-comments-title { - /* position: absolute; + /* position: absolute; bottom: 0; left: 0 */ } .tk-extras { - margin-top: 0.5rem; - padding-bottom: 0.5rem; + margin-top: 0.5rem; + padding-bottom: 0.5rem; } .tk-icon.__comments:first-child { - width: 0.6em + width: 0.6em } .tk-icon.__comments { - /* margin-left: 0!important; + /* margin-left: 0!important; color: var(--heo-main)!important */ } .tk-row.actions { - margin-bottom: 0 !important; - margin-left: 0 !important; - margin-top: 0 !important; - justify-content: space-around !important + margin-bottom: 0 !important; + margin-left: 0 !important; + margin-top: 0 !important; + justify-content: space-around !important } .tk-meta-input { - position: relative !important; - margin-top: 8px; - width: calc(100% - 5.5rem); + position: relative !important; + margin-top: 8px; + width: calc(100% - 5.5rem); } /* 内容 */ #post-comment blockquote { - background: var(--heo-secondbg); - border: var(--style-border); - box-shadow: none; - margin: 0; - margin-bottom: 0.5rem; - font-size: 0.6rem; - color: var(--heo-secondtext); - border-radius: 8px; + background: var(--heo-secondbg); + border: var(--style-border); + box-shadow: none; + margin: 0; + margin-bottom: 0.5rem; + font-size: 0.6rem; + color: var(--heo-secondtext); + border-radius: 8px; } /* 表情 */ .tk-content .tk-owo-emotion { - width: 3em; - margin: 0px 2px 0px 2px; + width: 3em; + margin: 0px 2px 0px 2px; } .OwO .OwO-body .OwO-bar .OwO-packages li { - /* line-height: 45px !important; + /* line-height: 45px !important; font-size: 28px !important; */ } .OwO .OwO-body { - z-index: 102; - width: 500px; + z-index: 102; + width: 500px; } #owo-big { - position: fixed; - align-items: center; - background-color: var(--heo-card-bg); - border: var(--style-border-always); - border-radius: 10px; - z-index: 9999; - display: none; - transform: translate(0, -105%); - overflow: hidden; - animation: owoIn 0.3s cubic-bezier(0.42, 0, 0.3, 1.11); - padding: 1rem; + position: fixed; + align-items: center; + background-color: var(--heo-card-bg); + border: var(--style-border-always); + border-radius: 10px; + z-index: 9999; + display: none; + transform: translate(0, -105%); + overflow: hidden; + animation: owoIn 0.3s cubic-bezier(0.42, 0, 0.3, 1.11); + padding: 1rem; } #owo-big img { - width: 100%; + width: 100%; } .tk-owo-emotion, .twikoo .OwO-item img { - pointer-events: none; + pointer-events: none; } .OwO.OwO-open .OwO-body { - animation: .3s ease .1s 1 normal both running donate_effcet + animation: .3s ease .1s 1 normal both running donate_effcet } @keyframes owoIn { - 0% { - transform: translate(0, -95%); - opacity: 0; - } + 0% { + transform: translate(0, -95%); + opacity: 0; + } - 100% { - transform: translate(0, -105%); - opacity: 1; - } + 100% { + transform: translate(0, -105%); + opacity: 1; + } } @media screen and (max-width: 768px) { - .OwO .OwO-body { - width: 300px; - } + .OwO .OwO-body { + width: 300px; + } } .tk-extra { - background: var(--heo-card-bg); - border: var(--style-border-always); - padding: 1px 5px 1px 2px; - border-radius: 8px; - margin-right: 4px !important; - color: var(--heo-secondtext) !important; - display: inline !important; - margin-top: 6px !important; - font-size: 0.5rem; + background: var(--heo-card-bg); + border: var(--style-border-always); + padding: 1px 5px 1px 2px; + border-radius: 8px; + margin-right: 4px !important; + color: var(--heo-secondtext) !important; + display: inline !important; + margin-top: 6px !important; + font-size: 0.5rem; } .tk-extra .tk-icon { - display: none; + display: none; } .tk-expand { - background: var(--heo-card-bg) !important; - color: var(--heo-fontcolor) !important; - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - border-radius: 12px; - -webkit-user-select: none; - position: relative; - z-index: 2 + background: var(--heo-card-bg) !important; + color: var(--heo-fontcolor) !important; + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + border-radius: 12px; + -webkit-user-select: none; + position: relative; + z-index: 2 } @media screen and (min-width: 769px) { - .tk-expand:hover { - background: var(--heo-theme) !important; - color: var(--heo-white) !important - } + .tk-expand:hover { + background: var(--heo-theme) !important; + color: var(--heo-white) !important + } } -.tk-comments-container > .tk-expand { - margin: 12px; - width: calc(100% - 24px) !important; - position: absolute; - bottom: 52px; - left: 0 +.tk-comments-container>.tk-expand { + margin: 12px; + width: calc(100% - 24px) !important; + position: absolute; + bottom: 52px; + left: 0 } .tk-expand::after { - background: linear-gradient(to bottom, var(--heo-none) 0, var(--heo-card-bg) 100%); - content: ''; - width: 100%; - height: 100px; - bottom: 43px; - left: 0; - display: flex; - position: absolute; - z-index: -1 + background: linear-gradient(to bottom, var(--heo-none) 0, var(--heo-card-bg) 100%); + content: ''; + width: 100%; + height: 100px; + bottom: 43px; + left: 0; + display: flex; + position: absolute; + z-index: -1 } .tk-expand._collapse::after { - display: none + display: none } /* 评论时间 */ .tk-time { - color: var(--heo-secondtext) !important; - font-size: 0.8rem; - margin-left: 0.5rem; + color: var(--heo-secondtext) !important; + font-size: 0.8rem; + margin-left: 0.5rem; } /* 评论之间的间距 */ -.tk-comments-container > .tk-comment { - margin-top: 0rem !important; - margin-bottom: 0.5rem !important; - background: var(--heo-card-bg); - transition: 0.3s; - border-radius: 12px; - padding: 0rem; - padding-top: 0.5rem; - border: none; - border-top: var(--style-border-dashed); +.tk-comments-container>.tk-comment { + margin-top: 0rem !important; + margin-bottom: 0.5rem !important; + background: var(--heo-card-bg); + transition: 0.3s; + border-radius: 12px; + padding: 0rem; + padding-top: 0.5rem; + border: none; + border-top: var(--style-border-dashed); } -#page .tk-comments-container > .tk-comment { - padding: 1rem; - padding-bottom: 1.5rem; - border: var(--style-border); - border-top: var(--style-border); - box-shadow: var(--heo-shadow-border); +#page .tk-comments-container>.tk-comment { + padding: 1rem; + padding-bottom: 1.5rem; + border: var(--style-border); + border-top: var(--style-border); + box-shadow: var(--heo-shadow-border); } @media screen and (max-width: 768px) { - .tk-comments-container > .tk-comment { - padding: 1rem; - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - } + .tk-comments-container>.tk-comment { + padding: 1rem; + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + } - .tk-icon.__comments { - /* left: 0.5rem; */ - } + .tk-icon.__comments { + /* left: 0.5rem; */ + } } .tk-icon { - /* position: absolute; */ + /* position: absolute; */ } /* 评论功能模块标题字号 */ #post-comment .comment-head { - font-size: 0.8em !important; - margin-bottom: 0.5rem; - display: flex; - align-items: center; - flex-wrap: wrap; + font-size: 0.8em !important; + margin-bottom: 0.5rem; + display: flex; + align-items: center; + flex-wrap: wrap; } .comment-randomInfo { - margin-left: auto; - font-size: 13px; + margin-left: auto; + font-size: 13px; } /* 隐藏没有评论 */ .tk-comments-no { - /* display: none !important; */ + /* display: none !important; */ } .tk-comments-container { - /* min-height: 0rem !important; + /* min-height: 0rem !important; margin-top: 0.5rem; */ } -.tk-replies > .tk-comment { - background: var(--heo-card-bg); - border-top: var(--style-border-dashed); - border-radius: 12px; - padding: 0; - transition: 0.3s; - padding-top: 1rem; - margin-top: 0; +.tk-replies>.tk-comment { + background: var(--heo-card-bg); + border-top: var(--style-border-dashed); + border-radius: 12px; + padding: 0; + transition: 0.3s; + padding-top: 1rem; + margin-top: 0; } .tk-content p { - margin: 0px !important; + margin: 0px !important; } .tk-replies .tk-content span:first-child:not(.token) { - font-size: 0.5rem; - color: var(--heo-secondtext); + font-size: 0.5rem; + color: var(--heo-secondtext); } /* 图片描述 */ .img-alt { - font-size: 12px; - margin: 0; - color: var(--heo-secondtext); + font-size: 12px; + margin: 0; + color: var(--heo-secondtext); } /* 文章长图 */ .long-img .img-alt { - display: none; + display: none; } .long-img img { - border-radius: 0 !important; - margin: 0 !important; + border-radius: 0 !important; + margin: 0 !important; } /* 文章底部推荐 */ @media screen and (min-width: 768px) { - #pagination.pagination-post { - border-radius: 12px; - margin-top: 1rem; - } + #pagination.pagination-post { + border-radius: 12px; + margin-top: 1rem; + } - .relatedPosts { - margin-top: 1rem; - } + .relatedPosts { + margin-top: 1rem; + } } @media screen and (min-width: 1300px) { - #pagination.pagination-post { - border-radius: 12px; - margin-top: 1rem; - } + #pagination.pagination-post { + border-radius: 12px; + margin-top: 1rem; + } - .relatedPosts { - margin-top: 1rem; - } + .relatedPosts { + margin-top: 1rem; + } } .post-reward { - margin-top: 0rem; - display: flex; - justify-content: center; + margin-top: 0rem; + display: flex; + justify-content: center; } -.post-reward:hover > .reward-main { - display: none; +.post-reward:hover>.reward-main { + display: none; } .post-reward .reward-main { - z-index: 999; + z-index: 999; } .tk-meta-input .el-input .el-input-group__prepend { - -webkit-user-select: none; - border-radius: 10px 0 0 10px; - border-right: var(--style-border-always) + -webkit-user-select: none; + border-radius: 10px 0 0 10px; + border-right: var(--style-border-always) } @media screen and (min-width: 768px) { - .post-reward:hover > .reward-main { - display: flex !important; - justify-content: left; - } + .post-reward:hover>.reward-main { + display: flex !important; + justify-content: left; + } } @media screen and (max-width: 768px) { - .post-reward .reward-main .reward-all { - width: 100%; - display: flex; - flex-wrap: wrap; - justify-content: space-around; - padding: 30px 0 60px 0; - border-radius: 12px 12px 0 0; - } + .post-reward .reward-main .reward-all { + width: 100%; + display: flex; + flex-wrap: wrap; + justify-content: space-around; + padding: 30px 0 60px 0; + border-radius: 12px 12px 0 0; + } - #post .tag_share .post-meta__tags { - margin: 0 0.5rem 0 0; - } + #post .tag_share .post-meta__tags { + margin: 0 0.5rem 0 0; + } - a.reward-main-btn { - margin: 4px auto; - } + a.reward-main-btn { + margin: 4px auto; + } - .tk-meta-input .el-input .el-input-group__prepend { - padding: 0 8px !important - } + .tk-meta-input .el-input .el-input-group__prepend { + padding: 0 8px !important + } - .tk-meta-input { - display: flex; - flex-direction: column; - top: 0px; - position: inherit !important; - } + .tk-meta-input { + display: flex; + flex-direction: column; + top: 0px; + position: inherit !important; + } - .tk-meta-input .el-input { - margin-left: 0px !important; - width: 100% !important; - margin-bottom: 8px; - } + .tk-meta-input .el-input { + margin-left: 0px !important; + width: 100% !important; + margin-bottom: 8px; + } - .tk-icon { - /* position: absolute; + .tk-icon { + /* position: absolute; right: 0; */ - } + } } .post-reward .reward-main .reward-all:after { - display: none; + display: none; } .reward-group { - display: flex; - margin-top: 0.5rem; + display: flex; + margin-top: 0.5rem; } .post-reward .reward-main .reward-all .reward-item:first-child img { - border-color: var(--heo-green); + border-color: var(--heo-green); } .post-reward .reward-main .reward-all .reward-item:last-child img { - border-color: var(--heo-blue); + border-color: var(--heo-blue); } .share-link { - margin-left: 0.5rem; - display: flex; - justify-content: center; - position: relative; - text-align: center; + margin-left: 0.5rem; + display: flex; + justify-content: center; + position: relative; + text-align: center; } .share-button { - background: var(--heo-card-btn-bg); - color: var(--heo-fontcolor); - border-radius: 8px; - cursor: pointer; - transition: 0.3s; - width: 56px; - height: 40px; + background: var(--heo-card-btn-bg); + color: var(--heo-fontcolor); + border-radius: 8px; + cursor: pointer; + transition: 0.3s; + width: 56px; + height: 40px; } .share-button i { - line-height: 40px; + line-height: 40px; } .share-button i.fab { - line-height: 42px; + line-height: 42px; } @media screen and (min-width: 1300px) { - .share-button { - background: var(--heo-card-bg); - border: var(--style-border); - } + .share-button { + background: var(--heo-card-bg); + border: var(--style-border); + } - .share-button:hover { - transform: scale(1.03); - } + .share-button:hover { + transform: scale(1.03); + } - .share-button:active { - transform: scale(0.97); - } + .share-button:active { + transform: scale(0.97); + } - .share-button i { - line-height: 38px; - } + .share-button i { + line-height: 38px; + } - .share-button i.fab { - line-height: 40px; - } + .share-button i.fab { + line-height: 40px; + } } .share-button:hover { - background: var(--heo-theme); - border-color: var(--heo-theme); - color: var(--heo-white); - transition: 0.3s; - box-shadow: var(--heo-shadow-blue); + background: var(--heo-theme); + border-color: var(--heo-theme); + color: var(--heo-white); + transition: 0.3s; + box-shadow: var(--heo-shadow-blue); } .share-link.weibo:hover .share-button { - background: var(--heo-red); - border-color: var(--heo-red); - box-shadow: var(--heo-shadow-red); + background: var(--heo-red); + border-color: var(--heo-red); + box-shadow: var(--heo-shadow-red); } .share-link.mobile:hover .share-button { - background: var(--heo-green); - border-color: var(--heo-green); - box-shadow: var(--heo-shadow-green); - color: var(--heo-white); + background: var(--heo-green); + border-color: var(--heo-green); + box-shadow: var(--heo-shadow-green); + color: var(--heo-white); } .share-main { - position: absolute; - bottom: 40px; - z-index: 100; - display: none; - padding-bottom: 15px; + position: absolute; + bottom: 40px; + z-index: 100; + display: none; + padding-bottom: 15px; } .share-main-all { - padding: 12px; - border-radius: 12px; - background: var(--heo-background); - animation: donate_effcet 0.3s 0.1s ease both; - flex-direction: column; - border: var(--style-border-always); + padding: 12px; + border-radius: 12px; + background: var(--heo-background); + animation: donate_effcet 0.3s 0.1s ease both; + flex-direction: column; + border: var(--style-border-always); } #qrcode { - width: 150px; - height: 150px; - min-width: 150px; - min-height: 150px; - background: var(--heo-white); - padding: 8px; - border-radius: 8px; - margin-bottom: 8px; - border: var(--style-border-always); + width: 150px; + height: 150px; + min-width: 150px; + min-height: 150px; + background: var(--heo-white); + padding: 8px; + border-radius: 8px; + margin-bottom: 8px; + border: var(--style-border-always); } .share-link:hover .share-main { - display: flex; + display: flex; } .share-qrcode { - display: flex; - justify-content: center; + display: flex; + justify-content: center; } @media screen and (max-width: 768px) { - .share-link.mobile { - display: none; - } + .share-link.mobile { + display: none; + } - .share-button { - background: var(--heo-card-bg); - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - } + .share-button { + background: var(--heo-card-bg); + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + } } /* 表情窗口owo */ .OwO .OwO-body { - border: var(--style-border-always) !important; - border-radius: 8px !important; - overflow: hidden; - background-color: var(--heo-maskbg) !important; - backdrop-filter: saturate(180%) blur(10px); - -webkit-backdrop-filter: blur(10px); + border: var(--style-border-always) !important; + border-radius: 8px !important; + overflow: hidden; + background-color: var(--heo-maskbg) !important; + backdrop-filter: saturate(180%) blur(10px); + -webkit-backdrop-filter: blur(10px); } .OwO .OwO-body .OwO-bar { - border-top: none !important; + border-top: none !important; } .OwO .OwO-body .OwO-items .OwO-item:hover { - box-shadow: var(--heo-shadow-lightblack) !important; - border-radius: 8px; + box-shadow: var(--heo-shadow-lightblack) !important; + border-radius: 8px; } -#twikoo > div.tk-comments > div.tk-submit > div.tk-row.actions > div > div.tk-action-icon.OwO.OwO-open > div.OwO-body > div > ul > li > span { - line-height: 48px; - font-size: 28px; +#twikoo>div.tk-comments>div.tk-submit>div.tk-row.actions>div>div.tk-action-icon.OwO.OwO-open>div.OwO-body>div>ul>li>span { + line-height: 48px; + font-size: 28px; } /* .OwO .OwO-body .OwO-bar .OwO-packages li { @@ -13347,13 +13391,13 @@ button.el-button.tk-cancel.el-button--default.el-button--small { min-height: 197px; } */ .OwO .OwO-body .OwO-items-show { - margin: 12px 8px !important; - min-height: 197px; + margin: 12px 8px !important; + min-height: 197px; } .OwO-packages { - background: var(--heo-background); - padding-left: 8px !important; + background: var(--heo-background); + padding-left: 8px !important; } @@ -13361,544 +13405,545 @@ button.el-button.tk-cancel.el-button--default.el-button--small { /* ---------------------------------------------------------------- */ /* 标题 */ #page .category-lists .category-title { - display: none; + display: none; } .article-sort-item-title { - line-height: 1.3; - -webkit-line-clamp: 1; + line-height: 1.3; + -webkit-line-clamp: 1; } @media screen and (max-width: 768px) { - .article-sort-item-title { - -webkit-line-clamp: 2; - } + .article-sort-item-title { + -webkit-line-clamp: 2; + } } #page { - background: none; - border: none; - padding: 0; + background: none; + border: none; + padding: 0; } @media screen and (min-width: 1300px) { - #page > div:not(.author-content-item) { - animation: slide-in .6s .2s backwards - } + #page>div:not(.author-content-item) { + animation: slide-in .6s .2s backwards + } } /* 图片 */ .article-sort .article-sort-item .article-sort-item-img { - border-radius: 12px; - min-width: 151px; - min-height: 80px; - background: var(--heo-secondbg); - -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); + border-radius: 12px; + min-width: 151px; + min-height: 80px; + background: var(--heo-secondbg); + -webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0)); } @media screen and (max-width: 768px) { - .article-sort .article-sort-item .article-sort-item-img { - min-width: 80px; - } + .article-sort .article-sort-item .article-sort-item-img { + min-width: 80px; + } } #post .tag_share .post-meta__tag-list { - display: flex; - padding: 0; - width: 100%; - flex-wrap: wrap; - flex-direction: row + display: flex; + padding: 0; + width: 100%; + flex-wrap: wrap; + flex-direction: row } #post .tag_share .post-meta__tag-list a { - margin-bottom: 8px; - margin-right: 8px + margin-bottom: 8px; + margin-right: 8px } #page .tag-cloud-list a { - color: var(--heo-fontcolor) !important; - font-size: 1.4em !important; - padding: 0.2em .5em; - background: var(--heo-card-bg); - margin: .5em .5em; - border-radius: 12px; - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - align-items: center + color: var(--heo-fontcolor) !important; + font-size: 1.4em !important; + padding: 0.2em .5em; + background: var(--heo-card-bg); + margin: .5em .5em; + border-radius: 12px; + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + align-items: center } #page .tag-cloud-list a:hover { - background: var(--heo-theme) !important; - box-shadow: var(--heo-shadow-blue); - color: var(--heo-card-bg) !important; - border: var(--style-border-hover); + background: var(--heo-theme) !important; + box-shadow: var(--heo-shadow-blue); + color: var(--heo-card-bg) !important; + border: var(--style-border-hover); } span.tagsPageCount { - background: var(--heo-secondbg); - padding: 4px 4px; - border-radius: 8px; - color: var(--heo-secondtext); - line-height: 1; - text-align: center; - min-width: 35px; - display: inline-block; - font-size: 1rem; - margin-left: 4px; + background: var(--heo-secondbg); + padding: 4px 4px; + border-radius: 8px; + color: var(--heo-secondtext); + line-height: 1; + text-align: center; + min-width: 35px; + display: inline-block; + font-size: 1rem; + margin-left: 4px; } #page .tag-cloud-list a:hover span.tagsPageCount { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } -#tag-page-tags .tagsPageCount, #post .tag_share .post-meta__tags span.tagsPageCount { - padding: 2px; - background: var(--heo-card-bg); - border: var(--style-border-always); - min-width: 22.5px; - display: inline-block; - border-radius: 4px; - text-align: center; - font-size: 0.6rem; - color: var(--heo-fontcolor); - margin-left: 4px; +#tag-page-tags .tagsPageCount, +#post .tag_share .post-meta__tags span.tagsPageCount { + padding: 2px; + background: var(--heo-card-bg); + border: var(--style-border-always); + min-width: 22.5px; + display: inline-block; + border-radius: 4px; + text-align: center; + font-size: 0.6rem; + color: var(--heo-fontcolor); + margin-left: 4px; } #tag #tag-page-tags a.select .tagsPageCount { - background: var(--heo-card-bg); - color: var(--heo-lighttext); + background: var(--heo-card-bg); + color: var(--heo-lighttext); } span.tags-punctuation { - margin-right: 2px; + margin-right: 2px; } span.tags-punctuation::before { - content: "\e663"; - font-family: "haofont" !important; - opacity: 0.4; - margin-right: 2px; + content: "\e663"; + font-family: "haofont" !important; + opacity: 0.4; + margin-right: 2px; } .hide-aside #page span.tags-punctuation::before { - font-size: 22px; + font-size: 22px; } .recent-post-item span.tags-punctuation { - margin-right: 0px; - font-size: 13px; + margin-right: 0px; + font-size: 13px; } .category-lists span.tags-punctuation { - font-size: 18px; + font-size: 18px; } .tags-name { - margin-left: 2px; + margin-left: 2px; } /* page标题 */ #article-container h1 { - padding-left: 0rem; + padding-left: 0rem; } #article-container h1:before { - display: none; + display: none; } #article-container h1:hover { - padding-left: 0rem; + padding-left: 0rem; } /* 分类页 */ -#article-container > div > figure > figcaption > p { - margin: 0; +#article-container>div>figure>figcaption>p { + margin: 0; } #page .category-lists ul li::before { - display: none; + display: none; } #page .category-lists ul li { - margin: 0; - margin-right: 8px; - margin-bottom: 8px; + margin: 0; + margin-right: 8px; + margin-bottom: 8px; } #page .category-lists ul { - display: flex; - padding: 0; - flex-wrap: wrap; - flex-direction: row; + display: flex; + padding: 0; + flex-wrap: wrap; + flex-direction: row; } #page .category-lists ul li { - padding: 4px 16px; - width: 200px; - border-radius: 12px; - background: var(--card-bg); - border: var(--style-border-always); + padding: 4px 16px; + width: 200px; + border-radius: 12px; + background: var(--card-bg); + border: var(--style-border-always); } /* 分类圆角 */ figure.gallery-group { - border-radius: 12px; + border-radius: 12px; } /* 分类分割线隐藏 */ figure.gallery-group:hover .gallery-group-name::after { - display: none; + display: none; } /* 标签详情页标题 */ .tag-cloud-title { - display: none; + display: none; } .tk-replies .tk-content { - margin-top: 0rem !important; + margin-top: 0rem !important; } #tag #tag-page-tags { - display: flex; - flex-direction: row; - flex-wrap: wrap; - margin: 0 -.25rem; - margin-bottom: .5rem; - position: absolute; - z-index: 1; - width: 100%; - padding: 1rem 2rem; - left: 0; - top: 0; - max-height: 64px; - overflow: hidden; - background: var(--heo-card-bg); - backdrop-filter: saturate(180%) blur(20px); - transition: .1s ease-out + display: flex; + flex-direction: row; + flex-wrap: wrap; + margin: 0 -.25rem; + margin-bottom: .5rem; + position: absolute; + z-index: 1; + width: 100%; + padding: 1rem 2rem; + left: 0; + top: 0; + max-height: 64px; + overflow: hidden; + background: var(--heo-card-bg); + backdrop-filter: saturate(180%) blur(20px); + transition: .1s ease-out } @media screen and (max-width: 768px) { - #tag #tag-page-tags { - display: none - } + #tag #tag-page-tags { + display: none + } } #tag #tag-page-tags:hover { - max-height: 1000px; - transition: .3s ease-out; - background: var(--heo-maskbgdeep) + max-height: 1000px; + transition: .3s ease-out; + background: var(--heo-maskbgdeep) } #tag #tag-page-tags a { - padding: 0.1rem 0.5rem; - margin: 0.25rem 0.25rem; - line-height: 1.6; - border-radius: 8px; - color: var(--heo-fontcolor) !important; - border: var(--style-border-always); - display: flex; - align-items: center; - background: var(--heo-card-bg) + padding: 0.1rem 0.5rem; + margin: 0.25rem 0.25rem; + line-height: 1.6; + border-radius: 8px; + color: var(--heo-fontcolor) !important; + border: var(--style-border-always); + display: flex; + align-items: center; + background: var(--heo-card-bg) } #tag #tag-page-tags a.select { - color: var(--heo-card-bg) !important; - background: var(--heo-theme); - box-shadow: var(--heo-shadow-theme); + color: var(--heo-card-bg) !important; + background: var(--heo-theme); + box-shadow: var(--heo-shadow-theme); } #tag #tag-page-tags a:hover { - color: var(--heo-card-bg) !important; - background: var(--heo-theme); - box-shadow: var(--heo-shadow-theme); + color: var(--heo-card-bg) !important; + background: var(--heo-theme); + box-shadow: var(--heo-shadow-theme); } /* 时间线 */ .article-sort-item:before { - display: none; + display: none; } .article-sort-title:before { - display: none; + display: none; } .article-sort-title:after { - display: none; + display: none; } .article-sort { - border: none; + border: none; } .article-sort { - margin-left: 0; - padding-left: 0; + margin-left: 0; + padding-left: 0; } .article-sort-title { - margin-left: 0; - padding-bottom: 0; - padding-left: 0; + margin-left: 0; + padding-bottom: 0; + padding-left: 0; } .article-sort-title sup { - margin-left: 4px; - font-size: 16px; - font-weight: 700; - opacity: .4; - top: -1em + margin-left: 4px; + font-size: 16px; + font-weight: 700; + opacity: .4; + top: -1em } .article-sort-item { - margin: 0 0 1rem 0rem; - overflow: hidden; - border-radius: 12px; + margin: 0 0 1rem 0rem; + overflow: hidden; + border-radius: 12px; } @media screen and (max-width: 768px) { - .article-sort-item-info a { - white-space: inherit !important; - } + .article-sort-item-info a { + white-space: inherit !important; + } } .article-sort-item.year { - font-size: 0.8rem; - color: var(--heo-secondtext); - margin-bottom: 0.2rem; + font-size: 0.8rem; + color: var(--heo-secondtext); + margin-bottom: 0.2rem; } .article-sort-item-img img:hover { - transform: scale(1); + transform: scale(1); } .article-sort-title { - font-weight: bold; - font-size: 2em; + font-weight: bold; + font-size: 2em; } /* 文章列表 */ .article-sort-item-info { - padding: 0 0.8rem; - display: flex; - flex-direction: column; + padding: 0 0.8rem; + display: flex; + flex-direction: column; } .article-sort-item-time { - order: 1; - margin-top: 4px; - color: var(--heo-secondtext); + order: 1; + margin-top: 4px; + color: var(--heo-secondtext); } .article-sort-item-title { - order: 0; - font-weight: bold; + order: 0; + font-weight: bold; } .article-sort-item-title:hover { - transform: translateX(0px); - color: var(--heo-lighttext); + transform: translateX(0px); + color: var(--heo-lighttext); } /* 友情链接页面 */ /* ---------------------------------------------------------------- */ /* 随机文章 */ #random-post { - min-height: 32px; - background: var(--heo-card-bg); - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - padding: 20px 30px; - border-radius: 12px; - margin-top: 8px; + min-height: 32px; + background: var(--heo-card-bg); + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + padding: 20px 30px; + border-radius: 12px; + margin-top: 8px; } .random-friends-post { - text-decoration: none; - border-bottom: 2px solid var(--heo-lighttext); - color: var(--heo-fontcolor); - font-weight: 700; - padding: 0 4px; + text-decoration: none; + border-bottom: 2px solid var(--heo-lighttext); + color: var(--heo-fontcolor); + font-weight: 700; + padding: 0 4px; } .random-friends-post:hover { - text-decoration: none; - border-bottom: 2px solid var(--heo-none); - color: var(--heo-white); - background: var(--heo-main); - border-radius: 4px; - box-shadow: var(--heo-shadow-main); + text-decoration: none; + border-bottom: 2px solid var(--heo-none); + color: var(--heo-white); + background: var(--heo-main); + border-radius: 4px; + box-shadow: var(--heo-shadow-main); } .random-post-start { - transition-duration: 0.3s; + transition-duration: 0.3s; } .random-post-start:hover { - color: var(--heo-hovertext); + color: var(--heo-hovertext); } /* 炙焰友链间距 */ .flink#article-container .flink-list { - padding: 0; - margin: 0.5rem -6px 1rem -6px; - overflow-x: hidden; + padding: 0; + margin: 0.5rem -6px 1rem -6px; + overflow-x: hidden; } .flink#article-container .flink-desc { - margin: 0; - color: var(--heo-secondtext); + margin: 0; + color: var(--heo-secondtext); } /* 友情描述 */ -.flink#article-container .flink-list > .flink-list-item a .flink-item-desc { - white-space: normal; - padding: 5px 10px 16px 0; - color: var(--heo-fontcolor); - text-align: left; - height: 40px; - text-overflow: ellipsis; - opacity: 0.7; - display: -webkit-box; - overflow: hidden; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; +.flink#article-container .flink-list>.flink-list-item a .flink-item-desc { + white-space: normal; + padding: 5px 10px 16px 0; + color: var(--heo-fontcolor); + text-align: left; + height: 40px; + text-overflow: ellipsis; + opacity: 0.7; + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; } -.flink#article-container .flink-list > .flink-list-item:hover a .flink-item-desc { - color: var(--heo-card-bg); +.flink#article-container .flink-list>.flink-list-item:hover a .flink-item-desc { + color: var(--heo-card-bg); } /* 友链标题 */ .flink-list-item .flink-item-info { - display: flex; - flex-direction: column; - justify-content: center; - width: calc(100% - 90px); - height: fit-content; + display: flex; + flex-direction: column; + justify-content: center; + width: calc(100% - 90px); + height: fit-content; } .flink-list-item:hover .flink-item-info { - min-width: calc(100% - 20px); + min-width: calc(100% - 20px); } -.flink#article-container .flink-list > .flink-list-item a .flink-item-name { - text-align: left; - font-size: 19px; - line-height: 20px; - color: var(--heo-fontcolor); +.flink#article-container .flink-list>.flink-list-item a .flink-item-name { + text-align: left; + font-size: 19px; + line-height: 20px; + color: var(--heo-fontcolor); } -.flink#article-container .flink-list > .flink-list-item:hover a .flink-item-name { - color: var(--heo-card-bg) !important; +.flink#article-container .flink-list>.flink-list-item:hover a .flink-item-name { + color: var(--heo-card-bg) !important; } -.flink#article-container .flink-list > .flink-list-item a { - display: flex; - border: none; - width: 100%; - height: 100%; - align-items: center; +.flink#article-container .flink-list>.flink-list-item a { + display: flex; + border: none; + width: 100%; + height: 100%; + align-items: center; } -.flink#article-container .flink-list > .flink-list-item a:hover { - background: none; +.flink#article-container .flink-list>.flink-list-item a:hover { + background: none; } /* 友链头像 */ -.flink#article-container .flink-list > .flink-list-item a img { - border-radius: 32px; - margin: 15px 20px 15px 15px; - transition: 0.3s; - background: var(--heo-background); - min-width: 60px; - min-height: 60px; +.flink#article-container .flink-list>.flink-list-item a img { + border-radius: 32px; + margin: 15px 20px 15px 15px; + transition: 0.3s; + background: var(--heo-background); + min-width: 60px; + min-height: 60px; } /* 悬浮状态头像 */ -.flink#article-container .flink-list > .flink-list-item:hover a img { - transition: 0.6s; - width: 0; - height: 0; - opacity: 0; - margin: 0.5rem; - min-width: 0px; - min-height: 0px; +.flink#article-container .flink-list>.flink-list-item:hover a img { + transition: 0.6s; + width: 0; + height: 0; + opacity: 0; + margin: 0.5rem; + min-width: 0px; + min-height: 0px; } /* 友链右侧图标 */ -#article-container .flink-list > .flink-list-item:hover .flink-item-info > img { - opacity: .8 !important; +#article-container .flink-list>.flink-list-item:hover .flink-item-info>img { + opacity: .8 !important; } -#article-container .flink-list > .flink-list-item .flink-item-info > img { - position: absolute; - opacity: 0 !important; - right: -30px !important; - bottom: -40px !important; - width: 100px !important; - height: 100px !important; - border-radius: 50% !important; - z-index: -1; - -webkit-transition: all .5s ease; - -moz-transition: all .5s ease; - -ms-transition: all .5s ease; - -o-transition: all .5s ease; - transition: all .5s ease; +#article-container .flink-list>.flink-list-item .flink-item-info>img { + position: absolute; + opacity: 0 !important; + right: -30px !important; + bottom: -40px !important; + width: 100px !important; + height: 100px !important; + border-radius: 50% !important; + z-index: -1; + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -ms-transition: all .5s ease; + -o-transition: all .5s ease; + transition: all .5s ease; } /* 标题和描述 */ -.flink#article-container .flink-list > .flink-list-item a span { - transition: 0.3s; +.flink#article-container .flink-list>.flink-list-item a span { + transition: 0.3s; } /* 友链描述 */ -.flink#article-container .flink-list > .flink-list-item:hover a .flink-item-desc { - overflow: hidden; - width: 100%; +.flink#article-container .flink-list>.flink-list-item:hover a .flink-item-desc { + overflow: hidden; + width: 100%; } /* 修改初始动画 */ -.flink#article-container .flink-list > .flink-list-item { - margin: 6px 6px; - transition: 0.3s; - border-radius: 12px; - transition-timing-function: ease-in-out; - position: relative; - width: calc(20% - 12px); - border: var(--style-border); - box-shadow: var(--heo-shadow-border); - background: var(--heo-card-bg); - display: flex; +.flink#article-container .flink-list>.flink-list-item { + margin: 6px 6px; + transition: 0.3s; + border-radius: 12px; + transition-timing-function: ease-in-out; + position: relative; + width: calc(20% - 12px); + border: var(--style-border); + box-shadow: var(--heo-shadow-border); + background: var(--heo-card-bg); + display: flex; } -.flink#article-container .flink-list > .flink-list-item:hover { - transform: scale(1); - background: var(--heo-theme); - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); +.flink#article-container .flink-list>.flink-list-item:hover { + transform: scale(1); + background: var(--heo-theme); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); } .gallery-group figcaption p { - line-height: 1.5 !important; + line-height: 1.5 !important; } @media screen and (min-width: 1300px) { - .flink#article-container .flink-list > .flink-list-item:hover { - transform: scale(1.03); - } + .flink#article-container .flink-list>.flink-list-item:hover { + transform: scale(1.03); + } - .flink#article-container .flink-list > .flink-list-item:active { - transform: scale(0.97); - } + .flink#article-container .flink-list>.flink-list-item:active { + transform: scale(0.97); + } } @@ -13907,4913 +13952,4982 @@ figure.gallery-group:hover .gallery-group-name::after { /* 超级博主标题 */ .flink#article-container .site-card .info .title { - color: var(--heo-fontcolor); - text-align: left; + color: var(--heo-fontcolor); + text-align: left; } .flink#article-container .site-card:hover .info .title { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } .flink#article-container .site-card:hover .info { - height: 120px; + height: 120px; } .flink#article-container .site-card .site-card-text { - display: flex; - flex-direction: column; - align-items: flex-start; + display: flex; + flex-direction: column; + align-items: flex-start; } /* 超级博主描述 */ .flink#article-container .site-card .info .desc { - font-size: 0.7rem; - color: var(--heo-fontcolor); - opacity: 0.7; - transition: 0.3s; - text-align: left; + font-size: 0.7rem; + color: var(--heo-fontcolor); + opacity: 0.7; + transition: 0.3s; + text-align: left; } .flink#article-container .site-card:hover .info .desc { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } @media screen and (min-width: 768px) { - .flink#article-container .site-card:hover .info .desc { - -webkit-line-clamp: 4; - } + .flink#article-container .site-card:hover .info .desc { + -webkit-line-clamp: 4; + } - .flink#article-container .site-card:hover .info .desc { - transition: .3s; - color: var(--heo-card-bg); - width: 100% - } + .flink#article-container .site-card:hover .info .desc { + transition: .3s; + color: var(--heo-card-bg); + width: 100% + } - .flink#article-container .site-card:hover .info { - background: var(--heo-theme) - } + .flink#article-container .site-card:hover .info { + background: var(--heo-theme) + } } /* 背景 */ .flink#article-container .site-card { - border: var(--style-border); - border-radius: 12px; - transition: 0.3s; - transition-timing-function: ease-in-out; - overflow: hidden; - height: 200px; - position: relative; - width: calc(100% / 7 - 16px); - background: var(--heo-card-bg); - box-shadow: var(--heo-shadow-border); + border: var(--style-border); + border-radius: 12px; + transition: 0.3s; + transition-timing-function: ease-in-out; + overflow: hidden; + height: 200px; + position: relative; + width: calc(100% / 7 - 16px); + background: var(--heo-card-bg); + box-shadow: var(--heo-shadow-border); } .site-card-tag { - position: absolute; - top: 0; - left: 0; - padding: 4px 8px; - background-color: var(--heo-main); - box-shadow: var(--heo-shadow-main); - color: var(--heo-white); - z-index: 1; - border-radius: 12px 0 12px 0; - transition: 0.3s; - font-size: 0.6rem; + position: absolute; + top: 0; + left: 0; + padding: 4px 8px; + background-color: var(--heo-main); + box-shadow: var(--heo-shadow-main); + color: var(--heo-white); + z-index: 1; + border-radius: 12px 0 12px 0; + transition: 0.3s; + font-size: 0.6rem; } .site-card-tag.vip { - /*! Edit and share this gradient: https://html5kit.com/gradient-editor/?preset=d48f16,100;e5b085,0 */ - background: -moz-linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); - /* FF3.6+ */ - background: -webkit-linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); - /* Chrome10-25, Safari5.1-6 */ - background: linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); - /* W3C, IE10+, Firefox16+, Chrome26+, Opera12+, Safari7+ */ - overflow: hidden; - box-shadow: var(--heo-shadow-yellow); + /*! Edit and share this gradient: https://html5kit.com/gradient-editor/?preset=d48f16,100;e5b085,0 */ + background: -moz-linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); + /* FF3.6+ */ + background: -webkit-linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); + /* Chrome10-25, Safari5.1-6 */ + background: linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%); + /* W3C, IE10+, Firefox16+, Chrome26+, Opera12+, Safari7+ */ + overflow: hidden; + box-shadow: var(--heo-shadow-yellow); } .light { - cursor: pointer; - position: absolute; - top: 0; - width: 100px; - height: 50px; - background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); - background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); - -webkit-animation: light_tag 4s both infinite; - -moz-animation: light_tag 4s both infinite; - -ms-animation: light_tag 4s both infinite; - animation: light_tag 4s both infinite; + cursor: pointer; + position: absolute; + top: 0; + width: 100px; + height: 50px; + background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); + background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); + -webkit-animation: light_tag 4s both infinite; + -moz-animation: light_tag 4s both infinite; + -ms-animation: light_tag 4s both infinite; + animation: light_tag 4s both infinite; } @keyframes light_tag { - 0% { - transform: skewx(0deg); - -o-transform: skewx(0deg); - -moz-transform: skewx(0deg); - -webkit-transform: skewx(0deg); - left: -150px; - } + 0% { + transform: skewx(0deg); + -o-transform: skewx(0deg); + -moz-transform: skewx(0deg); + -webkit-transform: skewx(0deg); + left: -150px; + } - 99% { - transform: skewx(-25deg); - -o-transform: skewx(-25deg); - -moz-transform: skewx(-25deg); - -webkit-transform: skewx(-25deg); - left: 50px; - } + 99% { + transform: skewx(-25deg); + -o-transform: skewx(-25deg); + -moz-transform: skewx(-25deg); + -webkit-transform: skewx(-25deg); + left: 50px; + } } .site-card-tag.speed { - background: var(--heo-green); - box-shadow: var(--heo-shadow-green); + background: var(--heo-green); + box-shadow: var(--heo-shadow-green); } .flink#article-container .site-card:hover .site-card-tag { - left: -50px; + left: -50px; } .flink-list-item:hover .site-card-tag { - left: -50px; + left: -50px; } .flink#article-container .site-card .info { - display: flex; - border: none; - padding: 0.5rem; - width: 100%; - height: 90px; - margin: 0; - border-radius: 0 0 12px 12px; + display: flex; + border: none; + padding: 0.5rem; + width: 100%; + height: 90px; + margin: 0; + border-radius: 0 0 12px 12px; } /* 修复图片圆角 */ .flink#article-container .site-card .img img { - border-radius: 12px 12px 0 0; - transform: scale(1.03); - transition: 0.3s; + border-radius: 12px 12px 0 0; + transform: scale(1.03); + transition: 0.3s; } @media screen and (min-width: 769px) { - .flink#article-container .site-card:hover .img img { - transform: scale(1.1); - filter: brightness(0.3); - } + .flink#article-container .site-card:hover .img img { + transform: scale(1.1); + filter: brightness(0.3); + } - .flink#article-container .site-card:hover .img { - height: 80px; - } + .flink#article-container .site-card:hover .img { + height: 80px; + } } .flink#article-container .site-card .img { - -webkit-mask-image: -webkit-radial-gradient(center, #fff, #000); - border-radius: 0; - height: 120px; - width: 100%; - display: flex; - border: none; - padding: 0 !important; + -webkit-mask-image: -webkit-radial-gradient(center, #fff, #000); + border-radius: 0; + height: 120px; + width: 100%; + display: flex; + border: none; + padding: 0 !important; } /* 头像 */ .flink#article-container .site-card .info img { - border-radius: 32px; - transition: .3s ease-out !important; - margin: 2px 8px 0 0; - width: 20px; - height: 20px; - min-width: 20px; - min-height: 20px; - background: var(--heo-secondbg); + border-radius: 32px; + transition: .3s ease-out !important; + margin: 2px 8px 0 0; + width: 20px; + height: 20px; + min-width: 20px; + min-height: 20px; + background: var(--heo-secondbg); } /* 边距 */ .flink#article-container .site-card-group { - padding: 20px 0; + padding: 20px 0; } .flink#article-container .site-card:hover .info img { - width: 0; - height: 0; - opacity: 0; - min-width: 0; - min-height: 0; + width: 0; + height: 0; + opacity: 0; + min-width: 0; + min-height: 0; } .flink#article-container .site-card:hover { - border: var(--style-border-hover); - box-shadow: var(--heo-shadow-main); + border: var(--style-border-hover); + box-shadow: var(--heo-shadow-main); } /* 友链文章 */ .article-sort-item-info a { - margin-right: auto; - overflow: hidden; - text-overflow: ellipsis; + margin-right: auto; + overflow: hidden; + text-overflow: ellipsis; } /* 新页脚 */ @media screen and (max-width: 768px) { - #letlink { - flex-direction: column !important; - text-align: center !important; - } + #letlink { + flex-direction: column !important; + text-align: center !important; + } - #letlogo { - display: none !important; - } + #letlogo { + display: none !important; + } - #footer-wrap { - margin-top: 1rem !important; - } + #footer-wrap { + margin-top: 1rem !important; + } } .footer-banner-right { - display: flex; - flex-direction: row; - flex-wrap: wrap; - align-items: center; + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: center; } #footer-wrap { - display: flex; - flex-wrap: wrap; - justify-content: space-around; - padding: 20px 50px 0px 50px; - text-align: left !important; - max-width: 1200px; - margin: 0px auto; + display: flex; + flex-wrap: wrap; + justify-content: space-around; + padding: 20px 50px 0px 50px; + text-align: left !important; + max-width: 1200px; + margin: 0px auto; } #footer-wrap h1 { - font-size: 1.5rem; - margin: 0; + font-size: 1.5rem; + margin: 0; } #footer-wrap h3 { - padding: 0 12px; + padding: 0 12px; } #footer-wrap p { - margin: 0 0 0 0.2rem; - font-size: 0.8rem; - opacity: 0.8; + margin: 0 0 0 0.2rem; + font-size: 0.8rem; + opacity: 0.8; } #footer-wrap i { - margin-right: 0.5rem; - width: 22px; - font-size: 18px; - display: inline-block; + margin-right: 0.5rem; + width: 22px; + font-size: 18px; + display: inline-block; } #footer-wrap #letlogo { - display: flex; - flex-direction: column; - margin-right: 60px; - align-self: center; - margin: auto 0; - max-width: 200px; + display: flex; + flex-direction: column; + margin-right: 60px; + align-self: center; + margin: auto 0; + max-width: 200px; } #footer-wrap #letlink .link_group { - display: flex; - flex-direction: column; - margin-right: 20px; - min-width: 180px; + display: flex; + flex-direction: column; + margin-right: 20px; + min-width: 180px; } #footer-wrap #letlink { - display: flex; - flex-direction: row; - justify-content: space-around; - margin: 0 0 1rem 0; + display: flex; + flex-direction: row; + justify-content: space-around; + margin: 0 0 1rem 0; } #weblogo i { - font-size: 2rem; - line-height: 2rem; - letter-spacing: -10px; + font-size: 2rem; + line-height: 2rem; + letter-spacing: -10px; } /*页脚样式一*/ .haofont.hao-icon-heartbeat { - transition: 0.3s; - animation: heartbeat-bounce 2s ease-in-out infinite; - -webkit-font-smoothing: antialiased; - display: var(--fa-display, inline-block); - font-style: normal; - font-variant: normal; - line-height: 1; - text-rendering: auto; + transition: 0.3s; + animation: heartbeat-bounce 2s ease-in-out infinite; + -webkit-font-smoothing: antialiased; + display: var(--fa-display, inline-block); + font-style: normal; + font-variant: normal; + line-height: 1; + text-rendering: auto; } #ghbdages .github-badge img { - height: 20px; - max-width: 150px; - border-radius: 4px; - pointer-events: none + height: 20px; + max-width: 150px; + border-radius: 4px; + pointer-events: none } #workboard img.boardsign { - width: 100%; - max-width: 130px; - border-radius: 0 + width: 100%; + max-width: 130px; + border-radius: 0 } @keyframes heartbeat-bounce { - 0%, - 100% { - transform: scale(1); - } - 10%, - 30% { - transform: scale(0.9); - } - 20%, - 40%, - 60%, - 80% { - transform: scale(1.1); - } - 50%, - 70% { - transform: scale(1.1); - } + 0%, + 100% { + transform: scale(1); + } + + 10%, + 30% { + transform: scale(0.9); + } + + 20%, + 40%, + 60%, + 80% { + transform: scale(1.1); + } + + 50%, + 70% { + transform: scale(1.1); + } } #workboard { - font-size: 12px; + font-size: 12px; } /* 页脚底层背景 */ #footer:before { - position: absolute !important; - width: 100% !important; - height: 100% !important; - content: '' !important; - z-index: -1; + position: absolute !important; + width: 100% !important; + height: 100% !important; + content: '' !important; + z-index: -1; } div#heo-footer-bar { - display: none + display: none } .post div#heo-footer-bar { - display: flex; - flex-direction: column; - align-items: center; - margin-top: 16px + display: flex; + flex-direction: column; + align-items: center; + margin-top: 16px } div#heo-footer-bar a.footer-bar-link { - padding: 4px 16px; - background: var(--heo-secondbg); - border-radius: 20px; - margin-top: 8px; - font-size: 14px; - cursor: pointer; - border: var(--style-border-always) + padding: 4px 16px; + background: var(--heo-secondbg); + border-radius: 20px; + margin-top: 8px; + font-size: 14px; + cursor: pointer; + border: var(--style-border-always) } div#heo-footer-bar a.footer-bar-link:hover { - background: var(--heo-main); - color: var(--heo-white); - transform: scale(1.1); - border-color: var(--heo-main) + background: var(--heo-main); + color: var(--heo-white); + transform: scale(1.1); + border-color: var(--heo-main) } div#heo-footer-bar .footer-logo { - font-size: 24px + font-size: 24px } div#heo-footer-bar .footer-bar-description { - color: var(--heo-secondtext); - font-weight: 700 + color: var(--heo-secondtext); + font-weight: 700 } /* 404页面 */ #error-wrap .error-content { - box-shadow: none !important; - border-radius: 12px; - background: var(--heo-card-bg) !important; + box-shadow: none !important; + border-radius: 12px; + background: var(--heo-card-bg) !important; } #body-wrap.page .errors { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - padding: 1rem; - padding-top: 50px; - position: relative; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 1rem; + padding-top: 50px; + position: relative; } #body-wrap.page .errors .aside-list { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - margin: 1rem; - max-width: 100%; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + margin: 1rem; + max-width: 100%; } #body-wrap.page .errors .aside-list .aside-list-group { - display: flex; - flex-direction: row; - flex-wrap: wrap; - max-width: 800px; - margin: 0 auto; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + max-width: 800px; + margin: 0 auto; + justify-content: space-between; } #body-wrap.page .errors .aside-list .aside-list-item { - padding: 0.5rem 0; - width: 49%; + padding: 0.5rem 0; + width: 49%; } #body-wrap.page .errors .aside-list .aside-list-item img { - width: 100%; - object-fit: cover; - border-radius: 12px; + width: 100%; + object-fit: cover; + border-radius: 12px; } #body-wrap.page .errors .aside-list .aside-list-item .thumbnail { - overflow: hidden; - width: 100%; - height: 200px; - background: var(--heo-card-bg); - display: flex; + overflow: hidden; + width: 100%; + height: 200px; + background: var(--heo-card-bg); + display: flex; } #body-wrap.page .errors .aside-list .aside-list-item .content .title { - -webkit-line-clamp: 2; - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - line-height: 1.5; - justify-content: center; - align-items: flex-end; - align-content: center; - padding-top: 0.5rem; - font-size: 16px; - font-weight: bold; + -webkit-line-clamp: 2; + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + line-height: 1.5; + justify-content: center; + align-items: flex-end; + align-content: center; + padding-top: 0.5rem; + font-size: 16px; + font-weight: bold; } #body-wrap.page .errors .aside-list .aside-list-item .content time { - display: none; + display: none; } @media screen and (max-width: 768px) { - #body-wrap.page .errors { - padding-top: 0; - } + #body-wrap.page .errors { + padding-top: 0; + } - #body-wrap.page .errors .aside-list { - margin: 0; - } + #body-wrap.page .errors .aside-list { + margin: 0; + } - #body-wrap.page .errors .aside-list .aside-list-item .thumbnail { - height: 100px; - } + #body-wrap.page .errors .aside-list .aside-list-item .thumbnail { + height: 100px; + } } /* bb哔哔 */ /* bb样式 */ #bber .timeline #waterfall { - opacity: 0; - transition: 0.3s; + opacity: 0; + transition: 0.3s; } #bber .timeline #waterfall.show { - opacity: 1; + opacity: 1; } #bber .timeline ul li.item { - position: relative; - width: 32%; - border: var(--style-border-always); - border-radius: 12px; - padding: 1rem; - padding-bottom: 0.5rem; - transition: 0.3s; - display: flex; - flex-direction: column; - flex-wrap: nowrap; - justify-content: space-between; - align-items: flex-start; - background: var(--heo-card-bg); - box-shadow: var(--heo-shadow-border); - margin-right: 2%; + position: relative; + width: 32%; + border: var(--style-border-always); + border-radius: 12px; + padding: 1rem; + padding-bottom: 0.5rem; + transition: 0.3s; + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-between; + align-items: flex-start; + background: var(--heo-card-bg); + box-shadow: var(--heo-shadow-border); + margin-right: 2%; } #bber .timeline ul li.item hr { - display: flex; - position: relative; - margin: 8px 0; - border: 1px dashed var(--heo-theme-op); - width: 100%; + display: flex; + position: relative; + margin: 8px 0; + border: 1px dashed var(--heo-theme-op); + width: 100%; } @media screen and (max-width: 768px) { - #bber .timeline ul li.item { - padding: 0; - } + #bber .timeline ul li.item { + padding: 0; + } } #bber .timeline ul li.item:hover { - border: var(--style-border-hover); + border: var(--style-border-hover); } #bber ul.list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; } #bber li.item { - display: flex; - flex-direction: column; - flex-wrap: nowrap; - align-items: flex-start; + display: flex; + flex-direction: column; + flex-wrap: nowrap; + align-items: flex-start; } @media screen and (max-width: 1300px) { - #bber .timeline ul li.item { - width: 49%; - margin-right: 1%; - } + #bber .timeline ul li.item { + width: 49%; + margin-right: 1%; + } } @media screen and (max-width: 768px) { - #bber .timeline ul li.item { - width: 100%; - margin-right: 0; - } + #bber .timeline ul li.item { + width: 100%; + margin-right: 0; + } - #bber .timeline ul li.item { - padding: 16px 20px; - } + #bber .timeline ul li.item { + padding: 16px 20px; + } } .timeline ul .list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; } /* 标题 */ .bb-info { - display: inline; - float: right; - line-height: 1; - color: var(--heo-secondtext); - margin-left: auto; - margin-bottom: 1rem; - margin-right: 0.5rem; + display: inline; + float: right; + line-height: 1; + color: var(--heo-secondtext); + margin-left: auto; + margin-bottom: 1rem; + margin-right: 0.5rem; } .bb-info:hover { - color: var(--heo-hovertext); + color: var(--heo-hovertext); } #bber { - margin-top: 1rem; - width: 100%; + margin-top: 1rem; + width: 100%; } /* 每条动态 */ #bber div.bber-content { - display: flex; - flex-direction: initial; - flex-wrap: wrap; - border-radius: 12px; - width: 100%; - height: 100%; + display: flex; + flex-direction: initial; + flex-wrap: wrap; + border-radius: 12px; + width: 100%; + height: 100%; } -#bber > section > ul > li.item { - margin-bottom: 1rem; +#bber>section>ul>li.item { + margin-bottom: 1rem; } #bber .bber-info { - display: flex; - align-items: center; + display: flex; + align-items: center; } #bber .bber-info .fa-rectangles-mixed { - margin-right: 8px; + margin-right: 8px; } #bber .bber-content-link { - display: flex; - margin-left: 0.5rem; - color: var(--heo-secondtext); - font-size: 0.7rem; - align-items: center; - background-color: rgba(245, 108, 108, 0.13); - color: #f56c6c; - padding: 0 8px; - border-radius: 20px; + display: flex; + margin-left: 0.5rem; + color: var(--heo-secondtext); + font-size: 0.7rem; + align-items: center; + background-color: rgba(245, 108, 108, 0.13); + color: #f56c6c; + padding: 0 8px; + border-radius: 20px; } #bber .bber-content-link:hover { - background-color: var(--heo-lighttext); - color: var(--heo-card-bg); + background-color: var(--heo-lighttext); + color: var(--heo-card-bg); } #bber .bber-content-link i { - margin-right: 3px; + margin-right: 3px; } #bber .bber-reply { - cursor: pointer; - padding: 0 4px; + cursor: pointer; + padding: 0 4px; } #bber .bber-bottom { - display: flex; - justify-content: space-between; - width: 100%; - -webkit-user-select: none + display: flex; + justify-content: space-between; + width: 100%; + -webkit-user-select: none } #bber .count { - color: var(--heo-secondtext); - font-size: 0.8rem; + color: var(--heo-secondtext); + font-size: 0.8rem; } #bber p { - margin: 0; + margin: 0; } #bber .datafrom i { - margin-right: 4px; + margin-right: 4px; } /* 音乐 */ #bber .bber-music { - width: 100%; - height: 90px; - margin: 0.5rem 0; - border-radius: 8px; - overflow: hidden; - border: var(--style-border-always); - background: var(--heo-secondbg); + width: 100%; + height: 90px; + margin: 0.5rem 0; + border-radius: 8px; + overflow: hidden; + border: var(--style-border-always); + background: var(--heo-secondbg); } #bber .aplayer { - margin: 0; + margin: 0; } #bber .aplayer .aplayer-info .aplayer-music .aplayer-title { - font-size: 0.8rem; - font-weight: bold; - margin: 0; - color: var(--heo-black); + font-size: 0.8rem; + font-weight: bold; + margin: 0; + color: var(--heo-black); } #bber .aplayer.aplayer-withlrc .aplayer-pic { - height: 82px; - width: 82px; - margin: 4px; - border-radius: 4px; + height: 82px; + width: 82px; + margin: 4px; + border-radius: 4px; } #bber .aplayer .aplayer-info .aplayer-music { - height: 23px; + height: 23px; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap { - padding: 0; + padding: 0; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar { - background: var(--heo-gray); - height: 8px; - border-radius: 12px; - transition: 0.3s; - overflow: hidden; + background: var(--heo-gray); + height: 8px; + border-radius: 12px; + transition: 0.3s; + overflow: hidden; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap:hover .aplayer-bar { - height: 12px; + height: 12px; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played { - height: 100%; - border-radius: 12px; + height: 100%; + border-radius: 12px; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded { - height: 100%; - border-radius: 12px; + height: 100%; + border-radius: 12px; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb { - display: none; + display: none; } #bber .aplayer .aplayer-info .aplayer-controller { - align-items: center; + align-items: center; } #bber .aplayer .aplayer-info .aplayer-controller .aplayer-time { - position: initial; + position: initial; } #bber .bber-music .aplayer-lrc { - display: none; + display: none; } /* 只能展示30条的提示 */ #bber-tips { - font-size: 14px; - display: flex; - justify-content: center; - margin-top: 1rem; + font-size: 14px; + display: flex; + justify-content: center; + margin-top: 1rem; } /* 图片 */ #bber .bber-container-img img { - object-fit: cover; - max-height: 100%; - border-radius: 12px; + object-fit: cover; + max-height: 100%; + border-radius: 12px; } #bber .bber-container-img { - display: flex; - align-items: center; - justify-content: space-around; - width: 100%; - flex-wrap: wrap; - margin-bottom: 0.3rem; + display: flex; + align-items: center; + justify-content: space-around; + width: 100%; + flex-wrap: wrap; + margin-bottom: 0.3rem; } #bber .bber-container-img a { - height: 100px; - border-radius: 8px; - overflow: hidden; - display: flex; - justify-content: center; - position: relative; - width: calc(100% / 4 - 5px); - margin-bottom: 10px + height: 100px; + border-radius: 8px; + overflow: hidden; + display: flex; + justify-content: center; + position: relative; + width: calc(100% / 4 - 5px); + margin-bottom: 10px } #bber .bber-container-img .bber-content-noimg { - width: calc(100% / 4 - 5px) + width: calc(100% / 4 - 5px) } /* 时间 */ -#bber > section > ul > li > div .bber-info-time { - color: var(--heo-fontcolor); - font-size: 0.7rem; - background-color: var(--heo-gray-op); - padding: 0 8px; - border-radius: 20px; - cursor: default; - display: flex; - align-items: center; +#bber>section>ul>li>div .bber-info-time { + color: var(--heo-fontcolor); + font-size: 0.7rem; + background-color: var(--heo-gray-op); + padding: 0 8px; + border-radius: 20px; + cursor: default; + display: flex; + align-items: center; } -#bber > section > ul > li > div .bber-info-time i { - margin-right: 8px; +#bber>section>ul>li>div .bber-info-time i { + margin-right: 8px; } /* 内容 */ #bber .bber-content .datacont { - order: 0; - font-size: 0.8rem; - font-weight: bold; - color: var(--heo-fontcolor); - width: 100%; - line-height: 1.38; - border-radius: 12px; - display: flex; - flex-direction: column; - text-align: justify; + order: 0; + font-size: 0.8rem; + font-weight: bold; + color: var(--heo-fontcolor); + width: 100%; + line-height: 1.38; + border-radius: 12px; + display: flex; + flex-direction: column; + text-align: justify; } #bber .bber-content .datacont p { - margin-bottom: 0.5rem; + margin-bottom: 0.5rem; } /* 标签 */ #bber .bber-content .datacont a.tag { - background-image: none !important; - background-color: #f2f2f2 !important; - color: #999 !important; - border-radius: 4px; - text-decoration: none; - font-weight: 400; - font-size: 15px; - padding: 2px 5px; + background-image: none !important; + background-color: #f2f2f2 !important; + color: #999 !important; + border-radius: 4px; + text-decoration: none; + font-weight: 400; + font-size: 15px; + padding: 2px 5px; } #bber .bber-content .datacont a.tag:before { - content: "#"; + content: "#"; } /* 设备 */ -#bber > section > ul > li > div .datafrom { - order: 2; - color: var(--heo-secondtext); - font-size: 0.7rem; - margin-left: 8px; +#bber>section>ul>li>div .datafrom { + order: 2; + color: var(--heo-secondtext); + font-size: 0.7rem; + margin-left: 8px; } -#bber > section > ul > li > div .datafrom small { - font-size: 0.7rem; +#bber>section>ul>li>div .datafrom small { + font-size: 0.7rem; } /* 加载更多 */ .load-btn.button-load { - background: var(--heo-card-btn-bg); - color: var(--heo-fontcolor); - padding: 12px 12px; - margin: 1.5rem 0 0 0; - width: 100%; - text-align: center; - border-radius: 12px; - transition: 0.3s; - font-weight: bold; + background: var(--heo-card-btn-bg); + color: var(--heo-fontcolor); + padding: 12px 12px; + margin: 1.5rem 0 0 0; + width: 100%; + text-align: center; + border-radius: 12px; + transition: 0.3s; + font-weight: bold; } .load-btn.button-load:hover { - background: var(--heo-blue); - color: var(--heo-white); - transition: 0.3s; - box-shadow: var(--heo-shadow-blue); + background: var(--heo-blue); + color: var(--heo-white); + transition: 0.3s; + box-shadow: var(--heo-shadow-blue); } /* 友链朋友圈 */ #hexo-circle-of-friends-root { - margin: 0 -8px; + margin: 0 -8px; } .moments-list { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .moments-list .article-sort-item-info { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .article-sort-item-info-more { - display: flex; - font-size: 0.7rem; - margin-right: auto; + display: flex; + font-size: 0.7rem; + margin-right: auto; } .friend_post_time { - margin-left: 8px; - color: var(--heo-secondtext); + margin-left: 8px; + color: var(--heo-secondtext); } .friendlink-avatar { - width: 3rem; - height: 3rem; - min-width: 3rem; - min-height: 3rem; - border-radius: 32px; - overflow: hidden; - background: var(--heo-secondbg); - padding: 0 !important; + width: 3rem; + height: 3rem; + min-width: 3rem; + min-height: 3rem; + border-radius: 32px; + overflow: hidden; + background: var(--heo-secondbg); + padding: 0 !important; } .friendlink-avatar:hover { - border-radius: 32px !important; - background: var(--heo-secondbg); + border-radius: 32px !important; + background: var(--heo-secondbg); } .moments-list .article-sort-item-info .article-sort-item-title { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } .moments-list .article-sort-item-info .article-sort-item-title:hover { - color: var(--heo-hovertext); + color: var(--heo-hovertext); } a.bb-link { - margin-left: 8px; - color: var(--heo-secondtext) !important; - display: inline; - border: none !important; + margin-left: 8px; + color: var(--heo-secondtext) !important; + display: inline; + border: none !important; } a.bb-link-info { - display: inline; - float: right; - border: none !important; - color: var(--heo-secondtext) !important; - line-height: 2.7rem; + display: inline; + float: right; + border: none !important; + color: var(--heo-secondtext) !important; + line-height: 2.7rem; } a.bb-link-info:hover { - color: var(--heo-fontcolor) !important; - background: none !important; + color: var(--heo-fontcolor) !important; + background: none !important; } #friend_link_moments { - border: none !important; + border: none !important; } .moments-article-img { - height: 100%; - margin: 0 !important; + height: 100%; + margin: 0 !important; } .tab-item-content #moments_container .moments-item a { - border-bottom: none; - padding: 0; - margin-right: auto; - width: auto; + border-bottom: none; + padding: 0; + margin-right: auto; + width: auto; } .tab-item-content #moments_container .moments-item a:hover { - background: none; - color: var(--heo-lighttext); - box-shadow: none; + background: none; + color: var(--heo-lighttext); + box-shadow: none; } .tab-item-content #moments_container h2 { - display: none; + display: none; } /* 朋友圈页面 */ #friend_moments_list .moments-sort-item { - margin: 1rem 0; + margin: 1rem 0; } .moments-sort-item-img { - border-radius: 12px; + border-radius: 12px; } .moments-item-time { - order: 1; + order: 1; } .moments-sort-item-title { - color: var(--heo-lighttext); - border-bottom: none !important; - padding: 0 !important; + color: var(--heo-lighttext); + border-bottom: none !important; + padding: 0 !important; } .moments-sort-item-title:hover { - color: var(--heo-hovertext) !important; - background: none !important; - box-shadow: none !important; + color: var(--heo-hovertext) !important; + background: none !important; + box-shadow: none !important; } .friendlink-avatar { - border-bottom: none !important; + border-bottom: none !important; } .moments_load_button { - color: var(--heo-fontcolor) !important; - background: var(--heo-card-btn-bg) !important; - padding: 12px 16px !important; - border-radius: 12px !important; - transition: 0.3s; - width: 100%; - margin-top: 1rem; - margin-bottom: 1rem; - border: 0 !important; + color: var(--heo-fontcolor) !important; + background: var(--heo-card-btn-bg) !important; + padding: 12px 16px !important; + border-radius: 12px !important; + transition: 0.3s; + width: 100%; + margin-top: 1rem; + margin-bottom: 1rem; + border: 0 !important; } .moments_load_button:hover { - color: var(--heo-white) !important; - background: var(--heo-main) !important; - transition: 0.3s; + color: var(--heo-white) !important; + background: var(--heo-main) !important; + transition: 0.3s; } .moments-item-title { - color: var(--heo-lighttext); - font-size: 1rem; - order: 0; - width: 100%; - font-weight: bold; - -webkit-line-clamp: 1 !important; - overflow: hidden; - -webkit-box-orient: vertical; + color: var(--heo-lighttext); + font-size: 1rem; + order: 0; + width: 100%; + font-weight: bold; + -webkit-line-clamp: 1 !important; + overflow: hidden; + -webkit-box-orient: vertical; } .moments-item-info { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .moments_post_time { - display: none; + display: none; } .moments_post_time i { - margin-right: 8px; + margin-right: 8px; } .chart { - align-items: flex-start; - flex: 1; - width: 100px; - height: 60px; - margin: 20px; + align-items: flex-start; + flex: 1; + width: 100px; + height: 60px; + margin: 20px; } .moments-item-title { - font-weight: bold; + font-weight: bold; } .moments_post_info_number { - float: right + float: right } @media screen and (max-width: 500px) { - #info_user_pool { - padding: 10px; - flex-direction: column; - max-height: 200px - } + #info_user_pool { + padding: 10px; + flex-direction: column; + max-height: 200px + } - .chart { - flex: 0; - width: 100%; - height: 160px; - margin: 0; - } + .chart { + flex: 0; + width: 100%; + height: 160px; + margin: 0; + } } .moments-item-img { - width: 60px !important; - height: 60px !important; + width: 60px !important; + height: 60px !important; } .moments-item-img img { - border-radius: 99px; - width: 80px; - height: 80px; - overflow: hidden; + border-radius: 99px; + width: 80px; + height: 80px; + overflow: hidden; } #info_user_pool { - background: var(--heo-secondbg); - border-radius: 12px !important; - margin-top: 1rem; - box-shadow: none !important; + background: var(--heo-secondbg); + border-radius: 12px !important; + margin-top: 1rem; + box-shadow: none !important; } .moments-item { - margin-left: 0 !important; - box-shadow: none !important; + margin-left: 0 !important; + box-shadow: none !important; } /* 豆瓣 */ .hexo-douban-item { - border-bottom: none !important; - background: var(--heo-card-bg); - border: var(--style-border); - box-shadow: var(--heo-shadow-border); - border-radius: 12px; - margin: 8px 0; - height: 160px; - min-height: 160px !important; - width: 49%; - overflow: hidden; + border-bottom: none !important; + background: var(--heo-card-bg); + border: var(--style-border); + box-shadow: var(--heo-shadow-border); + border-radius: 12px; + margin: 8px 0; + height: 160px; + min-height: 160px !important; + width: 49%; + overflow: hidden; } @media screen and (min-width: 1300px) { - .hexo-douban-item { - width: 32%; - } + .hexo-douban-item { + width: 32%; + } } #hexo-douban-item3 { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; } .hexo-douban-item .hexo-douban-picture a { - padding: 0 !important; + padding: 0 !important; } .hexo-douban-item .hexo-douban-picture img { - margin: 0px !important; - height: 100% !important; + margin: 0px !important; + height: 100% !important; } .hexo-douban-tabs { - display: none; + display: none; } .hexo-douban-title a { - border-bottom: 0px !important; + border-bottom: 0px !important; } .hexo-douban-title { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } .hexo-douban-title a:hover { - color: var(--heo-lighttext) !important; - background: var(--heo-none) !important; + color: var(--heo-lighttext) !important; + background: var(--heo-none) !important; } .hexo-douban-pagination { - margin: auto; - width: 100%; - display: flex; - justify-content: center; - align-items: center; + margin: auto; + width: 100%; + display: flex; + justify-content: center; + align-items: center; } span.hexo-douban-pagenum { - margin: 0 0.5rem; + margin: 0 0.5rem; } .hexo-douban-title { - font-size: 1rem; - line-height: 1; + font-size: 1rem; + line-height: 1; } .hexo-douban-title a { - padding: 0 !important; + padding: 0 !important; } .hexo-douban-info { - padding-left: 130px !important; - margin-right: 0.5rem; + padding-left: 130px !important; + margin-right: 0.5rem; } .hexo-douban-meta { - font-size: 0.7rem !important; - color: var(--heo-secondtext); - margin-top: 0.3rem; - line-height: 1.05; + font-size: 0.7rem !important; + color: var(--heo-secondtext); + margin-top: 0.3rem; + line-height: 1.05; } .hexo-douban-comments { - line-height: 1.2; - margin-top: 0.5rem; - font-size: 0.8rem !important; - -webkit-line-clamp: 3; - overflow: hidden; - text-overflow: ellipsis; - display: -webkit-box; - -webkit-box-orient: vertical; + line-height: 1.2; + margin-top: 0.5rem; + font-size: 0.8rem !important; + -webkit-line-clamp: 3; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-box-orient: vertical; } .hexo-douban-picture { - height: 100%; - top: 0 !important; - padding: 10px 0 10px 10px; + height: 100%; + top: 0 !important; + padding: 10px 0 10px 10px; } .hexo-douban-picture a img { - border-radius: 8px !important; + border-radius: 8px !important; } .hexo-douban-button { - width: 4rem; - height: 2rem; - line-height: 1.9rem; - border-radius: 8px !important; - background: var(--heo-card-bg); - box-shadow: var(--heo-shadow-lightblack); - border: var(--style-border); - margin: 0 0.2rem; - border-bottom: var(--style-border) !important; + width: 4rem; + height: 2rem; + line-height: 1.9rem; + border-radius: 8px !important; + background: var(--heo-card-bg); + box-shadow: var(--heo-shadow-lightblack); + border: var(--style-border); + margin: 0 0.2rem; + border-bottom: var(--style-border) !important; } /* 标签页 */ /* 隐藏时间 */ .article-sort-item-time { - display: none; + display: none; } /* 标签 */ .article-sort-item-tags { - margin-top: 8px; - white-space: nowrap; - overflow: hidden; - display: inline-block; - text-overflow: ellipsis; - width: 100%; - font-size: 0.7rem; + margin-top: 8px; + white-space: nowrap; + overflow: hidden; + display: inline-block; + text-overflow: ellipsis; + width: 100%; + font-size: 0.7rem; } .article-sort-item-tags a { - color: var(--heo-fontcolor); - transition: 0.3s; + color: var(--heo-fontcolor); + transition: 0.3s; } .article-sort-item-tags a:hover { - color: var(--heo-theme); - transition: 0.3s; + color: var(--heo-theme); + transition: 0.3s; } .article-sort-item-tags a .tags-punctuation { - font-size: 12px; - margin-right: 1px + font-size: 12px; + margin-right: 1px } /* v3footer */ #heo-footer .footer-links { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } #heo-footer { - display: flex; - flex-direction: row; - width: 100%; - max-width: 1200px; - margin: 1rem auto; - justify-content: space-between; - flex-wrap: wrap; - margin-bottom: 3rem; - padding: 0 1rem; + display: flex; + flex-direction: row; + width: 100%; + max-width: 1200px; + margin: 1rem auto; + justify-content: space-between; + flex-wrap: wrap; + margin-bottom: 3rem; + padding: 0 1rem; } #heo-footer .footer-item { - font-size: .8rem; - line-height: .8rem; - margin: 4px 0; - color: var(--heo-fontcolor); - margin-right: auto; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - max-width: 120px; - cursor: pointer; - padding: 8px; - border-radius: 12px + font-size: .8rem; + line-height: .8rem; + margin: 4px 0; + color: var(--heo-fontcolor); + margin-right: auto; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + max-width: 120px; + cursor: pointer; + padding: 8px; + border-radius: 12px } #heo-footer .footer-item:hover { - color: var(--heo-lighttext); - background: var(--heo-main-op-light) + color: var(--heo-lighttext); + background: var(--heo-main-op-light) } [data-theme=dark] #heo-footer .footer-item:hover { - background: var(--heo-main-op) + background: var(--heo-main-op) } #heo-footer .footer-group { - min-width: 120px; + min-width: 120px; } #heo-footer .footer-title-group { - display: flex; - align-items: center; - margin: 1rem 0 0.7rem 0; - color: var(--heo-secondtext); - font-size: .8rem; - margin-left: 8px + display: flex; + align-items: center; + margin: 1rem 0 0.7rem 0; + color: var(--heo-secondtext); + font-size: .8rem; + margin-left: 8px } #heo-footer .footer-title-group a { - margin-left: 8px; + margin-left: 8px; } #heo-footer .footer-title-group i { - line-height: 1; - color: var(--heo-secondtext); - transition: 0.3s; - font-size: 12px; + line-height: 1; + color: var(--heo-secondtext); + transition: 0.3s; + font-size: 12px; } #heo-footer .footer-title-group a:hover i { - color: var(--heo-main); + color: var(--heo-main); } #heo-footer .footer-title-group .footer-title { - margin: 0; + margin: 0; } #heo-footer .random-friends-btn { - display: flex; + display: flex; } #heo-footer .footer-title { - color: var(--heo-secondtext); - font-size: .8rem; - margin-left: 8px + color: var(--heo-secondtext); + font-size: .8rem; + margin-left: 8px } #footer-banner { - padding: 0.3rem; - color: var(--heo-fontcolor); - margin-top: 1rem; - background: var(--heo-secondbg) 0.6; - display: flex; - overflow: hidden; - z-index: 999; - transition: 0.3s; - border-top: var(--style-border-always); + padding: 0.3rem; + color: var(--heo-fontcolor); + margin-top: 1rem; + background: var(--heo-secondbg) 0.6; + display: flex; + overflow: hidden; + z-index: 999; + transition: 0.3s; + border-top: var(--style-border-always); } #footer-banner .footer-banner-links { - display: flex; - justify-content: space-between; - max-width: 1400px; - width: 100%; - margin: 0 auto; - flex-wrap: wrap; - align-items: center; - line-height: 3; + display: flex; + justify-content: space-between; + max-width: 1400px; + width: 100%; + margin: 0 auto; + flex-wrap: wrap; + align-items: center; + line-height: 3; } #footer-banner .footer-banner-left { - display: flex; - flex-wrap: wrap; - min-height: 32px; - align-items: center; + display: flex; + flex-wrap: wrap; + min-height: 32px; + align-items: center; } #footer-banner .footer-banner-link { - margin: 0 4px; - color: var(--heo-fontcolor); - font-size: .8rem; - font-weight: 700; - white-space: nowrap; - padding: 8px; - border-radius: 12px; - line-height: 1 + margin: 0 4px; + color: var(--heo-fontcolor); + font-size: .8rem; + font-weight: 700; + white-space: nowrap; + padding: 8px; + border-radius: 12px; + line-height: 1 } #footer-banner .footer-banner-link.cc { - margin-right: 0rem; + margin-right: 0rem; } #footer-banner .footer-banner-link.cc i:not(:last-child) { - margin-right: .5rem + margin-right: .5rem } #footer-banner .footer-banner-link.cc i { - font-size: 18px; + font-size: 18px; } #footer-banner .footer-banner-link:hover { - color: var(--heo-lighttext); - background: var(--heo-main-op) + color: var(--heo-lighttext); + background: var(--heo-main-op) } -#footer-banner > div > div.footer-banner-left > span { - margin-right: 1rem; +#footer-banner>div>div.footer-banner-left>span { + margin-right: 1rem; } #footer-banner .footer-banner-right a:hover { - color: var(--heo-lighttext); + color: var(--heo-lighttext); } #footer_deal i { - font-size: 0.9rem; - line-height: 0.9rem; - height: 0.9rem; + font-size: 0.9rem; + line-height: 0.9rem; + height: 0.9rem; } /* about关于页 */ .la-widget.la-data-widget__container { - border-radius: 12px; - border: var(--style-border) !important; - box-shadow: var(--heo-shadow-border); - border-color: var(--heo-card-border); + border-radius: 12px; + border: var(--style-border) !important; + box-shadow: var(--heo-shadow-border); + border-color: var(--heo-card-border); } #about-page { - display: flex; - padding-top: 1rem; - flex-direction: column; - align-items: center; + display: flex; + padding-top: 1rem; + flex-direction: column; + align-items: center; } @keyframes floating { - 0% { - transform: translate(0, -4px); - } - 50% { - transform: translate(0, 4px); - } - 100% { - transform: translate(0, -4px); - } + 0% { + transform: translate(0, -4px); + } + + 50% { + transform: translate(0, 4px); + } + + 100% { + transform: translate(0, -4px); + } } #about-page .author-info { - display: flex; - align-items: center; - margin: 0 0 16px 0; + display: flex; + align-items: center; + margin: 0 0 16px 0; } #about-page .author-tag-left { - display: flex; - flex-direction: column; - align-items: flex-end; + display: flex; + flex-direction: column; + align-items: flex-end; } #about-page .author-tag-right { - display: flex; - flex-direction: column; - align-items: flex-start; + display: flex; + flex-direction: column; + align-items: flex-start; } @media screen and (max-width: 768px) { - #about-page .author-tag-left, #about-page .author-tag-right { - display: none; - } + + #about-page .author-tag-left, + #about-page .author-tag-right { + display: none; + } } -#about-page .author-tag-left .author-tag:first-child, #about-page .author-tag-left .author-tag:last-child { - margin-right: -16px; +#about-page .author-tag-left .author-tag:first-child, +#about-page .author-tag-left .author-tag:last-child { + margin-right: -16px; } -#about-page .author-tag-right .author-tag:first-child, #about-page .author-tag-right .author-tag:last-child { - margin-left: -16px; +#about-page .author-tag-right .author-tag:first-child, +#about-page .author-tag-right .author-tag:last-child { + margin-left: -16px; } #about-page .author-tag { - transform: translate(0, -4px); - padding: 1px 8px; - background: var(--heo-card-bg); - border: var(--style-border-always); - border-radius: 40px; - margin-top: 6px; - font-size: 14px; - font-weight: bold; - box-shadow: var(--heo-shadow-lightblack); - animation: 6s ease-in-out 0s infinite normal none running floating; + transform: translate(0, -4px); + padding: 1px 8px; + background: var(--heo-card-bg); + border: var(--style-border-always); + border-radius: 40px; + margin-top: 6px; + font-size: 14px; + font-weight: bold; + box-shadow: var(--heo-shadow-lightblack); + animation: 6s ease-in-out 0s infinite normal none running floating; } #about-page .author-tag:nth-child(1) { - animation-delay: 0s; + animation-delay: 0s; } #about-page .author-tag:nth-child(2) { - animation-delay: 0.6s; + animation-delay: 0.6s; } #about-page .author-tag:nth-child(3) { - animation-delay: 1.2s; + animation-delay: 1.2s; } #about-page .author-tag:nth-child(4) { - animation-delay: 1.8s; + animation-delay: 1.8s; } #about-page .author-img { - margin: 0 30px; - border-radius: 50%; - width: 180px; - height: 180px; - position: relative; - background: var(--heo-secondbg); - user-select: none; - transition: .3s + margin: 0 30px; + border-radius: 50%; + width: 180px; + height: 180px; + position: relative; + background: var(--heo-secondbg); + user-select: none; + transition: .3s } #about-page .author-img img { - border-radius: 200px; - overflow: hidden; - width: 180px; - height: 180px + border-radius: 200px; + overflow: hidden; + width: 180px; + height: 180px } #about-page .author-img:hover { - transform: scale(1.1) + transform: scale(1.1) } #about-page .author-img::before { - content: ''; - -webkit-transition: 1s; - -moz-transition: 1s; - -o-transition: 1s; - -ms-transition: 1s; - transition: 1s; - width: 30px; - height: 30px; - background: var(--heo-green); - position: absolute; - border-radius: 50%; - border: 5px solid var(--heo-background); - bottom: 5px; - right: 10px; - z-index: 2; + content: ''; + -webkit-transition: 1s; + -moz-transition: 1s; + -o-transition: 1s; + -ms-transition: 1s; + transition: 1s; + width: 30px; + height: 30px; + background: var(--heo-green); + position: absolute; + border-radius: 50%; + border: 5px solid var(--heo-background); + bottom: 5px; + right: 10px; + z-index: 2; } @media screen and (max-width: 768px) { - #about-page .author-img { - width: 120px; - height: 120px; - } + #about-page .author-img { + width: 120px; + height: 120px; + } - #about-page .author-img img { - width: 120px; - height: 120px - } + #about-page .author-img img { + width: 120px; + height: 120px + } - #about-page .author-img::before { - bottom: -5px; - right: -5px; - } + #about-page .author-img::before { + bottom: -5px; + right: -5px; + } } #about-page .author-title { - font-size: 2rem; - font-weight: bold; - margin: 1rem 0; - line-height: 1; + font-size: 2rem; + font-weight: bold; + margin: 1rem 0; + line-height: 1; } .page-title { - display: none; + display: none; } :root { - --offset: 0px; + --offset: 0px; } .inline-word { - word-break: keep-all; - white-space: nowrap; + word-break: keep-all; + white-space: nowrap; } /* 一行内容 */ .author-content { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - width: 100%; - margin-top: 1rem; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + width: 100%; + margin-top: 1rem; } /* 一行内容，纵向组件 */ .author-content-item-group.column { - display: flex; - flex-direction: column; - width: 49%; - justify-content: space-between; + display: flex; + flex-direction: column; + width: 49%; + justify-content: space-between; } /* 一行内容，横向组件 */ .author-content-item { - width: 49%; - border-radius: 24px; - background: var(--heo-card-bg); - border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); - position: relative; - padding: 1rem 2rem; - overflow: hidden; + width: 49%; + border-radius: 24px; + background: var(--heo-card-bg); + border: var(--style-border-always); + box-shadow: var(--heo-shadow-border); + position: relative; + padding: 1rem 2rem; + overflow: hidden; } .author-content-item.single { - width: 100%; + width: 100%; } .author-content-item .author-content-item-title { - font-size: 36px; - font-weight: bold; - line-height: 1; + font-size: 36px; + font-weight: bold; + line-height: 1; } .author-content-item .author-content-item-tips { - opacity: 0.8; - font-size: 0.6rem; - margin-bottom: 0.5rem; + opacity: 0.8; + font-size: 0.6rem; + margin-bottom: 0.5rem; } @media screen and (max-width: 768px) { - .author-content-item { - width: 100% !important; - margin-top: 1rem; - padding: 1rem; - } + .author-content-item { + width: 100% !important; + margin-top: 1rem; + padding: 1rem; + } - .author-content-item-group.column { - width: 100% !important; - } + .author-content-item-group.column { + width: 100% !important; + } - .author-content { - margin-top: 0rem; - } + .author-content { + margin-top: 0rem; + } } .card-background-icon { - font-size: 12rem; - opacity: 0.2; - position: absolute; - right: 0; - bottom: -40%; - transform: rotate(30deg); - transition: 2s ease-in-out; + font-size: 12rem; + opacity: 0.2; + position: absolute; + right: 0; + bottom: -40%; + transform: rotate(30deg); + transition: 2s ease-in-out; } .author-content-item:hover .card-background-icon { - transform: rotate(20deg); + transform: rotate(20deg); } .about-reward { - position: absolute; - top: 1rem; - right: 2rem + position: absolute; + top: 1rem; + right: 2rem } @media screen and (max-width: 768px) { - .reward .about-reward #con { - width: 170px - } + .reward .about-reward #con { + width: 170px + } - .reward #tube-con { - display: none - } + .reward #tube-con { + display: none + } } .reward #con { - width: 350px; - height: 85px; - position: relative; - border-radius: 4px + width: 350px; + height: 85px; + position: relative; + border-radius: 4px } .reward #TA-con { - width: 157px; - height: 50px; - background-color: #f25d8e; - -webkit-box-shadow: 0 4px 4px rgba(255, 112, 159, .3); - box-shadow: 0 4px 4px rgba(255, 112, 159, .3); - position: absolute; - top: 50%; - left: 10%; - -webkit-transform: translateY(-50%); - -moz-transform: translateY(-50%); - -o-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); - border-radius: 4px; - cursor: pointer + width: 157px; + height: 50px; + background-color: #f25d8e; + -webkit-box-shadow: 0 4px 4px rgba(255, 112, 159, .3); + box-shadow: 0 4px 4px rgba(255, 112, 159, .3); + position: absolute; + top: 50%; + left: 10%; + -webkit-transform: translateY(-50%); + -moz-transform: translateY(-50%); + -o-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); + border-radius: 4px; + cursor: pointer } @media screen and (max-width: 768px) { - .reward #TA-con { - width: 125px; - left: 54px - } + .reward #TA-con { + width: 125px; + left: 54px + } } .reward #TA-con:hover { - background-color: #ff6b9a + background-color: #ff6b9a } .reward #text-con { - width: 100px; - height: 100%; - margin: 0 auto; - position: relative + width: 100px; + height: 100%; + margin: 0 auto; + position: relative } .reward #linght { - width: 0; - height: 0; - position: absolute; - top: 36%; - left: 4px; - border-color: transparent; - border-style: solid; - border-width: 10px; - border-top: 10px solid #fff; - border-radius: 4px; - -webkit-transform: rotate(-55deg); - -moz-transform: rotate(-55deg); - -o-transform: rotate(-55deg); - -ms-transform: rotate(-55deg); - transform: rotate(-55deg) + width: 0; + height: 0; + position: absolute; + top: 36%; + left: 4px; + border-color: transparent; + border-style: solid; + border-width: 10px; + border-top: 10px solid #fff; + border-radius: 4px; + -webkit-transform: rotate(-55deg); + -moz-transform: rotate(-55deg); + -o-transform: rotate(-55deg); + -ms-transform: rotate(-55deg); + transform: rotate(-55deg) } .reward #linght::after { - position: absolute; - top: -13px; - left: -11px; - content: ""; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; - border-width: 10px; - border-top: 10px solid #fff; - -webkit-transform: rotate(180deg); - -moz-transform: rotate(180deg); - -o-transform: rotate(180deg); - -ms-transform: rotate(180deg); - transform: rotate(180deg); - border-radius: 4px + position: absolute; + top: -13px; + left: -11px; + content: ""; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + border-width: 10px; + border-top: 10px solid #fff; + -webkit-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -o-transform: rotate(180deg); + -ms-transform: rotate(180deg); + transform: rotate(180deg); + border-radius: 4px } .reward #TA { - float: right; - line-height: 50px; - font-size: 15px; - color: #fff + float: right; + line-height: 50px; + font-size: 15px; + color: #fff } .reward #tube-con { - width: 157px; - height: 55px; - position: absolute; - right: -5px; - top: 15px + width: 157px; + height: 55px; + position: absolute; + right: -5px; + top: 15px } .reward svg { - width: 100%; - height: 100% + width: 100%; + height: 100% } .reward #mask { - width: 0; - height: 100%; - overflow: hidden; - position: absolute; - top: 0; - left: 0; - -webkit-transition: all .5s; - -moz-transition: all .5s; - -o-transition: all .5s; - -ms-transition: all .5s; - transition: all .5s + width: 0; + height: 100%; + overflow: hidden; + position: absolute; + top: 0; + left: 0; + -webkit-transition: all .5s; + -moz-transition: all .5s; + -o-transition: all .5s; + -ms-transition: all .5s; + transition: all .5s } .reward #mask svg { - width: 157px; - height: 55px + width: 157px; + height: 55px } -.reward #TA-con:hover + #tube-con > #mask { - width: 157px +.reward #TA-con:hover+#tube-con>#mask { + width: 157px } -.reward #TA-con:hover + #tube-con > #orange-mask { - -webkit-animation: move1 .5s linear .2s infinite; - -moz-animation: move1 .5s linear .2s infinite; - -o-animation: move1 .5s linear .2s infinite; - -ms-animation: move1 .5s linear .2s infinite; - animation: move1 .5s linear .2s infinite +.reward #TA-con:hover+#tube-con>#orange-mask { + -webkit-animation: move1 .5s linear .2s infinite; + -moz-animation: move1 .5s linear .2s infinite; + -o-animation: move1 .5s linear .2s infinite; + -ms-animation: move1 .5s linear .2s infinite; + animation: move1 .5s linear .2s infinite } -.reward #TA-con:hover + #tube-con > #orange-mask svg { - -webkit-animation: movetwo .5s linear .2s infinite; - -moz-animation: movetwo .5s linear .2s infinite; - -o-animation: movetwo .5s linear .2s infinite; - -ms-animation: movetwo .5s linear .2s infinite; - animation: movetwo .5s linear .2s infinite +.reward #TA-con:hover+#tube-con>#orange-mask svg { + -webkit-animation: movetwo .5s linear .2s infinite; + -moz-animation: movetwo .5s linear .2s infinite; + -o-animation: movetwo .5s linear .2s infinite; + -ms-animation: movetwo .5s linear .2s infinite; + animation: movetwo .5s linear .2s infinite } .reward #orange-mask { - width: 18px; - height: 100%; - overflow: hidden; - position: absolute; - left: -15px; - top: 0 + width: 18px; + height: 100%; + overflow: hidden; + position: absolute; + left: -15px; + top: 0 } .reward #orange-mask svg { - position: absolute; - top: 0; - left: 15px; - width: 157px; - height: 55px + position: absolute; + top: 0; + left: 15px; + width: 157px; + height: 55px } .reward #people { - position: absolute; - right: 10px; - top: 4px; - font-size: 12px; - font-family: "雅黑"; - color: #aaa + position: absolute; + right: 10px; + top: 4px; + font-size: 12px; + font-family: "雅黑"; + color: #aaa } -.reward #people > b { - color: #777 +.reward #people>b { + color: #777 } @-moz-keyframes move1 { - 0% { - left: -15px - } + 0% { + left: -15px + } - 100% { - left: 140px - } + 100% { + left: 140px + } } @-webkit-keyframes move1 { - 0% { - left: -15px - } + 0% { + left: -15px + } - 100% { - left: 140px - } + 100% { + left: 140px + } } @-o-keyframes move1 { - 0% { - left: -15px - } + 0% { + left: -15px + } - 100% { - left: 140px - } + 100% { + left: 140px + } } @keyframes move1 { - 0% { - left: -15px - } + 0% { + left: -15px + } - 100% { - left: 140px - } + 100% { + left: 140px + } } @-moz-keyframes movetwo { - 0% { - left: 15px - } + 0% { + left: 15px + } - 100% { - left: -140px - } + 100% { + left: -140px + } } @-webkit-keyframes movetwo { - 0% { - left: 15px - } + 0% { + left: 15px + } - 100% { - left: -140px - } + 100% { + left: -140px + } } @-o-keyframes movetwo { - 0% { - left: 15px - } + 0% { + left: 15px + } - 100% { - left: -140px - } + 100% { + left: -140px + } } @keyframes movetwo { - 0% { - left: 15px - } + 0% { + left: 15px + } - 100% { - left: -140px - } + 100% { + left: -140px + } } /* 关于页面打招呼信息 */ #about-page .myInfoAndSayHello { - display: flex; - flex-direction: column; - justify-content: center; - color: var(--heo-white); - background: linear-gradient(120deg, rgba(91, 39, 255, 1) 0%, rgba(0, 212, 255, 1) 100%); - background-size: 200%; - animation: gradient 15s ease infinite; - width: 59%; + display: flex; + flex-direction: column; + justify-content: center; + color: var(--heo-white); + background: linear-gradient(120deg, rgba(91, 39, 255, 1) 0%, rgba(0, 212, 255, 1) 100%); + background-size: 200%; + animation: gradient 15s ease infinite; + width: 59%; } #about-page .myInfoAndSayHello .title1 { - opacity: 0.8; - line-height: 1.3; + opacity: 0.8; + line-height: 1.3; } #about-page .myInfoAndSayHello .title2 { - font-size: 36px; - font-weight: bold; - line-height: 1.1; - margin: 0.5rem 0; + font-size: 36px; + font-weight: bold; + line-height: 1.1; + margin: 0.5rem 0; } .author-content-item-group.column.mapAndInfo { - width: 59%; + width: 59%; } /* 关于页面自我信息 */ .author-content-item.selfInfo { - display: flex; - min-height: 100px; - max-height: 400px; - justify-content: space-between; - align-items: center; - flex-wrap: wrap; - height: -webkit-fill-available; - height: 40%; + display: flex; + min-height: 100px; + max-height: 400px; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + height: -webkit-fill-available; + height: 40%; } @media screen and (max-width: 1300px) { - .author-content-item.selfInfo { - height: 70%; - } + .author-content-item.selfInfo { + height: 70%; + } } .author-content-item.selfInfo div { - display: flex; - flex-direction: column; - margin: 0.5rem 2rem 0.5rem 0; + display: flex; + flex-direction: column; + margin: 0.5rem 2rem 0.5rem 0; } .author-content-item.selfInfo .selfInfo-title { - opacity: 0.8; - font-size: 0.6rem; - line-height: 1; - margin-bottom: 8px; + opacity: 0.8; + font-size: 0.6rem; + line-height: 1; + margin-bottom: 8px; } .author-content-item.selfInfo .selfInfo-content { - font-weight: bold; - font-size: 34px; - line-height: 1; + font-weight: bold; + font-size: 34px; + line-height: 1; } /* 关于页面我的照片 */ .author-content-item.myphoto { - height: 60%; - min-height: 240px; - position: relative; - overflow: hidden; - width: 39%; - display: flex; - align-items: center; - justify-content: center; + height: 60%; + min-height: 240px; + position: relative; + overflow: hidden; + width: 39%; + display: flex; + align-items: center; + justify-content: center; } .author-content-item.myphoto img { - position: absolute; - height: 100%; - min-width: 100%; - object-fit: cover; - transition: 0.6s; + position: absolute; + height: 100%; + min-width: 100%; + object-fit: cover; + transition: 0.6s; } .author-content-item.myphoto:hover img { - min-width: 105%; - transition: 2s; + min-width: 105%; + transition: 2s; } .author-content-item.myphoto .myphoto-title { - position: absolute; - bottom: 0px; - left: 0px; - width: 100%; - background: var(--heo-maskbgdeep); - padding: 0.5rem 2rem; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); + position: absolute; + bottom: 0px; + left: 0px; + width: 100%; + background: var(--heo-maskbgdeep); + padding: 0.5rem 2rem; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); } /* 关于页面我的生涯图片 */ .author-content-item.careers { - min-height: 400px; + min-height: 400px; } .author-content-item.careers img { - position: absolute; - left: 0; - bottom: 20px; - width: 100%; - transition: 0.6s; + position: absolute; + left: 0; + bottom: 20px; + width: 100%; + transition: 0.6s; } .author-content-item.careers .careers-group { - margin-top: 12px; + margin-top: 12px; } .author-content-item.careers .careers-item { - display: flex; - align-items: center; + display: flex; + align-items: center; } .author-content-item.careers .careers-item .circle { - width: 16px; - height: 16px; - margin-right: 8px; - border-radius: 16px; + width: 16px; + height: 16px; + margin-right: 8px; + border-radius: 16px; } .author-content-item.careers .careers-item .name { - color: var(--heo-secondtext); + color: var(--heo-secondtext); } /* 关于页面我的性格 */ .author-content-item.personalities { - overflow: hidden; - position: relative; - width: 59%; + overflow: hidden; + position: relative; + width: 59%; } .author-content-item.personalities .title2 { - font-size: 36px; - font-weight: bold; - line-height: 1.1; + font-size: 36px; + font-weight: bold; + line-height: 1.1; } .author-content-item.personalities .image { - position: absolute; - right: -40px; - bottom: -10rem; - transition: transform 2s cubic-bezier(0.13, 0.45, 0.21, 1.02); + position: absolute; + right: -40px; + bottom: -10rem; + transition: transform 2s cubic-bezier(0.13, 0.45, 0.21, 1.02); } .author-content-item.personalities:hover .image { - transform: rotate(-10deg); + transform: rotate(-10deg); } @media screen and (max-width: 768px) { - .author-content-item.personalities { - min-height: 360px; - } + .author-content-item.personalities { + min-height: 360px; + } - .author-content-item.personalities .image { - right: -70px; - } + .author-content-item.personalities .image { + right: -70px; + } } /* 关于页面座右铭 */ .author-content-item.maxim { - font-size: 36px; - font-weight: bold; - line-height: 1.1; - display: flex; - align-items: flex-start; - flex-direction: column; - justify-content: center; - width: 39%; + font-size: 36px; + font-weight: bold; + line-height: 1.1; + display: flex; + align-items: flex-start; + flex-direction: column; + justify-content: center; + width: 39%; } .author-content-item.maxim .maxim-title { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .author-content-item.maxim .title1 { - opacity: 0.8; - font-size: 0.6rem; - margin-bottom: 0.5rem; + opacity: 0.8; + font-size: 0.6rem; + margin-bottom: 0.5rem; } /* 关于页面特长 */ .author-content-item.buff { - height: 200px; - font-size: 36px; - font-weight: bold; - line-height: 1.1; - display: flex; - align-items: flex-start; - flex-direction: column; - justify-content: center; - background: linear-gradient(120deg, rgba(255, 39, 232, 1) 0%, rgba(255, 128, 0, 1) 100%); - color: var(--heo-white); - background-size: 200%; - animation: gradient 15s ease infinite; - min-height: 200px; - height: fit-content; - width: 59%; + height: 200px; + font-size: 36px; + font-weight: bold; + line-height: 1.1; + display: flex; + align-items: flex-start; + flex-direction: column; + justify-content: center; + background: linear-gradient(120deg, rgba(255, 39, 232, 1) 0%, rgba(255, 128, 0, 1) 100%); + color: var(--heo-white); + background-size: 200%; + animation: gradient 15s ease infinite; + min-height: 200px; + height: fit-content; + width: 59%; } .author-content-item.buff .card-content { - display: flex; - flex-direction: column; - justify-content: center; + display: flex; + flex-direction: column; + justify-content: center; } .author-content-item.buff .buff-title { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .author-content-item.buff .title1 { - opacity: 0.8; - font-size: 0.6rem; - margin-bottom: 0.5rem; + opacity: 0.8; + font-size: 0.6rem; + margin-bottom: 0.5rem; } /* 关于页面我的技能 */ .author-content-item.skills { - display: flex; - justify-content: center; - align-items: flex-start; - flex-direction: column; - width: 49%; - min-height: 450px; + display: flex; + justify-content: center; + align-items: flex-start; + flex-direction: column; + width: 49%; + min-height: 450px; } .author-content-item.skills .tags-group-all { - display: flex; - transform: rotate(0deg); - transition: 0.3s; + display: flex; + transform: rotate(0deg); + transition: 0.3s; } .author-content-item.skills .tags-group-wrapper { - margin-top: 40px; - display: flex; - flex-wrap: nowrap; - animation: rowup 60s linear infinite; + margin-top: 40px; + display: flex; + flex-wrap: nowrap; + animation: rowup 60s linear infinite; } .author-content-item.skills .skills-style-group { - position: relative; + position: relative; } .author-content-item.skills .skills-list { - display: flex; - opacity: 0; - transition: 0.3s; - position: absolute; - width: 100%; - top: 0; - left: 0; - flex-wrap: wrap; - flex-direction: row; - margin-top: 10px; + display: flex; + opacity: 0; + transition: 0.3s; + position: absolute; + width: 100%; + top: 0; + left: 0; + flex-wrap: wrap; + flex-direction: row; + margin-top: 10px; } .author-content-item.skills:hover .skills-style-group .tags-group-all { - opacity: 0; + opacity: 0; } .author-content-item.skills:hover .skills-style-group .skills-list { - opacity: 1; + opacity: 1; } .author-content-item.skills .skill-info { - display: flex; - align-items: center; - margin-right: 10px; - margin-top: 10px; - background: var(--heo-background); - border-radius: 40px; - padding: 4px 12px 4px 8px; - border: var(--style-border); - box-shadow: var(--heo-shadow-border); + display: flex; + align-items: center; + margin-right: 10px; + margin-top: 10px; + background: var(--heo-background); + border-radius: 40px; + padding: 4px 12px 4px 8px; + border: var(--style-border); + box-shadow: var(--heo-shadow-border); } .author-content-item.skills .etc { - margin-right: 10px; - margin-top: 10px; + margin-right: 10px; + margin-top: 10px; } .author-content-item.skills .skill-icon { - width: 32px; - height: 32px; - border-radius: 32px; - display: flex; - align-items: center; - justify-content: center; - margin-right: 8px; - user-select: none + width: 32px; + height: 32px; + border-radius: 32px; + display: flex; + align-items: center; + justify-content: center; + margin-right: 8px; + user-select: none } .author-content-item.skills .skill-icon img { - width: 18px; - height: 18px; + width: 18px; + height: 18px; } .author-content-item.skills .skill-name { - font-weight: bold; - line-height: 1 + font-weight: bold; + line-height: 1 } /* 关于页面滚动 */ .author-content-item.aboutsiteTips { - display: flex; - justify-content: center; - align-items: flex-start; - flex-direction: column; - width: 39%; + display: flex; + justify-content: center; + align-items: flex-start; + flex-direction: column; + width: 39%; } .aboutsiteTips h2 { - margin-right: auto; - font-size: 36px; - font-family: Helvetica; - line-height: 1.06; - letter-spacing: -0.02em; - color: var(--heo-fontcolor); - margin-top: 0; + margin-right: auto; + font-size: 36px; + font-family: Helvetica; + line-height: 1.06; + letter-spacing: -0.02em; + color: var(--heo-fontcolor); + margin-top: 0; } .aboutsiteTips .mask { - height: 36px; - position: relative; - overflow: hidden; - margin-top: 4px; + height: 36px; + position: relative; + overflow: hidden; + margin-top: 4px; } .aboutsiteTips .mask span { - display: block; - box-sizing: border-box; - position: absolute; - top: 36px; - padding-bottom: var(--offset); - background-size: 100% 100%; - -webkit-background-clip: text; - background-clip: text; - -webkit-text-fill-color: transparent; - background-repeat: no-repeat; + display: block; + box-sizing: border-box; + position: absolute; + top: 36px; + padding-bottom: var(--offset); + background-size: 100% 100%; + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; + background-repeat: no-repeat; } .aboutsiteTips .mask span[data-show] { - transform: translateY(-100%); - transition: .5s transform ease-in-out; + transform: translateY(-100%); + transition: .5s transform ease-in-out; } .aboutsiteTips .mask span[data-up] { - transform: translateY(-200%); - transition: .5s transform ease-in-out; + transform: translateY(-200%); + transition: .5s transform ease-in-out; } .aboutsiteTips .mask span:nth-child(1) { - background-image: linear-gradient(45deg, #0ecffe 50%, #07a6f1); + background-image: linear-gradient(45deg, #0ecffe 50%, #07a6f1); } .aboutsiteTips .mask span:nth-child(2) { - background-image: linear-gradient(45deg, #18e198 50%, #0ec15d); + background-image: linear-gradient(45deg, #18e198 50%, #0ec15d); } .aboutsiteTips .mask span:nth-child(3) { - background-image: linear-gradient(45deg, #8a7cfb 50%, #633e9c); + background-image: linear-gradient(45deg, #8a7cfb 50%, #633e9c); } .aboutsiteTips .mask span:nth-child(4) { - background-image: linear-gradient(45deg, #fa7671 50%, #f45f7f); + background-image: linear-gradient(45deg, #fa7671 50%, #f45f7f); } @media screen and (max-width: 768px) { - .author-content-item.map { - margin-bottom: 0; - } + .author-content-item.map { + margin-bottom: 0; + } } /* 关于51la页面统计 */ #about-page .about-statistic { - min-height: 380px; - width: 39%; - background: url(https://img.zhheo.com/i/2022/09/23/632d5d8f37e90.webp) no-repeat top; - background-size: cover; - color: var(--heo-white); - overflow: hidden; + min-height: 380px; + width: 39%; + background: url(https://img.zhheo.com/i/2022/09/23/632d5d8f37e90.webp) no-repeat top; + background-size: cover; + color: var(--heo-white); + overflow: hidden; } #about-page .about-statistic::after { - box-shadow: 0 -159px 173px 71px #0f1114 inset; - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; + box-shadow: 0 -159px 173px 71px #0f1114 inset; + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; } #about-page .about-statistic .banner-button { - background: var(--heo-white-op) + background: var(--heo-white-op) } #about-page .about-statistic .banner-button:hover { - background: var(--heo-lighttext) + background: var(--heo-lighttext) } #statistic { - font-size: 16px; - border-radius: 15px; - width: 100%; - color: var(--heo-white); - display: flex; - justify-content: space-between; - flex-direction: row; - flex-wrap: wrap; - margin-top: 1rem; - margin-bottom: 2rem; + font-size: 16px; + border-radius: 15px; + width: 100%; + color: var(--heo-white); + display: flex; + justify-content: space-between; + flex-direction: row; + flex-wrap: wrap; + margin-top: 1rem; + margin-bottom: 2rem; } #statistic div { - display: flex; - justify-content: space-between; - flex-direction: column; - width: 50%; - margin-bottom: 0.5rem; + display: flex; + justify-content: space-between; + flex-direction: column; + width: 50%; + margin-bottom: 0.5rem; } #statistic div span:first-child { - opacity: 0.8; - font-size: 0.6rem; + opacity: 0.8; + font-size: 0.6rem; } #statistic div span:last-child { - font-weight: bold; - font-size: 34px; - line-height: 1; - white-space: nowrap; + font-weight: bold; + font-size: 34px; + line-height: 1; + white-space: nowrap; } .author-content-item.about-statistic .card-content .banner-button-group .banner-button:hover { - background: #998c5a; - color: var(--heo-card-bg) + background: #998c5a; + color: var(--heo-card-bg) } /* 关于页面赞赏 */ .author-content-item.single.reward .author-content-item .author-content-item-title { - color: var(--heo-red); + color: var(--heo-red); } .author-content-item.single.reward .reward-list-all { - display: flex; - flex-wrap: wrap; - flex-direction: row; - margin-top: 1rem; - margin-bottom: 0.5rem; - margin-left: -0.25rem; - margin-right: -0.25rem; + display: flex; + flex-wrap: wrap; + flex-direction: row; + margin-top: 1rem; + margin-bottom: 0.5rem; + margin-left: -0.25rem; + margin-right: -0.25rem; } .author-content-item.single.reward .reward-list-all .reward-list-item { - padding: 1rem; - border-radius: 12px; - border: var(--style-border-always); - width: calc((100% / 6) - 0.5rem); - margin: 0rem 0.25rem 0.5rem 0.25rem; - box-shadow: var(--heo-shadow-border); + padding: 1rem; + border-radius: 12px; + border: var(--style-border-always); + width: calc((100% / 6) - 0.5rem); + margin: 0rem 0.25rem 0.5rem 0.25rem; + box-shadow: var(--heo-shadow-border); } .author-content-item.single.reward .reward-list-all .reward-list-item:hover { - background-color: rgb(0, 108, 242); - color: #FFFFFF; + background-color: rgb(0, 108, 242); + color: #FFFFFF; } @media screen and (max-width: 1200px) { - .author-content-item.single.reward .reward-list-all .reward-list-item { - width: calc((100% / 4) - 0.5rem); - } - .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { - width: 32%; - } + .author-content-item.single.reward .reward-list-all .reward-list-item { + width: calc((100% / 4) - 0.5rem); + } + + .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { + width: 32%; + } } @media screen and (max-width: 900px) { - .author-content-item.single.reward .reward-list-all .reward-list-item { - width: calc((100% / 2) - 0.5rem); - } - .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { - width: 20%; - } + .author-content-item.single.reward .reward-list-all .reward-list-item { + width: calc((100% / 2) - 0.5rem); + } + + .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { + width: 20%; + } } @media screen and (max-width: 768px) { - .author-content-item.single.reward .reward-list-all .reward-list-item { - width: 100%; - } - .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { - width: 9%; - } + .author-content-item.single.reward .reward-list-all .reward-list-item { + width: 100%; + } + + .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { + width: 9%; + } } @media screen and (max-width: 520px) { - .author-content-item.single.reward .reward-list-all .reward-list-item { - width: 100%; - } - .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { - width: 20%; - } + .author-content-item.single.reward .reward-list-all .reward-list-item { + width: 100%; + } + + .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { + width: 20%; + } } .author-content-item.single.reward .author-content-item-description { - font-size: 16px; - margin-top: 0.5rem; + font-size: 16px; + margin-top: 0.5rem; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-name { - font-size: 1rem; - font-weight: bold; - line-height: 1; - margin-bottom: 0.5rem; + font-size: 1rem; + font-weight: bold; + line-height: 1; + margin-bottom: 0.5rem; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-bottom-group { - display: flex; - align-items: center; - justify-content: space-between; - float: left; - width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + float: left; + width: 100%; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar { - width: 32%; - float: left; - z-index: 10; - position: static; - height: 40px; - transform: translateY(-40%); + width: 32%; + float: left; + z-index: 10; + position: static; + height: 40px; + transform: translateY(-40%); } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar img { - border-radius: 50%; - width: 80%; - margin-top: 0.2rem; + border-radius: 50%; + width: 80%; + margin-top: 0.2rem; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-avatar-group { - width: 65%; - float: left; - z-index: 10; - position: static; - overflow: hidden; + width: 65%; + float: left; + z-index: 10; + position: static; + overflow: hidden; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-money { - padding: 4px; - background: var(--heo-fontcolor); - color: var(--card-bg); - font-size: 12px; - line-height: 1; - border-radius: 4px; - margin-right: 4px; - white-space: nowrap; + padding: 4px; + background: var(--heo-fontcolor); + color: var(--card-bg); + font-size: 12px; + line-height: 1; + border-radius: 4px; + margin-right: 4px; + white-space: nowrap; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-time { - font-size: 12px; - color: var(--heo-secondtext); - white-space: nowrap; + font-size: 12px; + color: var(--heo-secondtext); + white-space: nowrap; } .author-content-item.single.reward .reward-list-all .reward-list-item .reward-list-item-time:hover { - font-size: 12px; - color: #FFFFFF; - white-space: nowrap; + font-size: 12px; + color: #FFFFFF; + white-space: nowrap; } .author-content-item.single.reward .reward-list-updateDate { - color: var(--heo-gray); - font-size: 14px; + color: var(--heo-gray); + font-size: 14px; } .author-content-item.single.reward .post-reward { - position: absolute; - right: 2rem; - top: 2rem; + position: absolute; + right: 2rem; + top: 2rem; } .author-content-item.single.reward .post-reward .reward-button { - padding: 8px 12px; - background: var(--heo-red); - border-radius: 12px; - color: var(--heo-white); - display: flex; - align-items: center; - z-index: 1; - transition: .3s; - cursor: pointer; - box-shadow: none; - width: fit-content; - height: fit-content; - line-height: 2; + padding: 8px 12px; + background: var(--heo-red); + border-radius: 12px; + color: var(--heo-white); + display: flex; + align-items: center; + z-index: 1; + transition: .3s; + cursor: pointer; + box-shadow: none; + width: fit-content; + height: fit-content; + line-height: 2; } @media screen and (max-width: 768px) { - .author-content-item.single.reward .post-reward .reward-button { - display: none; - } + .author-content-item.single.reward .post-reward .reward-button { + display: none; + } } .author-content-item.single.reward .post-reward .reward-button i { - margin-right: 8px; - font-size: 1rem; + margin-right: 8px; + font-size: 1rem; } .author-content-item.single.reward .post-reward .reward-main { - top: 60px; - right: 0; - left: auto; - bottom: auto; - width: fit-content; - box-shadow: var(--heo-shadow-border); + top: 60px; + right: 0; + left: auto; + bottom: auto; + width: fit-content; + box-shadow: var(--heo-shadow-border); } .author-content-item.single.reward .post-reward .reward-main .reward-all::before { - bottom: auto; - top: -16px; + bottom: auto; + top: -16px; } .author-content-item.single.reward a.reward-main-btn { - display: none; + display: none; } /* 喜欢的游戏 lol */ .author-content-item.game-lol { - background: url(https://img.zhheo.com/i/2022/08/31/630efa7ae39fe.webp) no-repeat top; - background-size: cover; - min-height: 300px; - overflow: hidden; - color: var(--heo-white); - width: 59%; + background: url(https://img.zhheo.com/i/2022/08/31/630efa7ae39fe.webp) no-repeat top; + background-size: cover; + min-height: 300px; + overflow: hidden; + color: var(--heo-white); + width: 59%; } .author-content-item .card-content { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - z-index: 2; - display: flex; - flex-direction: column; - padding: 1rem 2rem; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 2; + display: flex; + flex-direction: column; + padding: 1rem 2rem; } @media screen and (max-width: 768px) { - .author-content-item .card-content { - padding: 1rem; - } + .author-content-item .card-content { + padding: 1rem; + } } @media screen and (min-width: 1300px) { - .author-content-item { - animation: slide-in .6s 0s backwards - } + .author-content-item { + animation: slide-in .6s 0s backwards + } } .author-content-item.game-lol::after { - box-shadow: 0 -69px 203px 11px #575d8b inset; - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; + box-shadow: 0 -69px 203px 11px #575d8b inset; + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; } .loading-bar { - position: absolute; - /* top: 50%; + position: absolute; + /* top: 50%; left: 50%; */ - width: 500px; - height: 62.5px; - transform: translate(-25%, -50%) scale(0.5); - transition: all 0.5s; - user-select: none; - overflow: hidden; + width: 500px; + height: 62.5px; + transform: translate(-25%, -50%) scale(0.5); + transition: all 0.5s; + user-select: none; + overflow: hidden; } .author-content-item.game-lol:hover .loading-bar::after { - animation: loading-bar 3.5s cubic-bezier(0.28, 0.11, 0.32, 1) infinite forwards; + animation: loading-bar 3.5s cubic-bezier(0.28, 0.11, 0.32, 1) infinite forwards; } @keyframes loading-bar { - 0% { - width: 0; - background-size: 500px 62.5px; - } - 16.6% { - } - 33.2% { - } - 49.8% { - } - 66.4% { - } - 83% { - width: 475px; - } - 83.1% { - width: 475px; - } - 83.2% { - width: 475px; - } - 83.3% { - width: 475px; - } - 83.4% { - width: 475px; - } - 83.5% { - width: 475px; - } - 83.6% { - width: 475px; - } - 83.7% { - width: 475px; - } - 83.8% { - width: 475px; - } - 83.9% { - width: 475px; - } - 84% { - width: 475px; - } - 85% { - width: 475px; - } - 86% { - width: 475px; - } - 87% { - width: 475px; - } - 100% { - width: 500px; - } + 0% { + width: 0; + background-size: 500px 62.5px; + } + + 16.6% {} + + 33.2% {} + + 49.8% {} + + 66.4% {} + + 83% { + width: 475px; + } + + 83.1% { + width: 475px; + } + + 83.2% { + width: 475px; + } + + 83.3% { + width: 475px; + } + + 83.4% { + width: 475px; + } + + 83.5% { + width: 475px; + } + + 83.6% { + width: 475px; + } + + 83.7% { + width: 475px; + } + + 83.8% { + width: 475px; + } + + 83.9% { + width: 475px; + } + + 84% { + width: 475px; + } + + 85% { + width: 475px; + } + + 86% { + width: 475px; + } + + 87% { + width: 475px; + } + + 100% { + width: 500px; + } } .author-content-item .content-bottom { - margin-top: auto; - display: flex; - align-items: center; - justify-content: space-between; + margin-top: auto; + display: flex; + align-items: center; + justify-content: space-between; } .author-content-item .content-bottom .icon-group { - display: flex; + display: flex; } .author-content-item .content-bottom .icon-group i { - display: inline-block; - width: 22px; - height: 18px; - margin-right: 0.5rem; + display: inline-block; + width: 22px; + height: 18px; + margin-right: 0.5rem; } .icon-pos-sup { - background: url('https://img.zhheo.com/i/2022/08/25/63074b68d9f4c.png'); + background: url('https://img.zhheo.com/i/2022/08/25/63074b68d9f4c.png'); } .icon-pos-mid { - background: url('https://img.zhheo.com/i/2022/08/25/63074b54d2731.png'); + background: url('https://img.zhheo.com/i/2022/08/25/63074b54d2731.png'); } /* 喜欢的游戏 狼人杀 */ .author-content-item.game-wolf { - width: 39%; - background: url(https://img.zhheo.com/i/2022/08/31/630efa916a851.webp) no-repeat top; - background-size: cover; - min-height: 300px; - overflow: hidden; - color: var(--heo-white); + width: 39%; + background: url(https://img.zhheo.com/i/2022/08/31/630efa916a851.webp) no-repeat top; + background-size: cover; + min-height: 300px; + overflow: hidden; + color: var(--heo-white); } .author-content-item.game-wolf::after { - /* box-shadow: 0 -69px 203px 11px #415dc9 inset; */ - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; + /* box-shadow: 0 -69px 203px 11px #415dc9 inset; */ + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; } .author-content-item.comic-content { - width: 39%; - min-height: 300px; - overflow: hidden + width: 39%; + min-height: 300px; + overflow: hidden } .author-content-item.comic-content .comic-box { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - width: 120%; - height: 100%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translateX(-50%); - -moz-transform: translateX(-50%); - -o-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%) + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + width: 120%; + height: 100%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translateX(-50%); + -moz-transform: translateX(-50%); + -o-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%) } -.author-content-item.comic-content .author-content-item-tips, .author-content-item.comic-content .author-content-item-title { - z-index: 2; - color: var(--heo-white); - pointer-events: none +.author-content-item.comic-content .author-content-item-tips, +.author-content-item.comic-content .author-content-item-title { + z-index: 2; + color: var(--heo-white); + pointer-events: none } .author-content-item.comic-content .comic-item { - height: 100%; - color: #fff; - width: 20%; - -webkit-transform: skew(-10deg, 0deg); - -moz-transform: skew(-10deg, 0deg); - -o-transform: skew(-10deg, 0deg); - -ms-transform: skew(-10deg, 0deg); - transform: skew(-10deg, 0deg); - -webkit-transition: .8s; - -moz-transition: .8s; - -o-transition: .8s; - -ms-transition: .8s; - transition: .8s; - position: relative; - overflow: hidden + height: 100%; + color: #fff; + width: 20%; + -webkit-transform: skew(-10deg, 0deg); + -moz-transform: skew(-10deg, 0deg); + -o-transform: skew(-10deg, 0deg); + -ms-transform: skew(-10deg, 0deg); + transform: skew(-10deg, 0deg); + -webkit-transition: .8s; + -moz-transition: .8s; + -o-transition: .8s; + -ms-transition: .8s; + transition: .8s; + position: relative; + overflow: hidden } .author-content-item.comic-content .comic-item:hover { - width: 46% + width: 46% } .author-content-item.comic-content .comic-item:hover .comic-item-cover { - left: 16%; - -webkit-transform: skew(10deg, 0deg) scale(1.6); - -moz-transform: skew(10deg, 0deg) scale(1.6); - -o-transform: skew(10deg, 0deg) scale(1.6); - -ms-transform: skew(10deg, 0deg) scale(1.6); - transform: skew(10deg, 0deg) scale(1.6) + left: 16%; + -webkit-transform: skew(10deg, 0deg) scale(1.6); + -moz-transform: skew(10deg, 0deg) scale(1.6); + -o-transform: skew(10deg, 0deg) scale(1.6); + -ms-transform: skew(10deg, 0deg) scale(1.6); + transform: skew(10deg, 0deg) scale(1.6) } .author-content-item.comic-content .comic-item .comic-item-cover { - position: absolute; - top: 0; - left: -50%; - height: 100%; - -webkit-transform: skew(10deg, 0deg); - -moz-transform: skew(10deg, 0deg); - -o-transform: skew(10deg, 0deg); - -ms-transform: skew(10deg, 0deg); - transform: skew(10deg, 0deg); - object-fit: cover; - -webkit-transition: scale .2s, all .8s; - -moz-transition: scale .2s, all .8s; - -o-transition: scale .2s, all .8s; - -ms-transition: scale .2s, all .8s; - transition: scale .2s, all .8s + position: absolute; + top: 0; + left: -50%; + height: 100%; + -webkit-transform: skew(10deg, 0deg); + -moz-transform: skew(10deg, 0deg); + -o-transform: skew(10deg, 0deg); + -ms-transform: skew(10deg, 0deg); + transform: skew(10deg, 0deg); + object-fit: cover; + -webkit-transition: scale .2s, all .8s; + -moz-transition: scale .2s, all .8s; + -o-transition: scale .2s, all .8s; + -ms-transition: scale .2s, all .8s; + transition: scale .2s, all .8s } .author-content-item.comic-content .comic-item .comic-item-cover img { - height: 100%; - -webkit-transition: .8s; - -moz-transition: .8s; - -o-transition: .8s; - -ms-transition: .8s; - transition: .8s; - max-width: none; - border-radius: 0 + height: 100%; + -webkit-transition: .8s; + -moz-transition: .8s; + -o-transition: .8s; + -ms-transition: .8s; + transition: .8s; + max-width: none; + border-radius: 0 } .author-content-item.comic-content::after { - -webkit-box-shadow: 0 -48px 203px 11px #fbe9b8 inset; - box-shadow: 0 -48px 203px 11px #fbe9b8 inset; - position: absolute; - content: ""; - width: 100%; - height: 100%; - top: 0; - left: 0 + -webkit-box-shadow: 0 -48px 203px 11px #fbe9b8 inset; + box-shadow: 0 -48px 203px 11px #fbe9b8 inset; + position: absolute; + content: ""; + width: 100%; + height: 100%; + top: 0; + left: 0 } /* 关注领域 */ .author-content-item.like-technology { - background: url(https://img.zhheo.com/i/2022/08/31/630efac3ecef3.webp) no-repeat; - background-size: cover; - min-height: 230px; - color: var(--heo-white); + background: url(https://img.zhheo.com/i/2022/08/31/630efac3ecef3.webp) no-repeat; + background-size: cover; + min-height: 230px; + color: var(--heo-white); } /* 喜欢音乐 */ .author-content-item.like-music { - background: url(https://img.zhheo.com/i/2022/08/31/630efae141e9a.webp) no-repeat top; - background-size: cover; - min-height: 400px; - color: var(--heo-white); - overflow: hidden; + background: url(https://img.zhheo.com/i/2022/08/31/630efae141e9a.webp) no-repeat top; + background-size: cover; + min-height: 400px; + color: var(--heo-white); + overflow: hidden; } .author-content-item.like-music::after { - box-shadow: 0 -69px 203px 11px #453e38 inset; - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; + box-shadow: 0 -69px 203px 11px #453e38 inset; + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; } .author-content-item .card-content .author-content-item-title { - margin-bottom: 0.5rem; + margin-bottom: 0.5rem; } .author-content-item .card-content .banner-button-group { - position: absolute; - bottom: 1.5rem; - right: 2rem; + position: absolute; + bottom: 1.5rem; + right: 2rem; } .author-content-item .card-content .banner-button-group .banner-button { - height: 40px; - width: 118px; - border-radius: 20px; - justify-content: center; - background: var(--heo-black-op); - color: var(--heo-white); - display: flex; - align-items: center; - z-index: 1; - transition: .3s; - cursor: pointer; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); + height: 40px; + width: 118px; + border-radius: 20px; + justify-content: center; + background: var(--heo-black-op); + color: var(--heo-white); + display: flex; + align-items: center; + z-index: 1; + transition: .3s; + cursor: pointer; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); } .author-content-item .card-content .banner-button-group .banner-button:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg) + background: var(--heo-lighttext); + color: var(--heo-card-bg) } .author-content-item .card-content .banner-button-group .banner-button i { - margin-right: 8px; - font-size: 1rem; + margin-right: 8px; + font-size: 1rem; } @media screen and (max-width: 768px) { - .author-content-item .card-content .banner-button-group { - right: 1rem; - bottom: 1rem; - } + .author-content-item .card-content .banner-button-group { + right: 1rem; + bottom: 1rem; + } - .author-content-item .card-content .banner-button-group .banner-button { - background: none; - color: var(--heo-white); - padding: 0; - width: fit-content; - } + .author-content-item .card-content .banner-button-group .banner-button { + background: none; + color: var(--heo-white); + padding: 0; + width: fit-content; + } - .author-content-item .card-content .banner-button-group .banner-button i { - margin-right: 0; - font-size: 1.5rem; - } + .author-content-item .card-content .banner-button-group .banner-button i { + margin-right: 0; + font-size: 1.5rem; + } - .author-content-item .card-content .banner-button-group .banner-button-text { - display: none; - } + .author-content-item .card-content .banner-button-group .banner-button-text { + display: none; + } } /* 豆瓣电影页面 */ .author-content-item.single.like-movie { - height: 19rem; - background: url(https://img.zhheo.com/i/2022/09/27/633289920d1c7.webp) no-repeat top; - background-size: cover; - color: var(--heo-white); - overflow: hidden; + height: 19rem; + background: url(https://img.zhheo.com/i/2022/09/27/633289920d1c7.webp) no-repeat top; + background-size: cover; + color: var(--heo-white); + overflow: hidden; } .author-content-item.single.like-movie::after { - box-shadow: 0 21px 133px 81px #1c1c1c inset; - position: absolute; - content: ''; - width: 100%; - height: 100%; - top: 0; - left: 0; + box-shadow: 0 21px 133px 81px #1c1c1c inset; + position: absolute; + content: ''; + width: 100%; + height: 100%; + top: 0; + left: 0; } #article-container .author-content-item.single.like-movie .banner-button-group .banner-button { - padding: 8px 12px; - background: var(--heo-white); - border-radius: 12px; - color: var(--heo-black); - display: flex; - align-items: center; - z-index: 1; - transition: 0.3s; - cursor: pointer; - border: none; + padding: 8px 12px; + background: var(--heo-white); + border-radius: 12px; + color: var(--heo-black); + display: flex; + align-items: center; + z-index: 1; + transition: 0.3s; + cursor: pointer; + border: none; } #article-container .author-content-item.single.like-movie .banner-button-group .banner-button:hover { - background: #d0b247; - color: var(--heo-white); + background: #d0b247; + color: var(--heo-white); } #article-container .author-content-item.single.like-movie .banner-button-group .banner-button i { - margin-right: 8px; - font-size: 1rem; + margin-right: 8px; + font-size: 1rem; } @media screen and (max-width: 768px) { - #article-container .author-content-item.single.like-movie .banner-button-group { - right: 1rem; - bottom: 1rem; - } + #article-container .author-content-item.single.like-movie .banner-button-group { + right: 1rem; + bottom: 1rem; + } - #article-container .author-content-item.single.like-movie .banner-button-group .banner-button { - background: none; - color: var(--heo-white); - padding: 0; - } + #article-container .author-content-item.single.like-movie .banner-button-group .banner-button { + background: none; + color: var(--heo-white); + padding: 0; + } - #article-container .author-content-item.single.like-movie .banner-button-group .banner-button i { - margin-right: 0; - font-size: 1.5rem; - } + #article-container .author-content-item.single.like-movie .banner-button-group .banner-button i { + margin-right: 0; + font-size: 1.5rem; + } - #article-container .author-content-item.single.like-movie .banner-button-group .banner-button-text { - display: none; - } + #article-container .author-content-item.single.like-movie .banner-button-group .banner-button-text { + display: none; + } } /* 工具推荐 */ .author-content.author-content-item.toolPage { - height: 19rem; - background: url(https://img.zhheo.com/i/2022/08/26/6308d5778ba3c.jpg) no-repeat top; - background-size: cover; - color: var(--heo-white); - overflow: hidden; - margin-top: 0; + height: 19rem; + background: url(https://img.zhheo.com/i/2022/08/26/6308d5778ba3c.jpg) no-repeat top; + background-size: cover; + color: var(--heo-white); + overflow: hidden; + margin-top: 0; } /* 友链鱼塘 */ .author-content.author-content-item.momentsPage { - height: 19rem; - background: url(https://img.zhheo.com/i/2022/08/26/6308d5b137881.jpg) no-repeat top; - background-size: cover; - color: var(--heo-white); - overflow: hidden; - margin-top: 0; + height: 19rem; + background: url(https://img.zhheo.com/i/2022/08/26/6308d5b137881.jpg) no-repeat top; + background-size: cover; + color: var(--heo-white); + overflow: hidden; + margin-top: 0; } /* 即刻短文 */ .author-content.author-content-item.essayPage { - height: 19rem; - background: url(https://img.zhheo.com/i/2022/08/27/6309587509a02.jpg) no-repeat center; - background-size: cover; - color: var(--heo-white); - overflow: hidden; - margin-top: 0; + height: 19rem; + background: url(https://img.zhheo.com/i/2022/08/27/6309587509a02.jpg) no-repeat center; + background-size: cover; + color: var(--heo-white); + overflow: hidden; + margin-top: 0; } /* 中控台 */ #console { - display: flex; - position: fixed; - width: 100vw; - height: 100vh; - top: 0; - left: 0; - z-index: 9999; - justify-content: center; - opacity: 0; - transition: .3s ease-out; - flex-direction: column; - align-items: center; - pointer-events: none; + display: flex; + position: fixed; + width: 100vw; + height: 100vh; + top: 0; + left: 0; + z-index: 9999; + justify-content: center; + opacity: 0; + transition: .3s ease-out; + flex-direction: column; + align-items: center; + pointer-events: none; } #console.show { - opacity: 1; - pointer-events: all; + opacity: 1; + pointer-events: all; } #console .console-card-group { - display: flex; - justify-content: space-between; - align-items: center; - margin: 0 30px; - max-width: 1400px; - transform: translateY(20px); - transition: 0.3s; - opacity: 0; + display: flex; + justify-content: space-between; + align-items: center; + margin: 0 30px; + max-width: 1400px; + transform: translateY(20px); + transition: 0.3s; + opacity: 0; } #console.show .console-card-group { - transform: translateY(0px); - opacity: 1; - transition-delay: 0.1s; + transform: translateY(0px); + opacity: 1; + transition-delay: 0.1s; } #console .console-card-group-left { - margin-right: 0.5rem; - width: 40%; - height: 100%; + margin-right: 0.5rem; + width: 40%; + height: 100%; } #console .console-card-group-right { - display: flex; - flex-direction: column; - justify-content: center; - height: 100%; - width: 60%; - overflow: hidden; + display: flex; + flex-direction: column; + justify-content: center; + height: 100%; + width: 60%; + overflow: hidden; } @media screen and (max-width: 1300px) { - #console .console-card-group { - justify-content: center; - } + #console .console-card-group { + justify-content: center; + } - #console .console-card-group-left { - display: none; - } + #console .console-card-group-left { + display: none; + } - #console .console-card-group-right { - width: 100%; - margin: 0; - } + #console .console-card-group-right { + width: 100%; + margin: 0; + } - #consoleMusic { - display: none; - } + #consoleMusic { + display: none; + } - #consoleCommentBarrage { - display: none; - } + #consoleCommentBarrage { + display: none; + } } @media screen and (max-width: 768px) { - #console .console-card-group { - display: none; - } + #console .console-card-group { + display: none; + } - #consoleHideAside { - display: none; - } + #consoleHideAside { + display: none; + } } @media screen and (max-height: 800px) { - #console .console-card-group { - display: none; - } + #console .console-card-group { + display: none; + } - #consoleMusic { - display: none; - } + #consoleMusic { + display: none; + } - #consoleCommentBarrage { - display: none; - } + #consoleCommentBarrage { + display: none; + } } #console .console-card { - background: var(--heo-maskbg); - border-radius: 12px; - overflow: hidden; - border: var(--style-border); - box-shadow: var(--heo-shadow-border); - padding: 40px; + background: var(--heo-maskbg); + border-radius: 12px; + overflow: hidden; + border: var(--style-border); + box-shadow: var(--heo-shadow-border); + padding: 40px; } .console-card-group-reward .reward-all .reward-item img { - width: 230px; - height: 230px + width: 230px; + height: 230px } #console .console-card.tags { - height: calc(100% - 172px); + height: calc(100% - 172px); } #console .console-mask { - background: var(--heo-maskbgdeep); - backdrop-filter: saturate(100%) blur(0px); - -webkit-backdrop-filter: blur(0px); - width: 100vw; - height: 100vh; - top: 0; - left: 0; - position: absolute; - z-index: -1; - transition: 0.3s; - -webkit-backface-visibility: hidden; - -webkit-transform-style: preserve-3d; + background: var(--heo-maskbgdeep); + backdrop-filter: saturate(100%) blur(0px); + -webkit-backdrop-filter: blur(0px); + width: 100vw; + height: 100vh; + top: 0; + left: 0; + position: absolute; + z-index: -1; + transition: 0.3s; + -webkit-backface-visibility: hidden; + -webkit-transform-style: preserve-3d; } #console.show .console-mask { - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); } #card-newest-comments .aside-list-item .thumbnail img { - width: 20px; - height: 20px; - margin-right: 8px; - border-radius: 20px; + width: 20px; + height: 20px; + margin-right: 8px; + border-radius: 20px; } #card-newest-comments .aside-list-item { - background: var(--heo-card-bg); - border-radius: 12px; - border: var(--style-border); - padding: 12px 16px; - width: 49%; - display: flex; - flex-direction: column; - height: 150px; - transition: 0.3s; - position: relative; + background: var(--heo-card-bg); + border-radius: 12px; + border: var(--style-border); + padding: 12px 16px; + width: 49%; + display: flex; + flex-direction: column; + height: 150px; + transition: 0.3s; + position: relative; } #card-newest-comments .aside-list-item:hover { - background: var(--heo-main); - color: var(--heo-white); + background: var(--heo-main); + color: var(--heo-white); } #card-newest-comments .aside-list-item:not(:last-child) { - margin-bottom: 0.5rem; + margin-bottom: 0.5rem; } #card-newest-comments .aside-list-item .name { - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - font-weight: bold; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + font-weight: bold; } #console .author-content-item-tips { - opacity: .8; - font-size: .6rem; - margin-bottom: .5rem; + opacity: .8; + font-size: .6rem; + margin-bottom: .5rem; } #console .author-content-item-title { - font-size: 36px; - font-weight: 700; - line-height: 1; + font-size: 36px; + font-weight: 700; + line-height: 1; } #console .aside-list-item .thumbnail { - display: flex; - align-items: center; + display: flex; + align-items: center; } #console .aside-list-item:hover .thumbnail { - color: var(--heo-white); + color: var(--heo-white); } #console .aside-list-item .content { - display: flex; - flex-direction: column; - height: 100%; - margin-top: 0.5rem; + display: flex; + flex-direction: column; + height: 100%; + margin-top: 0.5rem; } #console .aside-list-item .content .comment { - -webkit-line-clamp: 2; - display: -webkit-box; - overflow: hidden; - -webkit-box-orient: vertical; - line-height: 24px; - font-size: 14px; + -webkit-line-clamp: 2; + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; + line-height: 24px; + font-size: 14px; } #console .aside-list-item .content .comment::before { - content: ''; - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; + content: ''; + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; } #console .aside-list-item:hover .content .comment { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } #console .aside-list-item .content time { - font-size: 12px; - color: var(--heo-secondtext); - margin-top: auto; + font-size: 12px; + color: var(--heo-secondtext); + margin-top: auto; } #console .aside-list-item:hover .content time { - color: var(--heo-card-bg); + color: var(--heo-card-bg); } #card-newest-comments .aside-list-item:hover .name { - color: var(--heo-card-bg) + color: var(--heo-card-bg) } #console .aside-list { - display: flex; - flex-wrap: wrap; - flex-direction: row; - justify-content: space-between; - margin-top: 1.5rem; + display: flex; + flex-wrap: wrap; + flex-direction: row; + justify-content: space-between; + margin-top: 1.5rem; } #console .button-group { - display: flex; - margin: 1rem auto 0 auto; - justify-content: center; - width: fit-content; + display: flex; + margin: 1rem auto 0 auto; + justify-content: center; + width: fit-content; } #console .button-group .console-btn-item { - width: 60px; - height: 60px; - transition: 0.3s; - cursor: pointer; + width: 60px; + height: 60px; + transition: 0.3s; + cursor: pointer; } #console .button-group .console-btn-item:not(:last-child) { - margin-right: 0.5rem; + margin-right: 0.5rem; } #console .button-group .console-btn-item:hover a { - background: var(--heo-main); + background: var(--heo-main); } #console .button-group .console-btn-item a i { - font-size: 24px + font-size: 24px } #console .button-group .console-btn-item a { - width: 100%; - height: 100%; - background: var(--card-bg); - border: var(--style-border); - border-radius: 60px; - display: flex; - align-items: center; - justify-content: center; - color: var(--heo-fontcolor); + width: 100%; + height: 100%; + background: var(--card-bg); + border: var(--style-border); + border-radius: 60px; + display: flex; + align-items: center; + justify-content: center; + color: var(--heo-fontcolor); } #console .button-group .console-btn-item.on a { - background: var(--heo-orange); - color: var(--heo-white); - transition: 0.3s; + background: var(--heo-orange); + color: var(--heo-white); + transition: 0.3s; } #console .button-group .console-btn-item a:hover { - background: var(--heo-main) !important; + background: var(--heo-main) !important; } #console .button-group .console-btn-item:hover a { - color: var(--heo-white); + color: var(--heo-white); } .console-card.tags .card-tag-cloud { - margin-top: 1.5rem; - display: flex; - flex-wrap: wrap; + margin-top: 1.5rem; + display: flex; + flex-wrap: wrap; } .console-card.tags .card-tag-cloud a { - color: var(--heo-fontcolor) !important; - margin: 6px 4px; - padding: 2px 8px; - border-radius: 8px; - background: var(--heo-card-bg); - border: var(--style-border); - font-size: 14px !important; - font-weight: bold; + color: var(--heo-fontcolor) !important; + margin: 6px 4px; + padding: 2px 8px; + border-radius: 8px; + background: var(--heo-card-bg); + border: var(--style-border); + font-size: 14px !important; + font-weight: bold; } .console-card.tags .card-tag-cloud a:hover { - background: var(--heo-main); - color: var(--heo-card-bg) !important; + background: var(--heo-main); + color: var(--heo-card-bg) !important; } .console-card.tags .card-tag-cloud a sup { - opacity: 0.6; + opacity: 0.6; } #console .close-btn { - width: 100%; - height: 60px; - position: fixed; - right: max(0, calc((100% - 1400px) / 2)); - top: 0; - font-size: 35px; - color: var(--heo-fontcolor); - cursor: pointer; - transition: 0.3s; - display: flex; - align-items: center; - justify-content: center; - max-width: 1400px; + width: 100%; + height: 60px; + position: fixed; + right: max(0, calc((100% - 1400px) / 2)); + top: 0; + font-size: 35px; + color: var(--heo-fontcolor); + cursor: pointer; + transition: 0.3s; + display: flex; + align-items: center; + justify-content: center; + max-width: 1400px; } #console .close-btn i { - font-size: 32px; - margin-right: 1.5rem; - margin-left: auto; - transition: 0.3s; - line-height: 1; - transform: rotate(-30deg); - transition: 0.6s; + font-size: 32px; + margin-right: 1.5rem; + margin-left: auto; + transition: 0.3s; + line-height: 1; + transform: rotate(-30deg); + transition: 0.6s; } #console.show .close-btn i { - transform: rotate(0deg); + transform: rotate(0deg); } #console .close-btn i:hover { - color: var(--heo-main); - background: var(--heo-main-op); - border-radius: 32px; + color: var(--heo-main); + background: var(--heo-main-op); + border-radius: 32px; } #console .console-card.history { - margin-top: 8px; - padding: 0; - background: none; - box-shadow: none; - border: none; - overflow: hidden; + margin-top: 8px; + padding: 0; + background: none; + box-shadow: none; + border: none; + overflow: hidden; } #console .console-card.history .item-headline { - display: none; + display: none; } #console .console-card.history .card-archive-list { - display: flex; - flex-direction: row; - justify-content: space-between; - flex-wrap: wrap; - height: 164px; + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: wrap; + height: 164px; } #console .console-card.history .card-archive-list li.card-archive-list-item { - flex: 0 0 24%; + flex: 0 0 24%; } #console .console-card.history .card-archive-list .card-archive-list-link { - border-radius: 8px; - margin-top: 8px; - display: flex; - flex-direction: column; - align-content: space-between; - border: var(--style-border); - background: var(--heo-maskbgdeep); - padding: 8px 16px; + border-radius: 8px; + margin-top: 8px; + display: flex; + flex-direction: column; + align-content: space-between; + border: var(--style-border); + background: var(--heo-maskbgdeep); + padding: 8px 16px; } #console .console-card.history .card-archive-list .card-archive-list-link:hover { - background: var(--heo-main); - color: var(--heo-card-bg); + background: var(--heo-main); + color: var(--heo-card-bg); } #console #card-newest-comments { - height: 100%; + height: 100%; } #console .button-group i { - font-size: 1rem; + font-size: 1rem; } #console .console-card-group-reward .reward-all { - display: flex; - align-items: center; - justify-content: center + display: flex; + align-items: center; + justify-content: center } #console .console-card-group-reward .reward-all .reward-item { - display: flex; - flex-direction: column; - align-items: center; - margin: .625rem; + display: flex; + flex-direction: column; + align-items: center; + margin: .625rem; } @media screen and (max-width: 867px) { - #console .close-btn { - display: none - } + #console .close-btn { + display: none + } - #console .console-card-group { - display: none - } + #console .console-card-group { + display: none + } - #consoleHideAside { - display: none - } + #consoleHideAside { + display: none + } - .console-card-group-reward .reward-all .reward-item img { - width: 130px; - height: 130px - } + .console-card-group-reward .reward-all .reward-item img { + width: 130px; + height: 130px + } - #console #consoleKeyboard { - display: none - } + #console #consoleKeyboard { + display: none + } } /* 快捷键窗口 */ #keyboard-tips { - position: fixed; - top: 80px; - left: 20px; - z-index: 999; - background: var(--heo-maskbgdeep); - border-radius: 12px; - border: var(--style-border); - padding: 20px; - display: flex; - flex-direction: column; - backdrop-filter: saturate(180%) blur(20px); - -webkit-backdrop-filter: blur(20px); - pointer-events: none; - box-shadow: var(--heo-shadow-border); - opacity: 0; - transition: 0.3s; + position: fixed; + top: 80px; + left: 20px; + z-index: 999; + background: var(--heo-maskbgdeep); + border-radius: 12px; + border: var(--style-border); + padding: 20px; + display: flex; + flex-direction: column; + backdrop-filter: saturate(180%) blur(20px); + -webkit-backdrop-filter: blur(20px); + pointer-events: none; + box-shadow: var(--heo-shadow-border); + opacity: 0; + transition: 0.3s; } #keyboard-tips.show { - opacity: 1; - transition: 0.1s; + opacity: 1; + transition: 0.1s; } #keyboard-tips .keybordList { - display: flex; - flex-direction: column; - margin-top: 8px; + display: flex; + flex-direction: column; + margin-top: 8px; } #keyboard-tips .keyboardTitle { - font-size: 12px; - color: var(--heo-secondtext); - line-height: 1; + font-size: 12px; + color: var(--heo-secondtext); + line-height: 1; } #keyboard-tips .keybordItem { - display: flex; - margin-top: 4px; + display: flex; + margin-top: 4px; } #keyboard-tips .keyGroup { - display: flex; - align-items: center; - width: 90px; + display: flex; + align-items: center; + width: 90px; } #keyboard-tips .keyGroup .key { - padding: .2em .4em; - font-family: inherit; - background-color: var(--card-bg); - color: var(--heo-fontcolor); - border: var(--style-border); - border-color: var(--heo-secondtext); - border-bottom: 2px solid var(--heo-secondtext); - box-shadow: var(--heo-shadow-border); - border-radius: .25rem; - overflow-wrap: break-word; - overflow-x: auto; - font-weight: 500; - font-size: .875em; - margin-right: 4px; - vertical-align: baseline; - line-height: 1; - height: 24px; + padding: .2em .4em; + font-family: inherit; + background-color: var(--card-bg); + color: var(--heo-fontcolor); + border: var(--style-border); + border-color: var(--heo-secondtext); + border-bottom: 2px solid var(--heo-secondtext); + box-shadow: var(--heo-shadow-border); + border-radius: .25rem; + overflow-wrap: break-word; + overflow-x: auto; + font-weight: 500; + font-size: .875em; + margin-right: 4px; + vertical-align: baseline; + line-height: 1; + height: 24px; } @media screen and (min-width: 768px) { - /* 隐藏弹窗 */ - .needEndHide.hide { - bottom: -200px !important; - opacity: 0; - } + + /* 隐藏弹窗 */ + .needEndHide.hide { + bottom: -200px !important; + opacity: 0; + } } /* 订阅卡片 */ .rss-plan-list { - display: flex; - width: 100%; - flex-direction: row; - flex-wrap: wrap; - margin: 0 -4px; - position: relative + display: flex; + width: 100%; + flex-direction: row; + flex-wrap: wrap; + margin: 0 -4px; + position: relative } .rss-plan-item.rss-plan-wechat { - background: #27c125; - overflow: hidden + background: #27c125; + overflow: hidden } .rss-plan-item.rss-plan-mail { - background: var(--heo-blue) + background: var(--heo-blue) } .rss-plan-item.rss-plan-rss { - background: var(--heo-orange) + background: var(--heo-orange) } .rss-plan-item { - border-radius: 12px; - display: flex; - flex-direction: column; - justify-content: space-between; - min-width: 240px; - height: 240px; - margin: 4px auto; - overflow: hidden; - text-decoration: none; - width: calc(100% / 3 - 8px); - filter: brightness(1); - transition: .3s + border-radius: 12px; + display: flex; + flex-direction: column; + justify-content: space-between; + min-width: 240px; + height: 240px; + margin: 4px auto; + overflow: hidden; + text-decoration: none; + width: calc(100% / 3 - 8px); + filter: brightness(1); + transition: .3s } .rss-plan-item:hover { - filter: brightness(1.1) + filter: brightness(1.1) } @media screen and (max-width: 1024px) { - .rss-plan-item { - width: calc(100% / 2 - 4px) - } + .rss-plan-item { + width: calc(100% / 2 - 4px) + } - .rss-plan-item:first-child { - width: 100% - } + .rss-plan-item:first-child { + width: 100% + } } @media screen and (max-width: 768px) { - .rss-plan-item { - width: 100% - } + .rss-plan-item { + width: 100% + } } .rss-plan-item:visited { - color: var(--heo-white) + color: var(--heo-white) } .rss-plan-description { - font-size: 16px; - color: var(--heo-white); - margin: 26px 0 0 30px; - line-height: 20px + font-size: 16px; + color: var(--heo-white); + margin: 26px 0 0 30px; + line-height: 20px } img.rss-plan-icon { - position: absolute; - bottom: -50px; - right: -20px; - height: 140px; - user-select: none; - -webkit-user-drag: none; - transition: all 1.2s cubic-bezier(.39, .575, .565, 1); - transform-origin: bottom right; - filter: blur(8px); - opacity: .6 + position: absolute; + bottom: -50px; + right: -20px; + height: 140px; + user-select: none; + -webkit-user-drag: none; + transition: all 1.2s cubic-bezier(.39, .575, .565, 1); + transform-origin: bottom right; + filter: blur(8px); + opacity: .6 } .rss-plan-item:hover img.rss-plan-icon { - bottom: -40px; - right: -10px; - filter: blur(0); - opacity: 1 + bottom: -40px; + right: -10px; + filter: blur(0); + opacity: 1 } .rss-plan-info-group { - position: relative; - margin: 0 0 26px 30px; - color: var(--heo-white) + position: relative; + margin: 0 0 26px 30px; + color: var(--heo-white) } .rss-plan-title { - font-size: 36px; - font-weight: 700; - width: fit-content; - line-height: 1 + font-size: 36px; + font-weight: 700; + width: fit-content; + line-height: 1 } .rss-plan-info { - width: fit-content; - opacity: .6 + width: fit-content; + opacity: .6 } #article-container a:not(.fancybox).rss-plan-item:hover { - text-decoration: none; - border-bottom: 0px; - color: rgb(48 122 246 / 0%); - box-shadow: 0 8px 12px -3px var(--heo-background); - border-radius: 12px; + text-decoration: none; + border-bottom: 0px; + color: rgb(48 122 246 / 0%); + box-shadow: 0 8px 12px -3px var(--heo-background); + border-radius: 12px; } #article-container a:not(.fancybox).rss-plan-item.rss-plan-wechat:hover { - background: #27c125; + background: #27c125; } #article-container a:not(.fancybox).rss-plan-item.rss-plan-rss:hover { - background: var(--heo-orange); + background: var(--heo-orange); } #article-container a:not(.fancybox).rss-plan-item.rss-plan-mail:hover { - background: var(--heo-blue); + background: var(--heo-blue); } #article-container a.rss-plan-item { - font-weight: 400; - text-decoration: none; - border-bottom: 0px; - padding: 0px; - border-radius: 12px; - color: rgb(48 122 246 / 0%); + font-weight: 400; + text-decoration: none; + border-bottom: 0px; + padding: 0px; + border-radius: 12px; + color: rgb(48 122 246 / 0%); } /* 分页搜索框 */ .pagination input { - width: 40px; - height: 40px; - border-radius: 8px; - border: var(--style-border-always); - transition: .3s; - outline-style: none; - font-size: 16px; - padding-left: 12px; - background: var(--heo-secondbg); - color: var(--heo-fontcolor) + width: 40px; + height: 40px; + border-radius: 8px; + border: var(--style-border-always); + transition: .3s; + outline-style: none; + font-size: 16px; + padding-left: 12px; + background: var(--heo-secondbg); + color: var(--heo-fontcolor) } -.pagination .toPageGroup input:focus, .pagination .toPageGroup:hover input { - border: var(--style-border-hover-always); - outline-style: none; - width: 100px +.pagination .toPageGroup input:focus, +.pagination .toPageGroup:hover input { + border: var(--style-border-hover-always); + outline-style: none; + width: 100px } .toPageGroup { - display: flex; - position: relative; - margin: 0 .3rem + display: flex; + position: relative; + margin: 0 .3rem } a#toPageButton { - display: flex; - position: absolute; - width: 40px; - height: 40px; - right: 0; - top: 0; - border-radius: 8px; - justify-content: center; - align-items: center; - transition: .3s; - background: var(--heo-card-bg); - border: var(--style-border-always); - cursor: text; - pointer-events: none + display: flex; + position: absolute; + width: 40px; + height: 40px; + right: 0; + top: 0; + border-radius: 8px; + justify-content: center; + align-items: center; + transition: .3s; + background: var(--heo-card-bg); + border: var(--style-border-always); + cursor: text; + pointer-events: none } -.toPageGroup:focus-within a#toPageButton, .toPageGroup:hover a#toPageButton { - width: 30px; - height: 30px; - right: 4px; - top: 5px; - background: var(--heo-card-bg); - border: 1px solid var(--heo-none); - border-radius: 4px; - opacity: .2 +.toPageGroup:focus-within a#toPageButton, +.toPageGroup:hover a#toPageButton { + width: 30px; + height: 30px; + right: 4px; + top: 5px; + background: var(--heo-card-bg); + border: 1px solid var(--heo-none); + border-radius: 4px; + opacity: .2 } .toPageGroup:focus-within a#toPageButton.haveValue { - opacity: 1; - cursor: pointer + opacity: 1; + cursor: pointer } a#toPageButton.haveValue { - opacity: 1 !important; - cursor: pointer !important; - pointer-events: all + opacity: 1 !important; + cursor: pointer !important; + pointer-events: all } a#toPageButton.haveValue:hover { - background: var(--heo-theme); - color: var(--heo-white) + background: var(--heo-theme); + color: var(--heo-white) } @media screen and (max-width: 768px) { - .toPageGroup { - display: none - } + .toPageGroup { + display: none + } } /* code样式 */ code:not([class]) { - color: var(--heo-white); - padding: 0.25rem 0.4rem; - border-radius: 4px; - margin: 0px 4px; - background: var(--heo-pink); - line-height: 2; - box-shadow: var(--heo-shadow-border); - font-size: 17.5px; - font-family: consolas, Menlo, "PingFang SC", "Microsoft YaHei", sans-serif !important; + color: var(--heo-white); + padding: 0.25rem 0.4rem; + border-radius: 4px; + margin: 0px 4px; + background: var(--heo-pink); + line-height: 2; + box-shadow: var(--heo-shadow-border); + font-size: 17.5px; + font-family: consolas, Menlo, "PingFang SC", "Microsoft YaHei", sans-serif !important; } /* 导航栏中间返回顶部样式 */ #page-header.nav-fixed #nav #page-name-text { - display: inline; - opacity: 1; - transition: 0.3s; - line-height: 1.6; + display: inline; + opacity: 1; + transition: 0.3s; + line-height: 1.6; } .nav-fixed #nav #page-name-text:hover { - background: var(--heo-main); - transition: 0.3s; - border-radius: 50px; - padding: 4px 8px; + background: var(--heo-main); + transition: 0.3s; + border-radius: 50px; + padding: 4px 8px; } @media screen and (min-width: 900px) { - #page-header.nav-fixed #nav #page-name-text::after { - opacity: 0; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - content: "回到顶部"; - -webkit-transition: 0.2s; - -moz-transition: 0.2s; - -o-transition: 0.2s; - -ms-transition: 0.2s; - transition: 0.2s; - position: absolute; - left: 0; - right: 0; - top: 48%; - -webkit-transform: translateY(-50%); - -moz-transform: translateY(-50%); - -o-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); - margin: auto; - color: #fff; - font-weight: 700; - line-height: 2; - font-size: 17px; - } + #page-header.nav-fixed #nav #page-name-text::after { + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + -webkit-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); + transform: scale(1); + content: "回到顶部"; + -webkit-transition: 0.2s; + -moz-transition: 0.2s; + -o-transition: 0.2s; + -ms-transition: 0.2s; + transition: 0.2s; + position: absolute; + left: 0; + right: 0; + top: 48%; + -webkit-transform: translateY(-50%); + -moz-transform: translateY(-50%); + -o-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); + margin: auto; + color: #fff; + font-weight: 700; + line-height: 2; + font-size: 17px; + } } /* 导航栏中间样式 */ -#menus > div.menus_items a { - font-size: 16.8px; - font-weight: 700; +#menus>div.menus_items a { + font-size: 16.8px; + font-weight: 700; } #nav .menus_items .menus_item .menus_item_child { - padding: 2px 2px 4px 2px; - border-radius: 55px; + padding: 2px 2px 4px 2px; + border-radius: 55px; } -#nav .menus_items .menus_item .menus_item_child > .recursion_menus_item:hover > a { - padding: 0.2rem 0.5rem; +#nav .menus_items .menus_item .menus_item_child>.recursion_menus_item:hover>a { + padding: 0.2rem 0.5rem; } .postcarnepre { - width: 100%; + width: 100%; } .compensate-for-scrollbar { - margin-right: 0 !important + margin-right: 0 !important } body.compensate-for-scrollbar { - overflow: hidden + overflow: hidden } .fancybox-active { - height: auto + height: auto } .fancybox-is-hidden { - left: -9999px; - margin: 0; - position: absolute !important; - top: -9999px; - visibility: hidden + left: -9999px; + margin: 0; + position: absolute !important; + top: -9999px; + visibility: hidden } .fancybox-container { - -webkit-backface-visibility: hidden; - height: 100vh; - left: 0; - outline: 0; - position: fixed; - -webkit-tap-highlight-color: transparent; - top: 0; - -ms-touch-action: manipulation; - touch-action: manipulation; - transform: translateZ(0); - width: 100vw; - z-index: 99992 + -webkit-backface-visibility: hidden; + height: 100vh; + left: 0; + outline: 0; + position: fixed; + -webkit-tap-highlight-color: transparent; + top: 0; + -ms-touch-action: manipulation; + touch-action: manipulation; + transform: translateZ(0); + width: 100vw; + z-index: 99992 } .fancybox-container * { - box-sizing: border-box + box-sizing: border-box } -.fancybox-bg, .fancybox-inner, .fancybox-outer, .fancybox-stage { - bottom: 0; - left: 0; - position: absolute; - right: 0; - top: 0 +.fancybox-bg, +.fancybox-inner, +.fancybox-outer, +.fancybox-stage { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0 } .fancybox-outer { - -webkit-overflow-scrolling: touch; - overflow-y: auto + -webkit-overflow-scrolling: touch; + overflow-y: auto } .fancybox-bg { - background: var(--heo-card-bg); - opacity: 0; - transition-duration: inherit; - transition-property: opacity; - transition-timing-function: cubic-bezier(.47, 0, .74, .71) + background: var(--heo-card-bg); + opacity: 0; + transition-duration: inherit; + transition-property: opacity; + transition-timing-function: cubic-bezier(.47, 0, .74, .71) } .fancybox-is-open .fancybox-bg { - opacity: 1; - transition-timing-function: cubic-bezier(.22, .61, .36, 1) + opacity: 1; + transition-timing-function: cubic-bezier(.22, .61, .36, 1) } -.fancybox-caption, .fancybox-infobar, .fancybox-navigation .fancybox-button, .fancybox-toolbar { - direction: ltr; - opacity: 0; - position: absolute; - transition: opacity .25s ease, visibility 0s ease .25s; - visibility: hidden; - z-index: 99997 +.fancybox-caption, +.fancybox-infobar, +.fancybox-navigation .fancybox-button, +.fancybox-toolbar { + direction: ltr; + opacity: 0; + position: absolute; + transition: opacity .25s ease, visibility 0s ease .25s; + visibility: hidden; + z-index: 99997 } -.fancybox-show-caption .fancybox-caption, .fancybox-show-infobar .fancybox-infobar, .fancybox-show-nav .fancybox-navigation .fancybox-button, .fancybox-show-toolbar .fancybox-toolbar { - opacity: 1; - transition: opacity .25s ease 0s, visibility 0s ease 0s, background-color .3s ease 0s; - visibility: visible +.fancybox-show-caption .fancybox-caption, +.fancybox-show-infobar .fancybox-infobar, +.fancybox-show-nav .fancybox-navigation .fancybox-button, +.fancybox-show-toolbar .fancybox-toolbar { + opacity: 1; + transition: opacity .25s ease 0s, visibility 0s ease 0s, background-color .3s ease 0s; + visibility: visible } .fancybox-infobar { - color: var(--heo-secondtext); - font-size: 13px; - -webkit-font-smoothing: subpixel-antialiased; - height: 44px; - left: 0; - line-height: 44px; - min-width: 44px; - mix-blend-mode: difference; - padding: 0 10px; - pointer-events: none; - top: 0; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none + color: var(--heo-secondtext); + font-size: 13px; + -webkit-font-smoothing: subpixel-antialiased; + height: 44px; + left: 0; + line-height: 44px; + min-width: 44px; + mix-blend-mode: difference; + padding: 0 10px; + pointer-events: none; + top: 0; + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none } .fancybox-toolbar { - right: 8px; - top: 8px + right: 8px; + top: 8px } .fancybox-stage { - direction: ltr; - overflow: visible; - transform: translateZ(0); - z-index: 99994 + direction: ltr; + overflow: visible; + transform: translateZ(0); + z-index: 99994 } .fancybox-is-open .fancybox-stage { - overflow: hidden + overflow: hidden } .fancybox-slide { - -webkit-backface-visibility: hidden; - display: none; - height: 100%; - left: 0; - outline: 0; - overflow: auto; - -webkit-overflow-scrolling: touch; - padding: 44px; - position: absolute; - text-align: center; - top: 0; - transition-property: transform, opacity; - white-space: normal; - width: 100%; - z-index: 99994 + -webkit-backface-visibility: hidden; + display: none; + height: 100%; + left: 0; + outline: 0; + overflow: auto; + -webkit-overflow-scrolling: touch; + padding: 44px; + position: absolute; + text-align: center; + top: 0; + transition-property: transform, opacity; + white-space: normal; + width: 100%; + z-index: 99994 } .fancybox-slide:before { - content: ""; - display: inline-block; - font-size: 0; - height: 100%; - vertical-align: middle; - width: 0 + content: ""; + display: inline-block; + font-size: 0; + height: 100%; + vertical-align: middle; + width: 0 } -.fancybox-is-sliding .fancybox-slide, .fancybox-slide--current, .fancybox-slide--next, .fancybox-slide--previous { - display: block +.fancybox-is-sliding .fancybox-slide, +.fancybox-slide--current, +.fancybox-slide--next, +.fancybox-slide--previous { + display: block } .fancybox-slide--image { - overflow: hidden; - padding: 44px 0 + overflow: hidden; + padding: 44px 0 } .fancybox-slide--image:before { - display: none + display: none } .fancybox-slide--html { - padding: 6px + padding: 6px } .fancybox-content { - background: #fff; - display: inline-block; - margin: 0; - max-width: 100%; - overflow: auto; - -webkit-overflow-scrolling: touch; - padding: 44px; - position: relative; - text-align: left; - vertical-align: middle + background: #fff; + display: inline-block; + margin: 0; + max-width: 100%; + overflow: auto; + -webkit-overflow-scrolling: touch; + padding: 44px; + position: relative; + text-align: left; + vertical-align: middle } .fancybox-slide--image .fancybox-content { - animation-timing-function: cubic-bezier(.5, 0, .14, 1); - -webkit-backface-visibility: hidden; - background: 0 0; - background-repeat: no-repeat; - background-size: 100% 100%; - left: 0; - max-width: none; - overflow: hidden; - padding: 0; - position: absolute; - top: 0; - transform-origin: top left; - transition-property: transform, opacity; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - z-index: 99995; - border-radius: 12px + animation-timing-function: cubic-bezier(.5, 0, .14, 1); + -webkit-backface-visibility: hidden; + background: 0 0; + background-repeat: no-repeat; + background-size: 100% 100%; + left: 0; + max-width: none; + overflow: hidden; + padding: 0; + position: absolute; + top: 0; + transform-origin: top left; + transition-property: transform, opacity; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + z-index: 99995; + border-radius: 12px } .fancybox-can-zoomOut .fancybox-content { - cursor: zoom-out + cursor: zoom-out } .fancybox-can-zoomIn .fancybox-content { - cursor: zoom-in + cursor: zoom-in } -.fancybox-can-pan .fancybox-content, .fancybox-can-swipe .fancybox-content { - cursor: grab +.fancybox-can-pan .fancybox-content, +.fancybox-can-swipe .fancybox-content { + cursor: grab } .fancybox-is-grabbing .fancybox-content { - cursor: grabbing + cursor: grabbing } .fancybox-container [data-selectable=true] { - cursor: text + cursor: text } -.fancybox-image, .fancybox-spaceball { - background: 0 0; - border: 0; - height: 100%; - left: 0; - margin: 0; - max-height: none; - max-width: none; - padding: 0; - position: absolute; - top: 0; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - width: 100% +.fancybox-image, +.fancybox-spaceball { + background: 0 0; + border: 0; + height: 100%; + left: 0; + margin: 0; + max-height: none; + max-width: none; + padding: 0; + position: absolute; + top: 0; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + width: 100% } .C { - z-index: 1 + z-index: 1 } -.fancybox-slide--iframe .fancybox-content, .fancybox-slide--map .fancybox-content, .fancybox-slide--pdf .fancybox-content, .fancybox-slide--video .fancybox-content { - height: 100%; - overflow: visible; - padding: 0; - width: 100% +.fancybox-slide--iframe .fancybox-content, +.fancybox-slide--map .fancybox-content, +.fancybox-slide--pdf .fancybox-content, +.fancybox-slide--video .fancybox-content { + height: 100%; + overflow: visible; + padding: 0; + width: 100% } .fancybox-slide--video .fancybox-content { - background: #000 + background: #000 } .fancybox-slide--map .fancybox-content { - background: #e5e3df + background: #e5e3df } .fancybox-slide--iframe .fancybox-content { - background: #fff + background: #fff } -.fancybox-iframe, .fancybox-video { - background: 0 0; - border: 0; - display: block; - height: 100%; - margin: 0; - overflow: hidden; - padding: 0; - width: 100% +.fancybox-iframe, +.fancybox-video { + background: 0 0; + border: 0; + display: block; + height: 100%; + margin: 0; + overflow: hidden; + padding: 0; + width: 100% } .fancybox-iframe { - left: 0; - position: absolute; - top: 0 + left: 0; + position: absolute; + top: 0 } .fancybox-error { - background: #fff; - cursor: default; - max-width: 400px; - padding: 40px; - width: 100% + background: #fff; + cursor: default; + max-width: 400px; + padding: 40px; + width: 100% } .fancybox-error p { - color: #444; - font-size: 16px; - line-height: 20px; - margin: 0; - padding: 0 + color: #444; + font-size: 16px; + line-height: 20px; + margin: 0; + padding: 0 } .fancybox-button { - background: var(--heo-secondbg); - border: 0; - border-radius: 12px; - box-shadow: none; - cursor: pointer; - display: inline-block; - height: 44px; - margin: 0; - padding: 10px; - position: relative; - transition: color .2s; - vertical-align: top; - visibility: inherit; - width: 44px; - margin: 0 4px; - transition: .3s + background: var(--heo-secondbg); + border: 0; + border-radius: 12px; + box-shadow: none; + cursor: pointer; + display: inline-block; + height: 44px; + margin: 0; + padding: 10px; + position: relative; + transition: color .2s; + vertical-align: top; + visibility: inherit; + width: 44px; + margin: 0 4px; + transition: .3s } -.fancybox-button, .fancybox-button:link, .fancybox-button:visited { - color: #ccc +.fancybox-button, +.fancybox-button:link, +.fancybox-button:visited { + color: #ccc } .fancybox-button:hover { - background: var(--heo-lighttext); - color: var(--heo-card-bg) + background: var(--heo-lighttext); + color: var(--heo-card-bg) } .fancybox-button:focus { - outline: 0 + outline: 0 } .fancybox-button.fancybox-focus { - outline: 1px dotted + outline: 1px dotted } -.fancybox-button[disabled], .fancybox-button[disabled]:hover { - color: #888; - cursor: default; - outline: 0 +.fancybox-button[disabled], +.fancybox-button[disabled]:hover { + color: #888; + cursor: default; + outline: 0 } .fancybox-button div { - height: 100% + height: 100% } .fancybox-button svg { - display: block; - height: 100%; - overflow: visible; - position: relative; - width: 100% + display: block; + height: 100%; + overflow: visible; + position: relative; + width: 100% } .fancybox-button svg path { - fill: currentColor; - stroke-width: 0 + fill: currentColor; + stroke-width: 0 } -.fancybox-button--fsenter svg:nth-child(2), .fancybox-button--fsexit svg:first-child, .fancybox-button--pause svg:first-child, .fancybox-button--play svg:nth-child(2) { - display: none +.fancybox-button--fsenter svg:nth-child(2), +.fancybox-button--fsexit svg:first-child, +.fancybox-button--pause svg:first-child, +.fancybox-button--play svg:nth-child(2) { + display: none } .fancybox-progress { - background: #ff5268; - height: 2px; - left: 0; - position: absolute; - right: 0; - top: 0; - transform: scaleX(0); - transform-origin: 0; - transition-property: transform; - transition-timing-function: linear; - z-index: 99998 + background: #ff5268; + height: 2px; + left: 0; + position: absolute; + right: 0; + top: 0; + transform: scaleX(0); + transform-origin: 0; + transition-property: transform; + transition-timing-function: linear; + z-index: 99998 } .fancybox-close-small { - background: 0 0; - border: 0; - border-radius: 0; - color: #ccc; - cursor: pointer; - opacity: .8; - padding: 8px; - position: absolute; - right: -12px; - top: -44px; - z-index: 401 + background: 0 0; + border: 0; + border-radius: 0; + color: #ccc; + cursor: pointer; + opacity: .8; + padding: 8px; + position: absolute; + right: -12px; + top: -44px; + z-index: 401 } .fancybox-close-small:hover { - color: #fff; - opacity: 1 + color: #fff; + opacity: 1 } .fancybox-slide--html .fancybox-close-small { - color: currentColor; - padding: 10px; - right: 0; - top: 0 + color: currentColor; + padding: 10px; + right: 0; + top: 0 } .fancybox-slide--image.fancybox-is-scaling .fancybox-content { - overflow: hidden + overflow: hidden } -.fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small { - display: none +.fancybox-is-scaling .fancybox-close-small, +.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small { + display: none } .fancybox-navigation .fancybox-button { - height: 44px; - opacity: 0; - position: absolute; - top: calc(50% - 50px); - width: 44px; - margin: 8px; - border-radius: 12px; - overflow: hidden + height: 44px; + opacity: 0; + position: absolute; + top: calc(50% - 50px); + width: 44px; + margin: 8px; + border-radius: 12px; + overflow: hidden } .fancybox-navigation .fancybox-button--arrow_left { - left: 0; - left: env(safe-area-inset-left) + left: 0; + left: env(safe-area-inset-left) } .fancybox-navigation .fancybox-button--arrow_right { - right: 0; - right: env(safe-area-inset-right) + right: 0; + right: env(safe-area-inset-right) } .fancybox-caption { - bottom: 0; - color: var(--heo-fontcolor); - font-size: 14px; - font-weight: 400; - left: 0; - line-height: 1.5; - padding: 75px 44px 25px; - pointer-events: none; - right: 0; - text-align: center; - z-index: 99996 + bottom: 0; + color: var(--heo-fontcolor); + font-size: 14px; + font-weight: 400; + left: 0; + line-height: 1.5; + padding: 75px 44px 25px; + pointer-events: none; + right: 0; + text-align: center; + z-index: 99996 } @supports (padding: max(0px)) { - .fancybox-caption { - padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left)) - } + .fancybox-caption { + padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left)) + } } .fancybox-caption--separate { - margin-top: -50px + margin-top: -50px } .fancybox-caption__body { - max-height: 50vh; - overflow: auto; - pointer-events: all + max-height: 50vh; + overflow: auto; + pointer-events: all } -.fancybox-caption a, .fancybox-caption a:link, .fancybox-caption a:visited { - color: #ccc; - text-decoration: none +.fancybox-caption a, +.fancybox-caption a:link, +.fancybox-caption a:visited { + color: #ccc; + text-decoration: none } .fancybox-caption a:hover { - color: #fff; - text-decoration: underline + color: #fff; + text-decoration: underline } .fancybox-loading { - animation: a 1s linear infinite; - background: 0 0; - border: 4px solid #888; - border-bottom-color: #fff; - border-radius: 50%; - height: 50px; - left: 50%; - margin: -25px 0 0 -25px; - opacity: .7; - padding: 0; - position: absolute; - top: 50%; - width: 50px; - z-index: 99999 + animation: a 1s linear infinite; + background: 0 0; + border: 4px solid #888; + border-bottom-color: #fff; + border-radius: 50%; + height: 50px; + left: 50%; + margin: -25px 0 0 -25px; + opacity: .7; + padding: 0; + position: absolute; + top: 50%; + width: 50px; + z-index: 99999 } @keyframes a { - to { - transform: rotate(1turn) - } + to { + transform: rotate(1turn) + } } .fancybox-animated { - transition-timing-function: cubic-bezier(0, 0, .25, 1) + transition-timing-function: cubic-bezier(0, 0, .25, 1) } .fancybox-fx-slide.fancybox-slide--previous { - opacity: 0; - transform: translate3d(-100%, 0, 0) + opacity: 0; + transform: translate3d(-100%, 0, 0) } .fancybox-fx-slide.fancybox-slide--next { - opacity: 0; - transform: translate3d(100%, 0, 0) + opacity: 0; + transform: translate3d(100%, 0, 0) } .fancybox-fx-slide.fancybox-slide--current { - opacity: 1; - transform: translateZ(0) + opacity: 1; + transform: translateZ(0) } -.fancybox-fx-fade.fancybox-slide--next, .fancybox-fx-fade.fancybox-slide--previous { - opacity: 0; - transition-timing-function: cubic-bezier(.19, 1, .22, 1) +.fancybox-fx-fade.fancybox-slide--next, +.fancybox-fx-fade.fancybox-slide--previous { + opacity: 0; + transition-timing-function: cubic-bezier(.19, 1, .22, 1) } .fancybox-fx-fade.fancybox-slide--current { - opacity: 1 + opacity: 1 } .fancybox-fx-zoom-in-out.fancybox-slide--previous { - opacity: 0; - transform: scale3d(1.5, 1.5, 1.5) + opacity: 0; + transform: scale3d(1.5, 1.5, 1.5) } .fancybox-fx-zoom-in-out.fancybox-slide--next { - opacity: 0; - transform: scale3d(.5, .5, .5) + opacity: 0; + transform: scale3d(.5, .5, .5) } .fancybox-fx-zoom-in-out.fancybox-slide--current { - opacity: 1; - transform: scaleX(1) + opacity: 1; + transform: scaleX(1) } .fancybox-fx-rotate.fancybox-slide--previous { - opacity: 0; - transform: rotate(-1turn) + opacity: 0; + transform: rotate(-1turn) } .fancybox-fx-rotate.fancybox-slide--next { - opacity: 0; - transform: rotate(1turn) + opacity: 0; + transform: rotate(1turn) } .fancybox-fx-rotate.fancybox-slide--current { - opacity: 1; - transform: rotate(0) + opacity: 1; + transform: rotate(0) } .fancybox-fx-circular.fancybox-slide--previous { - opacity: 0; - transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0) + opacity: 0; + transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0) } .fancybox-fx-circular.fancybox-slide--next { - opacity: 0; - transform: scale3d(0, 0, 0) translate3d(100%, 0, 0) + opacity: 0; + transform: scale3d(0, 0, 0) translate3d(100%, 0, 0) } .fancybox-fx-circular.fancybox-slide--current { - opacity: 1; - transform: scaleX(1) translateZ(0) + opacity: 1; + transform: scaleX(1) translateZ(0) } .fancybox-fx-tube.fancybox-slide--previous { - transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg) + transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg) } .fancybox-fx-tube.fancybox-slide--next { - transform: translate3d(100%, 0, 0) scale(.1) skew(10deg) + transform: translate3d(100%, 0, 0) scale(.1) skew(10deg) } .fancybox-fx-tube.fancybox-slide--current { - transform: translateZ(0) scale(1) + transform: translateZ(0) scale(1) } @media (max-height: 576px) { - .fancybox-slide { - padding-left: 6px; - padding-right: 6px - } + .fancybox-slide { + padding-left: 6px; + padding-right: 6px + } - .fancybox-slide--image { - padding: 6px 0 - } + .fancybox-slide--image { + padding: 6px 0 + } - .fancybox-close-small { - right: -6px - } + .fancybox-close-small { + right: -6px + } - .fancybox-slide--image .fancybox-close-small { - background: #4e4e4e; - color: #f2f4f6; - height: 36px; - opacity: 1; - padding: 6px; - right: 0; - top: 0; - width: 36px - } + .fancybox-slide--image .fancybox-close-small { + background: #4e4e4e; + color: #f2f4f6; + height: 36px; + opacity: 1; + padding: 6px; + right: 0; + top: 0; + width: 36px + } - .fancybox-caption { - padding-left: 12px; - padding-right: 12px - } + .fancybox-caption { + padding-left: 12px; + padding-right: 12px + } - @supports (padding: max(0px)) { - .fancybox-caption { - padding-left: max(12px, env(safe-area-inset-left)); - padding-right: max(12px, env(safe-area-inset-right)) - } - } + @supports (padding: max(0px)) { + .fancybox-caption { + padding-left: max(12px, env(safe-area-inset-left)); + padding-right: max(12px, env(safe-area-inset-right)) + } + } } .fancybox-share { - background: #f4f4f4; - border-radius: 3px; - max-width: 90%; - padding: 30px; - text-align: center + background: #f4f4f4; + border-radius: 3px; + max-width: 90%; + padding: 30px; + text-align: center } .fancybox-share h1 { - color: #222; - font-size: 35px; - font-weight: 700; - margin: 0 0 20px + color: #222; + font-size: 35px; + font-weight: 700; + margin: 0 0 20px } .fancybox-share p { - margin: 0; - padding: 0 + margin: 0; + padding: 0 } .fancybox-share__button { - border: 0; - border-radius: 3px; - display: inline-block; - font-size: 14px; - font-weight: 700; - line-height: 40px; - margin: 0 5px 10px; - min-width: 130px; - padding: 0 15px; - text-decoration: none; - transition: all .2s; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - white-space: nowrap + border: 0; + border-radius: 3px; + display: inline-block; + font-size: 14px; + font-weight: 700; + line-height: 40px; + margin: 0 5px 10px; + min-width: 130px; + padding: 0 15px; + text-decoration: none; + transition: all .2s; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + white-space: nowrap } -.fancybox-share__button:link, .fancybox-share__button:visited { - color: #fff +.fancybox-share__button:link, +.fancybox-share__button:visited { + color: #fff } .fancybox-share__button:hover { - text-decoration: none + text-decoration: none } .fancybox-share__button--fb { - background: #3b5998 + background: #3b5998 } .fancybox-share__button--fb:hover { - background: #344e86 + background: #344e86 } .fancybox-share__button--pt { - background: #bd081d + background: #bd081d } .fancybox-share__button--pt:hover { - background: #aa0719 + background: #aa0719 } .fancybox-share__button--tw { - background: #1da1f2 + background: #1da1f2 } .fancybox-share__button--tw:hover { - background: #0d95e8 + background: #0d95e8 } .fancybox-share__button svg { - height: 25px; - margin-right: 7px; - position: relative; - top: -1px; - vertical-align: middle; - width: 25px + height: 25px; + margin-right: 7px; + position: relative; + top: -1px; + vertical-align: middle; + width: 25px } .fancybox-share__button svg path { - fill: #fff + fill: #fff } .fancybox-share__input { - background: 0 0; - border: 0; - border-bottom: 1px solid #d7d7d7; - border-radius: 0; - color: #5d5b5b; - font-size: 14px; - margin: 10px 0 0; - outline: 0; - padding: 10px 15px; - width: 100% + background: 0 0; + border: 0; + border-bottom: 1px solid #d7d7d7; + border-radius: 0; + color: #5d5b5b; + font-size: 14px; + margin: 10px 0 0; + outline: 0; + padding: 10px 15px; + width: 100% } .fancybox-thumbs { - background: #ddd; - bottom: 0; - display: none; - margin: 0; - -webkit-overflow-scrolling: touch; - -ms-overflow-style: -ms-autohiding-scrollbar; - padding: 2px 2px 4px; - position: absolute; - right: 0; - -webkit-tap-highlight-color: transparent; - top: 0; - width: 212px; - z-index: 99995 + background: #ddd; + bottom: 0; + display: none; + margin: 0; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + padding: 2px 2px 4px; + position: absolute; + right: 0; + -webkit-tap-highlight-color: transparent; + top: 0; + width: 212px; + z-index: 99995 } .fancybox-thumbs-x { - overflow-x: auto; - overflow-y: hidden + overflow-x: auto; + overflow-y: hidden } .fancybox-show-thumbs .fancybox-thumbs { - display: block + display: block } .fancybox-show-thumbs .fancybox-inner { - right: 212px + right: 212px } .fancybox-thumbs__list { - font-size: 0; - height: 100%; - list-style: none; - margin: 0; - overflow-x: hidden; - overflow-y: auto; - padding: 0; - position: absolute; - position: relative; - white-space: nowrap; - width: 100% + font-size: 0; + height: 100%; + list-style: none; + margin: 0; + overflow-x: hidden; + overflow-y: auto; + padding: 0; + position: absolute; + position: relative; + white-space: nowrap; + width: 100% } .fancybox-thumbs-x .fancybox-thumbs__list { - overflow: hidden + overflow: hidden } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar { - width: 7px + width: 7px } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track { - background: #fff; - border-radius: 10px; - box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + background: #fff; + border-radius: 10px; + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb { - background: #2a2a2a; - border-radius: 10px + background: #2a2a2a; + border-radius: 10px } .fancybox-thumbs__list a { - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - background-color: rgba(0, 0, 0, .1); - background-position: 50%; - background-repeat: no-repeat; - background-size: cover; - cursor: pointer; - float: left; - height: 75px; - margin: 2px; - max-height: calc(100% - 8px); - max-width: calc(50% - 4px); - outline: 0; - overflow: hidden; - padding: 0; - position: relative; - -webkit-tap-highlight-color: transparent; - width: 100px + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + background-color: rgba(0, 0, 0, .1); + background-position: 50%; + background-repeat: no-repeat; + background-size: cover; + cursor: pointer; + float: left; + height: 75px; + margin: 2px; + max-height: calc(100% - 8px); + max-width: calc(50% - 4px); + outline: 0; + overflow: hidden; + padding: 0; + position: relative; + -webkit-tap-highlight-color: transparent; + width: 100px } .fancybox-thumbs__list a:before { - border: 6px solid #ff5268; - bottom: 0; - content: ""; - left: 0; - opacity: 0; - position: absolute; - right: 0; - top: 0; - transition: all .2s cubic-bezier(.25, .46, .45, .94); - z-index: 99991 + border: 6px solid #ff5268; + bottom: 0; + content: ""; + left: 0; + opacity: 0; + position: absolute; + right: 0; + top: 0; + transition: all .2s cubic-bezier(.25, .46, .45, .94); + z-index: 99991 } .fancybox-thumbs__list a:focus:before { - opacity: .5 + opacity: .5 } .fancybox-thumbs__list a.fancybox-thumbs-active:before { - opacity: 1 + opacity: 1 } @media (max-width: 576px) { - .fancybox-thumbs { - width: 110px - } + .fancybox-thumbs { + width: 110px + } - .fancybox-show-thumbs .fancybox-inner { - right: 110px - } + .fancybox-show-thumbs .fancybox-inner { + right: 110px + } - .fancybox-thumbs__list a { - max-width: calc(100% - 10px) - } + .fancybox-thumbs__list a { + max-width: calc(100% - 10px) + } } .collect h2 { - margin-bottom: 0 + margin-bottom: 0 } .collect .collect-desc { - margin-bottom: 10px + margin-bottom: 10px } .collect .collect-list { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - gap: 18px; - -webkit-box-lines: multiple; - -moz-box-lines: multiple; - -o-box-lines: multiple; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin: 1rem 0px 0.7rem; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + gap: 18px; + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -o-box-lines: multiple; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin: 1rem 0px 0.7rem; } .collect .collect-list .collect_box { - --w: calc(100% / 6 - 15px); - width: var(--w); - aspect-ratio: 3/4; - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-pack: justify; - -moz-box-pack: justify; - -o-box-pack: justify; - -ms-flex-pack: justify; - -webkit-justify-content: space-between; - justify-content: space-between; - -webkit-box-orient: vertical; - -moz-box-orient: vertical; - -o-box-orient: vertical; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - background-position: center; - background-size: cover; - border-radius: 12px; - border: var(--style-border-always); - -webkit-box-shadow: var(--heo-shadow-border); - box-shadow: var(--heo-shadow-border); - position: relative; - overflow: hidden; - padding: 10px; - color: #fff; - -webkit-transition: .5s; - -moz-transition: .5s; - -o-transition: .5s; - -ms-transition: .5s; - transition: .5s + --w: calc(100% / 6 - 15px); + width: var(--w); + aspect-ratio: 3/4; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + -webkit-box-pack: justify; + -moz-box-pack: justify; + -o-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -o-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + background-position: center; + background-size: cover; + border-radius: 12px; + border: var(--style-border-always); + -webkit-box-shadow: var(--heo-shadow-border); + box-shadow: var(--heo-shadow-border); + position: relative; + overflow: hidden; + padding: 10px; + color: #fff; + -webkit-transition: .5s; + -moz-transition: .5s; + -o-transition: .5s; + -ms-transition: .5s; + transition: .5s } .collect .collect-list .collect_box::after { - content: ''; - position: absolute; - height: 100%; - width: 100%; - left: 0; - top: 0; - background: rgba(0,0,0,.3); - z-index: 0; - -webkit-transition: .5s; - -moz-transition: .5s; - -o-transition: .5s; - -ms-transition: .5s; - transition: .5s + content: ''; + position: absolute; + height: 100%; + width: 100%; + left: 0; + top: 0; + background: rgba(0, 0, 0, .3); + z-index: 0; + -webkit-transition: .5s; + -moz-transition: .5s; + -o-transition: .5s; + -ms-transition: .5s; + transition: .5s } .collect .collect-list .collect_box:hover { - -webkit-transform: translateY(-10px); - -moz-transform: translateY(-10px); - -o-transform: translateY(-10px); - -ms-transform: translateY(-10px); - transform: translateY(-10px) + -webkit-transform: translateY(-10px); + -moz-transform: translateY(-10px); + -o-transform: translateY(-10px); + -ms-transform: translateY(-10px); + transform: translateY(-10px) } .collect .collect-list .collect_box:hover::after { - background: rgba(0,0,0,.1) + background: rgba(0, 0, 0, .1) } .collect .collect-list .collect_box .collect_top { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - z-index: 1; - -webkit-box-align: center; - -moz-box-align: center; - -o-box-align: center; - -ms-flex-align: center; - -webkit-align-items: center; - align-items: center; - -webkit-box-pack: justify; - -moz-box-pack: justify; - -o-box-pack: justify; - -ms-flex-pack: justify; - -webkit-justify-content: space-between; - justify-content: space-between + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex; + z-index: 1; + -webkit-box-align: center; + -moz-box-align: center; + -o-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-box-pack: justify; + -moz-box-pack: justify; + -o-box-pack: justify; + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between } .collect .collect-list .collect_box .collect_content { - z-index: 1; - margin-top: 53% + z-index: 1; + margin-top: 53% } .collect .collect-list .collect_box .collect_content span { - display: block; - font-size: 18px; - font-weight: 700; - white-space: nowrap; - overflow: hidden; - -o-text-overflow: ellipsis; - text-overflow: ellipsis + display: block; + font-size: 18px; + font-weight: 700; + white-space: nowrap; + overflow: hidden; + -o-text-overflow: ellipsis; + text-overflow: ellipsis } .collect .collect-list .collect_box .collect_content p { - font-size: 12px; - margin-top: -6px; - margin-bottom: 2px; - --font-color: rgba(0,0,0,0.3) + font-size: 12px; + margin-top: -6px; + margin-bottom: 2px; + --font-color: rgba(0, 0, 0, 0.3) } [data-theme=dark] .collect .collect-list .collect_box { - color: #ddd!important + color: #ddd !important } [data-theme=dark] .collect .collect-list .collect_box:hover { - -webkit-transform: translateY(-10px); - -moz-transform: translateY(-10px); - -o-transform: translateY(-10px); - -ms-transform: translateY(-10px); - transform: translateY(-10px) + -webkit-transform: translateY(-10px); + -moz-transform: translateY(-10px); + -o-transform: translateY(-10px); + -ms-transform: translateY(-10px); + transform: translateY(-10px) } [data-theme=dark] .collect .collect-list .collect_box:hover::after { - background: rgba(0,0,0,.2) + background: rgba(0, 0, 0, .2) } [data-theme=dark] .collect .collect-list .collect_box::after { - background: rgba(0,0,0,.5) + background: rgba(0, 0, 0, .5) } @media screen and (max-width: 1100px) { - .collect .collect-list { - gap:15px - } + .collect .collect-list { + gap: 15px + } - .collect .collect-list .collect_box { - --w: calc(20% - 12px) - } + .collect .collect-list .collect_box { + --w: calc(20% - 12px) + } } @media screen and (max-width: 900px) { - .collect .collect-list { - gap:16px - } + .collect .collect-list { + gap: 16px + } - .collect .collect-list .collect_box { - --w: calc(25% - 12px) - } + .collect .collect-list .collect_box { + --w: calc(25% - 12px) + } } @media screen and (max-width: 768px) { - .collect .collect-list { - gap:15px - } + .collect .collect-list { + gap: 15px + } - .collect .collect-list .collect_box { - --w: calc(100% / 3 - 10px) - } + .collect .collect-list .collect_box { + --w: calc(100% / 3 - 10px) + } } @media screen and (max-width: 500px) { - .collect .collect-list { - gap:16px - } + .collect .collect-list { + gap: 16px + } - .collect .collect-list .collect_box { - --w: calc(50% - 8px) - } + .collect .collect-list .collect_box { + --w: calc(50% - 8px) + } } .collect-div { - position: absolute; - z-index: 1; - width: 85%; - height: 90% + position: absolute; + z-index: 1; + width: 85%; + height: 90% } .collect-a { - height: 100%; - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex + height: 100%; + display: -webkit-box; + display: -moz-box; + display: -webkit-flex; + display: -ms-flexbox; + display: box; + display: flex } .type-button-group { - text-align: center; - margin-top: 15px + text-align: center; + margin-top: 15px } .sort-button-group { - text-align: center; - margin-top: 10px + text-align: center; + margin-top: 10px } -body[data-type=neodb] .sort-button-group button,body[data-type=neodb] .type-button-group button { - margin: 5px 10px; - border-radius: 5px +body[data-type=neodb] .sort-button-group button, +body[data-type=neodb] .type-button-group button { + margin: 5px 10px; + border-radius: 5px } @media screen and (max-width: 768px) { - body[data-type=neodb] .sort-button-group button,body[data-type=neodb] .type-button-group button { - font-size:13px - } + + body[data-type=neodb] .sort-button-group button, + body[data-type=neodb] .type-button-group button { + font-size: 13px + } } .type-button { - background-color: var(--heo-card-bg); - color: var(--heo-font-color); - padding: 10px 20px; - border: none; - cursor: pointer; - -webkit-transition: .3s; - -moz-transition: .3s; - -o-transition: .3s; - -ms-transition: .3s; - transition: .3s; - border-radius: 5px + background-color: var(--heo-card-bg); + color: var(--heo-font-color); + padding: 10px 20px; + border: none; + cursor: pointer; + -webkit-transition: .3s; + -moz-transition: .3s; + -o-transition: .3s; + -ms-transition: .3s; + transition: .3s; + border-radius: 5px } .type-button:hover { - -webkit-transform: scale(1.1); - -moz-transform: scale(1.1); - -o-transform: scale(1.1); - -ms-transform: scale(1.1); - transform: scale(1.1); - -webkit-transition: .3s; - -moz-transition: .3s; - -o-transition: .3s; - -ms-transition: .3s; - transition: .3s -} -.type-button.active { - background-color: #2196f3; - color: #fff + -webkit-transform: scale(1.1); + -moz-transform: scale(1.1); + -o-transform: scale(1.1); + -ms-transform: scale(1.1); + transform: scale(1.1); + -webkit-transition: .3s; + -moz-transition: .3s; + -o-transition: .3s; + -ms-transition: .3s; + transition: .3s } +.type-button.active { + background-color: #2196f3; + color: #fff +} + +.ad-img { + margin: 12px 0 0 0; + border-radius: 8px; +} \ No newline at end of file diff --git a/templates/modules/widgets/aside/adbox.html b/templates/modules/widgets/aside/adbox.html index 033fc6a..ecc1b5b 100644 --- a/templates/modules/widgets/aside/adbox.html +++ b/templates/modules/widgets/aside/adbox.html @@ -1,25 +1,24 @@
-
广告
- - - - +
广告
+ + + + +
-
广告
- - 自定义广告 - - -
+
广告
+ + 自定义广告 + + \ No newline at end of file