This commit is contained in:
2024-07-30 21:41:51 +08:00
commit 192ef21b12
574 changed files with 70686 additions and 0 deletions

View File

@@ -0,0 +1,156 @@
#error-wrap
display: flex
justify-content: center
width: 100%
margin-top: 1rem
position: relative
+maxWidth768()
margin-top: 0
.error-content
box-shadow: none !important
border-radius: 12px
background: var(--anzhiyu-card-bg) !important
display: flex
flex-direction: row
justify-content: center
align-items: center
margin: 0px 1rem
height: 22rem
max-width: 800px
border-radius: 5px
background: var(--anzhiyu-card-bg)
box-shadow: var(--card-box-shadow)
transition: all 0.3s ease 0s
border: var(--style-border-always)
position: relative
width: 100%
+maxWidth768()
-webkit-box-orient: vertical;
flex-direction: column;
margin: 0px;
height: 25rem;
width: 100%;
.error-img
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
height: 100%;
+maxWidth768()
-webkit-box-flex: 1;
flex: 1 1 0%;
width: 100%;
border-radius: 12px;
.error-info
flex: 1 1 0%
padding: 0.5rem
text-align: center
font-size: 14px
font-family: $font-family
+maxWidth768()
-webkit-box-flex: 1.1;
flex: 1.1 1 0%;
width: 100%;
padding-bottom: 2rem;
.error_title
font-size: 9em
line-height: 1
+maxWidth768()
font-size: 4rem;
.error_subtitle
word-break: break-word
font-size: 1.6em
-webkit-line-clamp: 2
a
display: inline-block
margin-top: 0.5rem
padding: 0.3rem 1.5rem
background: var(--btn-bg)
color: var(--btn-color)
i
padding-right: 0.3rem
.button--animated
border-radius: 8px !important
transition: 0.3s
position: relative
z-index: 1
transition: color 1s ease 0s
#body-wrap
.error-box
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 1rem;
padding-top: 0px;
position: relative;
.aside-list
display: flex
flex-direction: row
flex-wrap: nowrap
margin: 1rem
max-width: 100%
+maxWidth768()
margin: 0;
.aside-list-group
display: flex
flex-direction: row
flex-wrap: wrap
max-width: 800px
margin: 0 auto
justify-content: space-between
.aside-list-item
padding: 0.5rem 0
width: 49%
.thumbnail
overflow: hidden
width: 100%
height: 200px
background: var(--anzhiyu-card-bg)
display: flex
border-radius: 12px
+maxWidth768()
height: 100px;
img
width: 100%
object-fit: cover
border-radius: 12px
transition: 0.3s
transition: filter 300ms ease-in 0.2s, transform 0.6s
&:hover img
transform: scale(1.1)
filter: brightness(0.82)
.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
.content time
display: none

View File

@@ -0,0 +1,603 @@
.post
+maxWidth768()
#aside-content
background: var(--anzhiyu-background);
border: none;
z-index 99
margin-top: -1px
#aside-content
width: 300px
animation: slide-in 0.6s 0.3s backwards;
+minWidth1200()
if hexo-config('aside.position') == 'right'
padding-left: 15px
else
padding-right: 15px
+maxWidth1200()
width: 100%
padding: 20px;
+maxWidth768()
padding: 0 20px 20px
> .card-widget:first-child
margin-top: 0
+maxWidth1200()
margin-top: 20px
+maxWidth768()
margin-top: 0px
.card-widget
@extend .cardHover
position: relative
overflow: hidden
margin-top: 20px
padding: 20px 24px
if hexo-config('aside.mobile') == false
+maxWidth768()
&:not(#card-toc)
display: none
.author-info__bottom-group
display: flex;
justify-content: space-between;
width: 100%;
align-items: center;
.author-info__name
text-align: left;
font-weight: 700;
color: var(--anzhiyu-white);
font-size: 20px;
line-height: 1;
margin-bottom: 5px;
margin-top: 0
.author-info__desc
font-size: 12px;
color: var(--anzhiyu-white);
opacity: .6;
line-height: 1;
.author-info__description
position: absolute;
top: 50px;
width: 100%;
left: 0;
padding: 1rem 1.2rem;
opacity: 0;
transition: .3s;
color: var(--anzhiyu-white);
.banner-button-group .banner-button
padding: 20px 12px;
color: var(--anzhiyu-white);
display: flex;
align-items: center;
z-index: 1;
transition: all 0.3s ease 0s;
cursor: pointer;
.anzhiyufont .anzhiyu-icon-arrow-circle-right
font-size: 1.3rem;
margin-right: 10px;
.author-info-avatar
user-select: none
img
filter: blur(0) brightness(1);
.author-status
position: absolute;
bottom: 2px;
right 2px
width: 33px;
height: 33px;
border-radius: 2em;
background-color: var(--anzhiyu-white);
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
transition: .3s .2s;
transform: scale(1);
img
width: 26px;
height: 26px;
border-radius: 0px;
transition: 0s
.card-info-social-icons
margin: 0;
display: flex;
justify-content: flex-start;
flex-direction: row;
flex-wrap: wrap;
cursor: pointer;
.social-icon
margin: 0 0 0 10px
color: var(--anzhiyu-fontcolor);
font-size: 1.4em;
cursor: pointer;
display: flex;
i, svg
background: var(--anzhiyu-white-op);
color: var(--anzhiyu-white);
font-size: 1rem;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
transition: all .3s ease 0s;
padding: 8px;
border-radius: 32px;
&:hover
background: var(--anzhiyu-secondbg);
transform: scale(1.1);
color: var(--anzhiyu-main);
box-shadow: none;
#card-info-btn
display: block
margin-top: 14px
background-color: var(--btn-bg)
color: var(--btn-color)
text-align: center
line-height: 2.4
&:hover
background-color: var(--btn-hover-color)
span
padding-left: 10px
.item-headline
padding-bottom: 0;
margin-left: 8px;
font-size: 1em;
font-weight: bold;
display: flex;
align-items: center;
span
margin-left: 6px
.sticky_layout
+minWidth1200()
position: sticky
position: -webkit-sticky
top: 20px
transition: top .3s
.card-tag-cloud
a
display: inline-block
padding: 0 4px
&:hover
color: $text-hover !important
.aside-list
& > span
display: block
margin-bottom: 10px
text-align: center
& > .aside-list-item
display: flex
align-items: center
padding: 6px 0
&:first-child
padding-top: 0
&:not(:last-child)
border-bottom: 1px dashed #f5f5f5
&:last-child
padding-bottom: 0
.thumbnail
overflow: hidden
width: w = 4.2em
height: w
& > img
@extend .imgHover
.content
flex: 1
padding-left: 10px
word-break: break-all
width: 4.2em;
height: 4.2em;
& > .name
@extend .limit-more-line
-webkit-line-clamp: 1
& > time,
& > .name
display: block
color: $theme-meta-color
font-size: 85%
& > .title,
& > .comment
@extend .limit-more-line
color: var(--font-color)
font-size: 95%
line-height: 1.5
-webkit-line-clamp: 2
&:hover
color: $text-hover
&.no-cover
min-height: 4.4em
.card-archives ul.card-archive-list,
.card-categories ul.card-category-list
margin: 0
padding: 0
list-style: none
.card-archives .item-headline
display: none
.card-archives ul.card-archive-list > .card-archive-list-item,
.card-categories ul.card-category-list > .card-category-list-item
a
display: flex
flex-direction: row
padding: 3px 10px
color: var(--font-color)
transition: all .2s
&:hover
background-color: var(--text-bg-hover)
span
@extend .limit-one-line
&:first-child
flex: 1
.card-categories
.card-category-list
&.child
padding: 0 0 0 16px
> .parent
> a
&.expand
i
transform: rotate(-90deg)
& + .child
display: block
.card-category-list
&-name
width: 70% !important
&-count
width: calc(100% - 70% - 20px)
text-align: right
i
float: right
margin-right: -.5em
padding: .5em
transition: transform .3s
transform: rotate(0)
if hexo-config('aside.card_categories.expand') == false
> .child
display: none
.card-webinfo
.item-headline
display: none
.webinfo
.webinfo-item
display: flex
align-items: center
padding: 2px 10px 0
justify-content: space-between;
.webinfo-item-title
display: flex;
i
line-height: 2;
margin-right: 6px;
width: 16px;
text-align: center;
div
&:first-child
flex: 1
padding-right: 20px
// toc
#card-toc
+minWidth901()
right: 0 !important
max-height: calc(100vh - 100px);
+maxWidth1200()
position: fixed
right: 55px
bottom: 30px
z-index: 100
max-width: $toc-mobile-maxWidth
max-height: calc(100% - 60px)
width: $toc-mobile-width
transition: transform .3s
transform: scale(0)
transform-origin: right bottom
&.open
transform: scale(1)
.toc-percentage
display: none
float: right
margin-top: -9px
color: #a9a9a9
font-style: italic
font-size: 140%
.toc-content
overflow-y: scroll
overflow-y: overlay
margin: 0 -24px
max-height: calc(100vh - 120px)
width: calc(100% + 48px)
+maxWidth1200()
max-height: calc(100vh - 140px)
& > *
margin: 0 20px !important
& > .toc-item > .toc-child
margin-left: 10px
padding-left: 10px
// border-left: 1px solid var(--dark-grey)
&:not(.is-expand)
.toc-child
display: none
+maxWidth1200()
display: block !important
.toc-item
&.active
.toc-child
display: block
ol,
li
list-style: none
> ol
padding: 0 !important
ol
margin: 0
padding-left: 18px
.toc-link
display: block
margin: 4px 0
padding: 1px 6px
color: var(--toc-link-color)
transition: all .2s ease-in-out
&:hover
color: var(--anzhiyu-lighttext)
&.active
background: $theme-toc-color
color: $toc-active-color
:only-child
> .card-widget
margin-top: 0
.card-more-btn
float: right
color: inherit
&:hover
animation: more-btn-move 1s infinite
.card-announcement
.item-headline
i
color: #FF0000
.avatar-img
width: 118px;
height 118px
right: 0;
top: 0;
border-radius: 500px;
object-fit: cover;
position: absolute;
opacity: 1;
transition: .3s;
border: var(--style-border-avatar);
img
width: 100%
height: 100%
transition: filter 375ms ease-in .2s, transform .3s
object-fit: cover
.site-data
display: table
width: 100%
table-layout: fixed
& > a
display: table-cell
div
transition: all .3s
&:hover
div
color: $theme-color !important
.headline
@extend .limit-one-line
color: var(--font-color)
.length-num
margin-top: -.32em
color: var(--text-highlight-color)
font-size: 1.2em
@keyframes more-btn-move
0%,
100%
transform: translateX(0)
50%
transform: translateX(3px)
@keyframes toc-open
0%
transform: scale(.7)
100%
transform: scale(1)
@keyframes toc-close
0%
transform: scale(1)
100%
transform: scale(.7)
+minWidth1200()
html.hide-aside
.layout
justify-content: center
> .aside-content
display: none
> div:first-child
width: 80%
+maxWidth1200()
.aside-content
max-width: none !important;
display: none
+maxWidth768()
.aside-content
display: block
.page
.sticky_layout
display: flex
flex-direction: column
if hexo-config('aside.card_recent_post.sort_order')
.card-recent-post
order: hexo-config('aside.card_recent_post.sort_order')
if hexo-config('newest_comments.sort_order')
#card-newest-comments
order: hexo-config('newest_comments.sort_order')
if hexo-config('aside.card_categories.sort_order')
.card-categories
order: hexo-config('aside.card_categories.sort_order')
if hexo-config('aside.card_tags.sort_order')
.card-tags
order: hexo-config('aside.card_tags.sort_order')
if hexo-config('aside.card_archives.sort_order')
.card-archives
order: hexo-config('aside.card_archives.sort_order')
if hexo-config('aside.card_webinfo.sort_order')
.card-webinfo
order: hexo-config('aside.card_webinfo.sort_order')
if hexo-config('aside.enable')
#aside-content
>.card-widget.card-info
background: var(--anzhiyu-card-bg);
box-shadow: var(--anzhiyu-shadow-black);
position: relative;
padding: 0;
+maxWidth768()
display: none;
> .card-content
padding: 1rem 1.2rem;
min-height: 320px;
position: relative;
&::before
background: linear-gradient(-25deg,var(--anzhiyu-main),var(--anzhiyu-main-op-deep),var(--anzhiyu-main),var(--anzhiyu-main-op-deep));
background-size: 400%;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
content: '';
animation: gradient 15s ease infinite;
.card-info
&:hover
.author-info-avatar
opacity: 0;
transform: scale(0);
.author-info__description
opacity: 1;
.author-status
opacity: 0;
transform: scale(0);
.author-info-avatar
margin: 45px auto
display: flex
justify-content: center
width: 118px;
height: 118px;
transition: cubic-bezier(.69,.39,0,1.21) .3s;
transform-origin: bottom;
position: relative
+maxWidth768()
display: none
#author-info__sayhi
text-align: left;
color: var(--anzhiyu-white);
background: var(--anzhiyu-white-op);
font-size: 12px;
margin: auto;
padding: 2px 8px;
border-radius: 12px;
width: fit-content;
cursor: pointer;
transition: 0.3s;
user-select: none
&:hover
background: var(--anzhiyu-card-bg);
color: var(--anzhiyu-fontcolor);
transform: scale(1.1);
.banner-button-group .banner-button
border-radius: 35px;
background: var(--anzhiyu-white-op);
&:hover
background: var(--anzhiyu-white);
color: var(--anzhiyu-black);
[data-theme="dark"] #aside-content > .card-info
background: var(--anzhiyu-card-bg)
@media screen and (max-width: 992px)
#aside-content > .card-info
background-size: 100% 70%

View File

@@ -0,0 +1,37 @@
.banners-title
top: 2.9rem;
left: 3rem;
position: absolute;
display: flex;
flex-direction: column;
.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(--anzhiyu-secondtext);
margin-top: 8px;
margin-bottom: 0.5rem;
.banner-button
padding: 8px 12px;
background: var(--anzhiyu-fontcolor);
border-radius: 12px;
color: var(--anzhiyu-card-bg);
display: flex;
align-items: center;
z-index: 1;
transition: 0.3s;
cursor: pointer;
box-shadow: var(--anzhiyu-shadow-black);
&.secondary
background: var(--anzhiyu-secondbg);
border: var(--style-border-always);
color: var(--anzhiyu-lighttext);
margin-right: 1rem;
box-shadow: var(--anzhiyu-shadow-border);

View File

@@ -0,0 +1,8 @@
// chat
if hexo-config('chat_btn') == true && hexo-config('chatra.enable')
#chatra:not(.chatra--expanded)
visibility: hidden !important
width: 1px !important
height: 1px !important
opacity: 0 !important
pointer-events: none

View File

@@ -0,0 +1,97 @@
#article-container
> header
height 0
text-indent:-9999px;
time, span
height: 0;
display: block;
h1
z-index: -1
pointer-events: none
a
background: none !important
border-bottom: none !important
#post-comment
.comment-head
margin-bottom: 20px
font-size: 0.8em !important;
margin-bottom: 0.5rem;
display: flex;
align-items: center;
flex-wrap: wrap;
.comment-headline
display: inline-block
vertical-align: middle
font-weight: 700
font-size: 1.43em
.comment-randomInfo
margin-left: auto;
font-size: 13px;
.comment-switch
display: inline-block
if hexo-config('comments.text')
float: right
margin: 2px auto 0
padding: 4px 16px
width: max-content
border-radius: 8px
background: $comments-switch-bg
else
vertical-align: middle
> span
display: none
.first-comment
color: $comments-switch-first-text
.second-comment
color: $comments-switch-second-text
#switch-btn
position: relative
display: inline-block
margin: -4px 8px 0
width: 42px
height: 22px
border-radius: 34px
background-color: $comments-switch-first-text
vertical-align: middle
cursor: pointer
transition: .4s
&:before
position: absolute
bottom: 4px
left: 4px
width: 14px
height: 14px
border-radius: 50%
background-color: $comments-switch-round
content: ''
transition: .4s
.comment-wrap
> div
animation: tabshow .5s
&:nth-child(2)
display: none
&.move
#switch-btn
background-color: $comments-switch-second-text
&:before
transform: translateX(20px)
.comment-wrap
> div
&:first-child
display: none
&:last-child
display: block

View File

@@ -0,0 +1,170 @@
#footer
position: relative
background: linear-gradient(180deg, var(--anzhiyu-card-bg-none) 0%, var(--anzhiyu-card-bg) 25%);
background-attachment: scroll
background-position: bottom
background-size: cover
+maxWidth768()
z-index: 3
margin-top: -1px;
if hexo-config('footer_bg') != false
&:before
position: absolute
width: 100%
height: 100%
background-color: alpha($dark-black, .5)
content: ''
#footer-bar
padding: 1rem;
color: var(--anzhiyu-fontcolor);
margin-top: 1rem;
background: var(--anzhiyu-secondbg);
display: flex;
overflow: hidden;
z-index: 1002;
transition: 0.3s;
a
&:hover
color: var(--anzhiyu-lighttext);
.footer-bar-link
margin-top: 8px;
margin-bottom: 8px;
margin-right: 1rem;
color: var(--anzhiyu-fontcolor);
font-size: 1rem;
font-weight: bold;
white-space: nowrap;
&.cc i
margin-right: 0.7rem;
font-size: 18px;
.footer-bar-links
display: flex;
justify-content: space-between;
max-width: 1400px;
width: 100%;
margin: 0 auto;
flex-wrap: wrap;
align-items: center;
line-height: 1;
.footer-bar-left
display: flex;
flex-wrap: wrap;
min-height: 32px;
align-items: center;
.footer-bar-right
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
#footer-wrap
position: relative
if hexo-config('footer.footerBar') && hexo-config('footer.footerBar.enable')
padding: 40px 20px 0
else
padding: 40px 20px
color: var(--light-grey)
text-align: center
+maxWidth768()
padding: 0
#footer_deal
justify-content: center;
display: flex;
align-items: center;
+maxWidth768()
flex-wrap: wrap;
flex-direction: row;
.deal_link
display: flex;
margin: 1rem 27px;
color: var(--anzhiyu-card-bg);
border-radius: 3rem;
width: 32px;
height: 32px;
background: var(--anzhiyu-fontcolor);
justify-content: center;
align-items: center;
transition: 0.3s;
&:hover
color: var(--anzhiyu-white);
background: var(--anzhiyu-main);
.footer_mini_logo
width: 50px;
height: 50px;
object-fit: cover;
border-radius: 50%;
margin: 0 1rem;
cursor: pointer;
transition: cubic-bezier(0, 0, 0, 1.29) 0.5s;
-webkit-user-select: none;
+maxWidth768()
display: none;
#anzhiyu-footer
display: flex;
flex-direction: row;
width: 100%;
max-width: 1200px;
margin: 1rem auto;
justify-content: space-between;
flex-wrap: wrap;
padding: 0 2rem;
.footer-group
min-width: 120px;
.footer-title-group
display: flex;
align-items: center;
a
margin-left: 8px
line-height: 32px;
i
line-height: 1;
color: var(--anzhiyu-secondtext);
transition: 0.3s;
font-size: 16px;
opacity: 0.6;
.footer-title
color: var(--anzhiyu-secondtext);
font-size: 1rem;
text-align: left;
font-weight: 600;
margin: 1rem 0;
.footer-links
display: flex;
flex-direction: column;
.footer-item
font-size: 1rem;
line-height: 1rem;
margin: 8px 0;
color: var(--anzhiyu-fontcolor);
margin-right: auto;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 120px;
cursor: pointer;
padding: 2px 0;
text-decoration: none
&:hover
color: var(--anzhiyu-theme);
a
color: var(--light-grey)
i
font-size: 1rem;
line-height: 1rem;
height: 1rem;
.footer-separator
margin: 0 4px
.icp-icon
padding: 0 4px
max-height: 1.4em
width: auto
vertical-align: text-bottom
[data-theme=light] .post #footer
+maxWidth768()
background: linear-gradient(180deg, var(--anzhiyu-background) 0%, var(--anzhiyu-card-bg) 25%);

View File

@@ -0,0 +1,803 @@
#page-header
position: relative
width: 100%
transition: all 0.5s ease 0s;
#nav
box-shadow: none;
transition: 0.3s;
// index
&.full_page
height: $index_top_img_height
background-attachment: fixed
border-radius: 0
if hexo-config('index_img')
+maxWidth768()
#center-console + label
i
background: var(--font-color)
#site-info
position: absolute
top: $index_site_info_top
padding: 0 10px
width: 100%
#site-title,
#site-subtitle,
#scroll-down .scroll-down-effects
text-align: center
text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
line-height: 1.5
#site-title
margin: 0
color: var(--white)
font-size: 1.85em
+minWidth768()
font-size: 2.85em
#site-subtitle
color: var(--light-grey)
font-size: 1.15em
+minWidth768()
font-size: 1.72em
#site_social_icons
display: none
margin: 0 auto
width: 300px
text-align: center
+maxWidth768()
display: block
.social-icon
margin: 0 10px
color: var(--light-grey)
text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
font-size: 1.43em
#scroll-down
position: absolute
bottom: 0
width: 100%
cursor: pointer
z-index: 11;
display: flex;
align-items: center;
justify-content: center;
.scroll-down-effects
position: relative
width: 100%
color: var(--light-grey)
font-size: 30px
// page
&.not-home-page
height: 400px
+maxWidth768()
height: 280px
#page-site-info
position: absolute
top: 200px
padding: 0 10px
width: 100%
+maxWidth768()
top: 140px
// post
&.post-bg
height: 31.25rem
transition: 0.6s
overflow: hidden
if hexo-config('dynamicEffect') && hexo-config('dynamicEffect.postTopRollZoomInfo')
animation: header 5s linear forwards;
animation-timeline: view();
if hexo-config('mainTone.enable')
background-color: var(--anzhiyu-bar-background)
else
background-color: transparent
// #nav
#nav
transition: all 0.5s, border 0.3s
// .post-meta
.post-meta:has(.bldbanner),
.post-meta:has(.bili-banner),
.post-meta:has(.blqbanner)
pointer-events: all
.bili-banner
margin-top: 0 !important
// #post-info
#post-info:has(.bldbanner),
#post-info:has(.bili-banner),
#post-info:has(.blqbanner)
pointer-events: none
&:has(.bldbanner),
&:has(.blqbanner)
height: 15rem
img
border-radius: 0px
&:has(.bili-banner)
height: 11rem
img
border-radius: 0px
#post-top-cover
width: 70%;
height: 100%;
position: relative;
margin: 0 -20% 0 auto;
overflow: hidden;
margin-bottom: 0;
user-select: none
transform: rotate(10deg) translateY(-10%) scale(var(--anzhiyu-header-cover-scale));
will-change: transform
if !hexo-config('mainTone.enable')
filter: blur(10px) brightness(60%);
animation: none;
transition: filter 0s
margin: auto
width: auto
&::after
display: none
img
border-radius: 0
else
filter: blur(10px);
+minWidth768()
animation: showCover 1s 0.3s backwards;
opacity 0.5
+maxWidth768()
margin: 0 0 0 auto;
transform: rotate(0deg) translateY(0) scale(1);
filter: blur(0px);
width: 100%;
if hexo-config('mainTone.enable')
position: fixed;
height: 30rem;
else
position: absolute;
height: 100vh;
z-index: 1;
&::after
position: absolute;
content: "";
width: 100%;
height: 100%;
top: 0;
left: 0;
box-shadow: 110px -130px 300px 60px var(--anzhiyu-bar-background) inset;
+maxWidth768()
box-shadow: 0 0 205px 59px var(--anzhiyu-main) inset
#post-top-bg
width: 100%;
height: 100%;
object-fit: cover;
min-width: 50vw;
min-height: 20rem;
+minWidth768()
animation: slide-in 0.6s 0.3s backwards;
+maxWidth768()
min-height: 15rem !important;
if hexo-config('mainTone.enable')
height: 70% !important;
else
height: 100% !important;
opacity: 1 !important;
#nav
backdrop-filter: none;
background: transparent;
border-bottom: none;
&.nav-fixed
#nav
background: var(--anzhiyu-card-bg);
outline: 1px solid var(--anzhiyu-card-border);
transform: translateZ(0);
+maxWidth768()
#nav
border-bottom: none
+maxWidth768()
margin-bottom: -12px;
transition: 0s !important
min-height: 450px;
&.nav-fixed
#nav
background: var(--anzhiyu-card-bg);
outline: 1px solid var(--anzhiyu-card-border);
if hexo-config('mainTone.enable')
&:before
position: absolute
width: 100%
height: 100%
content: ''
transition: 0s;
background-color: var(--anzhiyu-bar-background);
animation: slide-in-op 0.6s 0s forwards;
#post-info
position: absolute
top: 0
left: calc((100% - 1400px + 3rem) / 2);
width: calc(100% - (100% - 1400px + 3rem));
height 100%
display: flex
justify-content: center;
align-items: flex-start;
flex-direction: column;
z-index: 3
+minWidth768()
--anzhiyu-header-translateY: 0
animation: post-info-slide-in 0.6s 0.3s backwards;
transform: scale(var(--anzhiyu-header-info-scale)) translateY(var(--anzhiyu-header-translateY));
transform-origin: left top
will-change: transform;
+maxWidth1400()
padding: 0 3.5rem
width 100%
left: 0
+maxWidth768()
padding: 11rem 6% 0;
align-items: center;
if hexo-config('mainTone.enable')
&:after
display: block
position: absolute;
content: "";
width: 100%;
height: 100%;
bottom: 0;
left: 0;
box-shadow: 0px -265px 287px 45px var(--anzhiyu-bar-background) inset;
z-index: 0;
animation: none
&.not-top-img
margin-bottom: 10px
height: 60px
background: 0
#nav #menus .menus_item:hover > a
background: var(--anzhiyu-main);
#travellings_button::after
background: var(--anzhiyu-main) !important;
#nav
#blog_name .back-home-button,
#blog_name #site-name,
#nav-right .nav-button a,
#nav-right #toggle-menu
&:hover
color: var(--anzhiyu-white);
background: var(--anzhiyu-main);
box-shadow: var(--anzhiyu-shadow-main);
.post-meta-categories
background: rgba(0, 0, 0, 0.2)
#nav
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a
color: var(--font-color)
text-shadow: none
#center-console + label
i
background: var(--font-color)
&.nav-fixed
#nav
position: fixed
z-index: 91
background: var(--anzhiyu-card-bg);
outline: 1px solid var(--anzhiyu-card-border);
transform: translateZ(0);
top: 0
#toggle-menu
color: var(--font-color)
text-shadow: none
transition: background .3s ease-in-out,color 0s ease-in-out
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a
color: var(--font-color)
text-shadow: none
transition: background .3s ease-in-out,color 0s ease-in-out
&.nav-fixed
#name-container
z-index: 101;
transition: 0.3s;
top: 10px;
#page-name
display: inline;
opacity: 1;
transition: 0.3s;
line-height: 2;
+minWidth768()
max-width: 15.5rem
+minWidth900()
max-width: 25.5rem
+minWidth1200()
max-width: 35.5rem
+minWidth2000()
max-width: 45.5rem
#nav
#menus
z-index: 100;
div.menus_items
transition: 0.3s;
height: 40px;
margin: auto 0;
// position: relative;
// top: -60px;
transform: translateY(-60px)
will-change: transform
&.nav-fixed.nav-visible
#page-name
z-index: 100;
top: 60px;
transition: 0.3s;
#nav
#menus
div.menus_items
opacity: 1;
transition: 0.3s;
// position: relative;
// top: 0px;
transform: translateY(0px)
will-change: transform
#page
h1.page-title
margin: 8px 0 20px
// for not top_img
#post
& > #post-info
margin-bottom: 30px
.post-title
border-bottom: 1px solid var(--light-grey)
color: var(--text-highlight-color)
.post-edit-link
float: right
#post-meta,
#post-meta a
color: #78818a
#post-info
+maxWidth768()
&:after
display: none
transition: 0
.post-title
@extend .limit-more-line
color: var(--white)
line-height: 1.5
font-weight: 700;
font-size: 3.3rem;
text-align: left;
margin: 1rem 0 1rem 0;
-webkit-line-clamp: 2;
padding: 0;
overflow: hidden;
+maxWidth768()
font-size: 1.5rem
-webkit-line-clamp: 3;
margin: 0.2rem auto !important;
text-align: center;
z-index: 4
.post-edit-link
padding-left: 10px
#post-meta
color: var(--light-grey)
font-size: 95%
display: flex;
width: 50rem;
max-width: 100%;
align-items: flex-start;
justify-content: center;
flex-direction: column;
+minWidth768()
> .meta-secondline
> span:first-child
display: none
+maxWidth768()
font-size: 90%
z-index: 4
align-items: center;
> .meta-firstline,
> .meta-secondline
display: flex;
font-size: 90%;
flex-wrap: wrap;
align-items: center;
justify-content: center;
.post-meta
&-separator
margin: 0 8px
&-icon
margin-right: 4px
&-label
if hexo-config('post_meta.post.label')
margin-right: 4px
else
display: none
&-categories
a:not([data-fancybox="gallery"])
font-weight: 500;
text-decoration: none;
padding: 0 0.2em;
&:hover
color: var(--anzhiyu-white);
background-color: var(--anzhiyu-main);
border-radius: 4px;
a
color: var(--light-grey)
transition: all .3s ease-out
&:hover
color: $text-hover
text-decoration: underline
if hexo-config('post_meta.post.date_format') == 'relative'
time
display: none
#nav
position: fixed
transition: .3s
top: 0
z-index: 90
display: flex
align-items: center
padding 0 calc((100% - 1400px + 3rem) / 2)
width: 100%
height: 60px
opacity: 1
justify-content: space-between;
outline: 1px solid var(--anzhiyu-none);
i
font-size: 1.2rem
font-weight: bold
+maxWidth768()
padding: 0 16px
#toggle-menu
display: none
padding: 2px 0 0 6px
vertical-align: top
border-radius: 50px;
&:hover
color: var(--white) !important
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a
color: var(--light-grey)
&:hover
color: var(--white)
#site-name
font-weight: bold
cursor: pointer
transition: .3s !important
.menus_items
display: inline
font-size: 1.3em
.menus_item
padding 0 0.4rem
display flex
flex-direction column
align-items center
margin auto
position relative
border-radius: 30px;
&:first-child .menus_item_child::after
position: absolute;
top: -60px;
left: 0;
width: 50%;
height: 60px;
content: "";
&:last-child .menus_item_child::after
position: absolute;
top: -60px;
right: 0;
width: 50%;
height: 60px;
content: "";
&:hover
.menus_item_child
border: var(--style-border-hover);
box-shadow: var(--anzhiyu-shadow-main);
opacity: 1;
pointer-events: all;
transform: translateY(0) scale(1);
& > a > i:last-child
transform: rotate(180deg)
& > a > i:last-child
padding: 4px
transition: transform .2s
.menus_item_child
position: absolute
opacity 0
width: max-content
border-radius 5px
top 35px
box-shadow var(--anzhiyu-shadow-black)
border var(--style-border)
transition 0.2s
background-color var(--anzhiyu-card-bg)
border-radius 50px
right auto
left auto
padding 6px 4px
box-sizing content-box
line-height 35px
transform: translateY(-10px) scale(0);
transform-origin: top;
pointer-events: none
margin-top: 8px
&:before
position: absolute
top: -12px
left: 0
width: 100%
height: 16px
content: ''
li
list-style: none
&:hover
background: var(--text-bg-hover)
&:first-child
border-top-left-radius: 50px
border-top-right-radius: 50px
&:last-child
border-bottom-right-radius: 50px
border-bottom-left-radius: 50px
a
display: inline-block
padding: .5625rem 1rem
width: 100%
color: var(--font-color) !important
text-shadow: none !important
&:hover
color: var(--anzhiyu-white) !important
padding: .125rem 1.25rem;
transform: scale(1) !important;
background: var(--anzhiyu-main)!important;
box-shadow: var(--anzhiyu-shadow-main);
transform: scale(1)!important;
&.hide-menu
#toggle-menu
display: inline-block !important
.site-page
font-size: inherit
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
i
font-size: 1.35rem;
.menus_items
display: none
#search-button span
display: none
#search-button
display: inline
padding: 0 0 0 14px
.site-page
position: relative
padding-bottom: 6px
font-size: .78em
cursor: pointer
&:hover
color: var(--anzhiyu-white) !important
@keyframes move-forever
0%
transform: translate3d(-90px, 0, 0);
100%
transform: translate3d(85px, 0, 0)
//css
if hexo-config('dynamicEffect') && hexo-config('dynamicEffect.postTopWave')
.main-hero-waves-area
width: 100%
position: absolute
left: 0
bottom: -11px
z-index: 5
pointer-events: none
.waves-area .waves-svg
width: 100%
height: 3.75rem
//Animation
.parallax > use
animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite
will-change: transform;
.parallax > use:nth-child(1)
animation-delay: -2s
animation-duration: 7s
fill: #f7f9febd
.parallax > use:nth-child(2)
animation-delay: -3s
animation-duration: 10s
fill: #f7f9fe82
.parallax > use:nth-child(3)
animation-delay: -4s
animation-duration: 13s
fill: #f7f9fe36
.parallax > use:nth-child(4)
animation-delay: -5s
animation-duration: 20s
fill: #f7f9fe
//
[data-theme="dark"] .parallax
& > use:nth-child(1)
fill: #18171dc8
& > use:nth-child(2)
fill: #18171d80
& > use:nth-child(3)
fill: #18171d3e
& > use:nth-child(4)
fill: rgb(0 0 0 / 39%)
#post-firstinfo
text-align: left;
display: flex;
white-space: nowrap;
-webkit-user-select: none;
+maxWidth768()
z-index 4
.meta-firstline
display: flex;
align-items: center;
height: 32px;
a.post-meta-original
background: var(--anzhiyu-white-op);
color: var(--anzhiyu-white);
padding: 0 0.7rem;
font-size: 0.9rem;
margin: auto;
border-radius: 8px;
font-weight: bold;
height: 32px;
line-height: 32px;
width: 100%;
height: 100%;
display: flex;
span.post-meta-categories
color: var(--anzhiyu-white);
font-size: 0.9rem;
margin: auto;
font-weight: bold;
height: 32px;
line-height: 32px;
width: 100%;
height: 100%;
display: flex;
i
display: none
a.post-meta-categories
border-radius: 8px;
padding: 0 0.7rem;
background: var(--anzhiyu-white-op);
color: var(--anzhiyu-white);
font-size: 0.9rem;
width: 100%;
height: 100%;
font-weight: bold;
display: flex;
margin-left: .4rem
.article-meta.tags
margin-left: 1.2rem;
+maxWidth768()
display: none
.article-meta__tags
color: var(--anzhiyu-white);
opacity: 0.8;
margin-right: 8px;
.anzhiyu-icon-hashtag:before
font-size: 17px;
.anzhiyu-icon-location-dot
margin-right: 4px
#post
#post-info
#post-firstinfo
.meta-firstline
a.post-meta-original
background: var(--anzhiyu-black)
.article-meta__tags
color: var(--anzhiyu-black)
+maxWidth768()
.layout > div:first-child:not(.recent-posts)
z-index: 10;
if hexo-config('mainTone.enable')
#page-header.post-bg #nav
background: linear-gradient(to top, var(--anzhiyu-main-none) 0%, var(--anzhiyu-bar-background) 100%);
transition: 0s
.post-bg:has(.bldbanner) #post-info:after,
.post-bg:has(.bili-banner) #post-info:after,
.post-bg:has(.blqbanner) #post-info:after
box-shadow: 0px -214px 287px 45px var(--anzhiyu-black-op) inset;
/*Shrinking for mobile*/
.waves-area .waves-svg
height: 40px;
min-height: 40px;
.main-hero-waves-area
display: none;
visibility: hidden;
@keyframes showCover
0%
opacity: 0;
transform: rotate(10deg) translateY(-8%) scale(var(--anzhiyu-header-cover-scale));
100%
opacity: 0.5;
transform: rotate(10deg) translateY(-10%) scale(var(--anzhiyu-header-cover-scale));

View File

@@ -0,0 +1,57 @@
#random-banner
display: flex;
width: 100%;
height: 76%;
background: var(--anzhiyu-card-bg);
margin-bottom: 0.5rem;
border: var(--style-border);
border-radius: 12px;
overflow: hidden;
position: relative;
box-shadow: var(--anzhiyu-shadow-border);
flex-direction: column;
overflow: hidden;
transition: 0.3s;
will-change: transform;
&:hover
box-shadow: var(--anzhiyu-shadow-main);
#random-hover
opacity: 1;
padding-left: 2rem;
background: var(--anzhiyu-theme-op-deep);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
transform: translateZ(0);
backface-visibility: hidden;
transform-style: preserve-3d;
transition: 0.3s;
background-size: 200%;
cursor: pointer;
#skills-tags-group-all .tags-group-wrapper
margin-top: 7rem;
#skills-tags-group-all
transform: rotate(-30deg);
#random-hover
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: var(--anzhiyu-theme);
color: var(--anzhiyu-white);
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;
font-size: 60px;
.bannerText
display: flex
align-items: center
i
font-size: 80px;
margin-left: 10px;
line-height: 1;
+maxWidth1200()
display: none;

View File

@@ -0,0 +1,743 @@
#sidebar #sidebar-menus .menus_items .menus_item_child
margin: 0px
list-style: none
display: flex
flex-direction: row
flex-wrap: wrap
#sidebar #sidebar-menus .menus_item_child li
width: calc(50% - 8px)
margin: 4px
#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(--anzhiyu-card-bg)
font-size: 14px
height: 4.2rem;
width: 7rem;
justify-content: space-between;
#sidebar .menus_item ul
padding-left: 0px
#nav-group
max-width: 1400px;
width: 100%;
display: flex;
position: relative;
align-items: center;
#page-header.nav-fixed #center-console
& + label i
background: var(--font-color);
#center-console
display: none
& + label
--icon-size: 1.375rem;
position: relative;
right: 0;
top: 0;
bottom: 0;
height: var(--icon-size);
width: var(--icon-size);
cursor: pointer;
transition: 1s;
margin-left: 1rem
&:hover
i
&.left
width: calc(var(--icon-size)/2.5);
&.center
opacity: 0.5
width: calc(var(--icon-size)/2.5);
&.right
width: calc(var(--icon-size)/2.5);
height: calc(var(--icon-size)/1.15);
transform: none;
i
background: var(--light-grey);
position: absolute;
border-radius: calc(var(--icon-size)*.15);
transition: .5s var(--animation-on);
inset: 0;
margin: auto;
right: auto;
width: calc(var(--icon-size)/3);
height: calc(var(--icon-size)/3);
transform: translateY(calc(var(--icon-size)/4));
&.left
width: 100%;
transform: translateY(calc(var(--icon-size)/-4));
&.right
left: auto;
right: 0;
width: calc(var(--icon-size)/2);
&:checked + label
right: 0
top: 0.5rem;
z-index: 31;
&:hover
&::after
background: var(--anzhiyu-main) !important;
&::after
content: "";
width: 35px;
height: 35px;
display: block;
position: absolute;
z-index: -1;
top: -6px;
left: -6.3px;
background: var(--anzhiyu-fontcolor) !important;
border-radius: 50px;
&:is(.widget, .widget:hover) i
height: calc(var(--icon-size)/4.5);
background: var(--anzhiyu-white) !important;
i.left
width: 100% !important;
transform: rotate(-45deg) !important;
i.center
width: 0 !important;
i.right
width: 100% !important;
transform: rotate(45deg) !important;
[data-theme="dark"] #center-console:checked + label:is(.widget, #center-console:checked + label .widget:hover) i
background: var(--anzhiyu-black) !important;
#body-wrap
.nav-fixed #travellings_button
&::after
background: var(--anzhiyu-main) !important;
#travellings_button
display: flex
&:hover::after
opacity: 1;
transform: none;
visibility: visible;
&:hover
a
background: var(--anzhiyu-main);
-webkit-box-shadow: var(--anzhiyu-shadow-main);
box-shadow: var(--anzhiyu-shadow-main);
i
color: var(--anzhiyu-white);
&::after
--height: 2rem;
content: attr(title);
position: fixed;
display: flex;
justify-content: center;
align-items: center;
color: var(--anzhiyu-white);
background: var(--anzhiyu-white-op) !important;
box-shadow: var(--anzhiyu-shadow-nav);
border-radius: var(--anzhiyu-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;
z-index: 1;
visibility: hidden;
transform: scaleX(1.1);
pointer-events: none;
transition: .5s;
+maxWidth900()
padding: 0 2em;
#body-wrap:has(#travellings_button:hover)
#page-name,
#nav #menus
display: none
#body-wrap .page #travellings_button:hover
&::after
background: var(--anzhiyu-main) !important;
@media screen and (max-width: 768px)
#page-header #nav
padding: 20px
.cardHover,
.error404 #error-wrap .error-content,
.layout > div:first-child:not(.recent-posts),
#recent-posts > .recent-post-item,
#aside-content .card-widget,
.layout > .recent-posts .pagination > *:not(.space)
box-shadow: none !important
#sidebar #sidebar-menus .menus_items .site-page:hover
background: none
div#travellings_button
display: none !important
#nav
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a:hover
background var(--anzhiyu-main)
transition 0.3s
#page-header.not-top-img
margin-bottom 0px
#page-header:not(.nav-fixed) #percent
transition 0.3s
#page-header #nav #nav-right > div
margin-left 1rem
padding 0
.nav-button
cursor pointer
#nav #menus
padding 0 calc((100% - 1400px + 3rem) / 2)
display flex
justify-content center
width 100%
position absolute
height 60px
left 0
margin 0
transform: translateZ(0);
will-change: auto
#nav .site-page
padding-bottom 0px
#nav *::after
background-color transparent !important
/* */
#nav .menus_items .menus_item a
border-radius 50px
#nav .menus_items .menus_item .menus_item_child li a
padding 2px 16px
border-radius 50px
transition: .3s !important
#nav .menus_items .menus_item .menus_item_child li:hover a
color white !important
#nav .menus_items .menus_item .menus_item_child li
border-radius 50px
transition all 0.3s
display inline-block
margin 0 3px
#site-name, .shuoshuo
white-space nowrap
overflow hidden
#site-name
padding 0 2px
height: 35px;
line-height: 35px;
position relative
display flex
align-items center
justify-content center
transition 0.3s
/* */
#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
#nav
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a
border-radius 50px;
.page #nav
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a:hover
color var(--anzhiyu-white)
background var(--anzhiyu-main)
transition 0.3s
box-shadow var(--anzhiyu-shadow-main)
.post #nav
#blog_name .back-home-button,
#blog_name #site-name,
#nav-right .nav-button a,
#nav-right #toggle-menu
&:hover
color var(--anzhiyu-white)
background var(--anzhiyu-white-op)
transition 0.3s
.post #nav
#menus .menus_item
&:hover > a
color var(--anzhiyu-white)
background var(--anzhiyu-white-op)
transition 0.3s
.post .nav-fixed #nav
#menus .menus_item
&:hover
> a.site-page
color var(--anzhiyu-white)
background var(--anzhiyu-main)
transition 0.3s
box-shadow var(--anzhiyu-shadow-main)
#blog_name #site-name,
#blog_name .back-home-button,
#nav-right .nav-button a,
#nav-right #toggle-menu
&:hover
color var(--anzhiyu-white)
background var(--anzhiyu-main)
transition 0.3s
box-shadow var(--anzhiyu-shadow-main)
#page-header.nav-fixed #nav #page-name
background none
text-shadow none
box-shadow none
font-weight bold
border-radius 100px
min-width 100px
line-height: 1.5rem;
#name-container
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-visible #name-container
z-index 100
top 60px
transition 0.3s
#page-header.nav-fixed #nav #page-name:hover
color var(--anzhiyu-main)
@media screen and (min-width: 900px)
#page-header.nav-fixed #nav #page-name::after
opacity 0
transform scale(1)
content ""
transition 0.2s
position absolute
left 0
right 0
top 50%
transform translateY(-50%)
margin auto
color var(--anzhiyu-white) !important
font-weight 700
line-height 2
@media screen and (min-width: 1200px)
#page-header.nav-fixed #nav #page-name:hover:after
opacity 1
#page-header.nav-fixed #nav #page-name:hover
background var(--anzhiyu-main)
#page-header #nav #page-name
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 1.1rem
animation-timing-function ease-in
-webkit-animation-timing-function ease-in
#menus > div.menus_items > div > a
letter-spacing 0.3rem
font-weight 700
padding 0em 0.8em 0em 1em
height 35px
line-height 35px
transition: color 0s !important
#nav div#toggle-menu
padding 2px 0 4px 6px
#page-name:hover:before
opacity 1
::backdrop
display block
position fixed
top 0px
.mask-name-container
width 100%
height 100%
position absolute
overflow hidden
left 0
#nav .menus_items .menus_item > a > i:last-child
display none
#nav #search-button
font-size 1.3em
.back-home-button:hover
background var(--anzhiyu-main)
color var(--anzhiyu-white) !important
.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
.back-home-button:hover .back-menu-list-groups
display: flex;
opacity: 1;
transition: .3s;
top: 55px;
pointer-events: auto;
left: 0rem;
transform: scale(1);
.back-home-button .back-menu-list-groups
position: absolute;
top: 45px;
transform: scale(.8);
transform-origin: top left;
left: 0rem;
background-color: var(--anzhiyu-maskbgdeep);
border-radius: 12px;
border: var(--style-border);
flex-direction: column;
font-size: 12px;
color: var(--anzhiyu-secondtext);
box-shadow: var(--anzhiyu-shadow-border);
transition: .1s;
opacity: 0;
pointer-events: none;
backdrop-filter: blur(20px);
.back-home-button .back-menu-list-group
display flex
flex-direction column
.back-home-button .back-menu-list-group .back-menu-list-title
margin 8px 0 0 16px
transition 0.3s
.back-home-button .back-menu-list
display flex
flex-direction row
flex-wrap wrap
width 340px
justify-content space-between
.back-home-button .back-menu-list::before
position absolute
top -24px
left 0px
width 100%
height 25px
content ""
transition: 0s
.back-home-button .back-menu-list-groups .back-menu-list-group:last-child .back-menu-list
margin 0 0 8px
.back-home-button .back-menu-list-group:hover .back-menu-list-title
color var(--anzhiyu-main)
.back-home-button .back-menu-list-groups:hover
border var(--style-border-hover)
.back-home-button .back-menu-list .back-menu-item
display flex
align-items center
margin 4px 8px
padding 4px 8px !important
transition 0.3s
width 150px
border-radius 8px !important
transition 0.2s !important
.back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-text
font-size var(--global-font-size)
margin-left 0.5rem
color var(--anzhiyu-fontcolor)
white-space nowrap
+maxWidth768()
font-size: 14px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
.back-menu-list-groups .back-menu-list .back-menu-item .back-menu-item-icon
width 24px
height 24px
border-radius 24px
background var(--anzhiyu-secondbg)
#page-header #nav .back-home-button
cursor pointer
position relative
#page-header:not(.not-top-img) #nav .back-home-button
color var(--light-grey)
#page-header.nav-fixed:not(.not-top-img) #nav .back-home-button
color var(--font-color)
.back-home-button .back-menu-list .back-menu-item:hover .back-menu-item-text
color var(--anzhiyu-white)
.back-menu-item-icon.loading img
width 25px
#page-header #nav #menus .nav-button.long a.totopbtn span
border-radius 35px
display flex
justify-content center
align-items center
transition 0.3s
white-space nowrap
#page-header #nav #menus .nav-button.long a.totopbtn:hover
border-radius 35px
height 30px
#nav #search-button
padding-left 0
#search-button a.site-page.social-icon.search span
display none
#nav .nav-button a:hover
color var(--anzhiyu-white) !important
#menus > div.menus_items a
font-weight bold
#menus .menus_item .menus_item_child .site-page.child.faa-parent.animated-hover .anzhiyu-icon-fan.faa-tada
animation rotate 1.6s linear infinite
#nav-right
z-index 102
position absolute
right 0
display flex
flex-direction row
height 100%
align-items center
/* nav left */
#nav #blog_name
flex-wrap nowrap
height 60px
display flex
align-items center
transition 0.3s
z-index 102
#blog_name #site-name i
position absolute
transition 0.3s
font-size: 1rem
opacity 0
#blog_name #site-name:hover .title
opacity 0
#blog_name #site-name .title
transition 0.3s
letter-spacing normal
font-size: 1.2rem;
padding: 0 5px;
line-height: 2rem;
transition: color 0s;
.post #blog_name #site-name .title
transition 0s
#blog_name #site-name:hover i
color white
opacity 1
#page-header #nav #nav-right .nav-button a i,
#page-header #nav #nav-left .nav-button a i
line-height 1
transition .3s
#page-header #nav #nav-right .nav-button a:hover i,
#page-header #nav #nav-left .nav-button a:hover i
color var(--anzhiyu-white)
transition background 0.35s ease-in-out, color 0.2s ease-in-out
[data-theme="dark"] #page-header #nav #nav-right .nav-button a i,
[data-theme="dark"] #page-header #nav #nav-left .nav-button a i,
[data-theme="dark"] #page-header #nav #nav-right .nav-button a i,
[data-theme="dark"] #page-header #nav #nav-left .nav-button a i,
[data-theme="dark"] #page-header.nav-fixed:not(.not-top-img) #nav .back-home-button
+maxWidth768()
color: #c9c9c9 !important
/* */
#nav-totop
width 35px
height 35px
transition 0.3s
display flex
border-radius 50px
align-items center
justify-content space-around
transition: all 0.3s ease-in-out;
#page-header #nav #nav-right .nav-button a.totopbtn
width 25px
height 25px
border-radius 40px
background var(--font-color)
color var(--card-bg)
transition all 0.3s ease-in-out
#page-header #nav #nav-right .nav-button:not(.long) a.totopbtn:hover
height 35px
width 35px
#page-header #nav #nav-right .nav-button:not(.long):hover a.totopbtn
width 35px
height 35px
top 0
right 0
#page-header #nav .nav-button a
height 35px
width 35px
display flex
align-items center
justify-content center
transition: background 0.3s ease-in-out, color 0s ease-in-out;
.nav-fixed #nav-totop #percent,
.page #nav-totop #percent
font-size 13px
border-radius 35px
display flex
justify-content center
align-items center
white-space nowrap
color var(--card-bg)
width 25px
height 25px
#nav-totop #percent
font-weight 700
#page-header #nav #nav-right .nav-button:hover a.totopbtn
background var(--anzhiyu-main)
#nav-totop:hover .totopbtn i
opacity 1
color var(--anzhiyu-white)
transition 0.3s
#nav-totop .totopbtn i
position absolute
display flex
opacity 0
#nav-totop.long .totopbtn i
font-size 1rem
#nav-totop:hover #percent
opacity 0
transform scale(1.5)
font-weight 700
#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
#page-header #nav #nav-right .nav-button.long,
#page-header #nav #nav-right .nav-button.long a.totopbtn,
#page-header #nav #nav-right .nav-button.long a.totopbtn span
width 70px
#page-header #nav #nav-right .long#nav-totop:hover
background-color transparent
/* */
@media screen and (max-width: 1390px)
#nav
padding 0 1.5rem
#nav .mask-name-container
padding 0 1.5rem
div#menus
padding 0 1.5rem
@media screen and (min-width: 900px)
#nav .back-home-button:hover
box-shadow var(--anzhiyu-shadow-main)
@media screen and (max-width: 768px)
.mask-name-container
display none
#menus
padding 20px
#page-header.not-top-img
margin-bottom 10px
#nav
border-bottom none
background var(--anzhiyu-background)
#page-header #nav #nav-right div
margin-left .5rem
@media screen and (min-width: 768px)
.menus_item:hover > a.site-page
color var(--anzhiyu-white) !important
background var(--anzhiyu-main)
transition 0.3s
box-shadow var(--anzhiyu-shadow-main)

View File

@@ -0,0 +1,18 @@
if hexo-config('index_img')
#nav
+maxWidth768()
background: var(--anzhiyu-card-bg) !important;
#page-header #nav #site-name, #page-header #nav #toggle-menu,#page-header:not(.not-top-img) #nav .back-home-button
+maxWidth768()
color: var(--font-color) !important;
#blog_name,
.mask-name-container,
#menus,
#nav-right .nav-button,
#nav-right #toggle-menu
a
+maxWidth768()
color: var(--font-color) !important;
div#bbTimeList
+maxWidth768()
margin: 20px 15px !important;

View File

@@ -0,0 +1,350 @@
#pagination
.toPageGroup
display: flex;
position: relative;
margin: 0;
box-shadow: none;
width: auto;
&:hover
background: none;
.pagination
text-align: center
.extend.next
.pagination_tips_next
margin-left: -32px;
transition: 0.3s;
opacity: 0;
.page-number
&.current
background: $theme-paginator-color
color: var(--white)
.pagination-info
position: absolute
if hexo-config("post_pagination") == '3' && hexo-config("post_pagination") == '4'
top: auto
else
top: 50%
padding: 20px 40px
width: 100%
transform: translate(0, -50%)
.prev_info,
.next_info
@extend .limit-one-line
color: var(--white)
font-weight: 500
.next-post
.pagination-info
text-align: right
.pull-full
width: 100% !important
.prev-post .label,
.next-post .label
color: var(--light-grey)
text-transform: uppercase
font-size: 90%
.prev-post,
.next-post
@extend .postImgHover
width: 50%
+maxWidth768()
width: 100%
a
position: relative
display: block
overflow: hidden
height: 150px
&.pagination-post
overflow: hidden
margin-top: 1.25rem
width: 100%
background: $dark-black
border-radius: 10px;
if hexo-config("post_pagination") == '3' || hexo-config("post_pagination") == '4'
+minWidth1200()
position: fixed;
width: 300px;
bottom: -100px;
right: 60px;
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: 1002;
background: 0 0;
border-radius: 10px;
.prev-post.pull-left
display: none
&:hover
border: var(--style-border-hover);
.next-post > a,
.prev-post > a
background: var(--anzhiyu-main);
.pagination-info
.label,
.next_info,
.prev_info
color: var(--anzhiyu-white)
&.show-window
bottom: 20px;
opacity: 1;
.prev-post.pull-left,
.prev-post.pull-full,
.next-post.pull-right,
.next-post.pull-full
background: var(--anzhiyu-maskbgdeep);
backdrop-filter: blur(5px);
transform: translateZ(0);
width: 100%;
> a
border: none;
height: fit-content;
padding: 0.5rem 0;
img
if hexo-config("post_pagination") == '3'
display: none
top: 0;
.pagination-info
text-align: left;
position: relative;
padding: 0.5rem 1rem;
transform: none;
display: flex;
top: 0;
flex-direction: column;
justify-content: center;
margin: auto;
height: 100%;
.label
color: var(--anzhiyu-fontcolor);
font-weight: 700;
font-size: 12px;
margin-bottom: 0.5rem;
border-bottom: var(--style-border);
line-height: 1;
padding-bottom: 0.5rem;
.next_info,
.prev_info
color: var(--anzhiyu-fontcolor);
-webkit-line-clamp: 2;
white-space: normal;
line-height: 1.3;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
font-size: 14px;
font-weight: 400;
margin-bottom: 0;
+maxWidth768()
.toPageGroup
display: none
.page-number
display: none !important
.space
display: none !important
.pagination
.extend.next
width: 100%;
height: 3rem
margin: 0;
border-radius: 12px;
line-height: 3rem
background: var(--anzhiyu-card-bg);
border: var(--style-border-always);
box-shadow: var(--anzhiyu-shadow-border);
margin: 0 20px
&:hover
background: var(--anzhiyu-theme);
color: var(--anzhiyu-white);
i
display: none
.pagination_tips_next
opacity: 1;
margin-left: 0;
.extend.prev
width: 100%;
height: 3rem;
border-radius: 12px;
line-height: 3rem;
background: var(--anzhiyu-card-bg);
border: var(--style-border-always);
box-shadow: var(--anzhiyu-shadow-border);
margin: 0 20px
i
display: none
.pagination_tips_prev
opacity: 1;
margin-right: 0
.layout
& > .recent-posts
.pagination
& > *:not(pangu)
display: inline-block
width: w = 2.5em
height: w
line-height: w
& > *:not(.space):not(pangu)
@extend .cardHover
transition: 0s;
& > div:not(.recent-posts)
.pagination
.page-number
display: inline-block
margin: 0 4px
min-width: w = 2.5em
height: w
text-align: center
line-height: w
cursor: pointer
//
@media screen and (min-width: 1200px)
#pagination a.extend.next:hover,
#pagination a.extend.prev:hover
transform: scale(1.03)
+minWidth768()
#pagination .page-number.current:hover
background: var(--anzhiyu-theme)
box-shadow: var(--anzhiyu-shadow-theme)
color: var(--anzhiyu-white)
#pagination a.extend.next:hover,
#pagination a.extend.prev:hover
color: var(--anzhiyu-theme)
border: var(--style-border-hover)
transform: scale(1.03)
nav#pagination
overflow: visible
#pagination .page-number.current
background: var(--anzhiyu-theme)
border: var(--style-border-hover)
box-shadow: var(--anzhiyu-shadow-theme)
#pagination a.extend.next
overflow: hidden
height: 2.5em
line-height: 2.5em
#pagination a.extend.next,
#pagination a.extend.prev
width: 5rem !important
line-height: 1.9rem !important
border-radius: 8px !important
background: var(--anzhiyu-card-bg)
box-shadow: var(--anzhiyu-shadow-border)
border: var(--style-border)
display: flex !important
align-items: center
justify-content: center
overflow: hidden
transition: all 0.3s, color 0s
position: absolute
#pagination .page-number
background: var(--anzhiyu-card-bg)
border-radius: 8px !important
margin: 0 0.3rem
box-shadow: var(--anzhiyu-shadow-border)
border: var(--style-border)
transition: 0.3s
#pagination .page-number:hover
color: var(--anzhiyu-theme)
border: var(--style-border-hover)
box-shadow: var(--anzhiyu-shadow-main)
#pagination .pagination
position: relative
display: flex
justify-content: center
#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: 0.3s
opacity: 0
#pagination a.extend.prev:hover .pagination_tips_prev
margin-right: 2px
opacity: 1
white-space: nowrap
a.extend.prev
left: 0
a.extend.next
right: 0
#pagination
overflow: hidden
margin-top: 1rem
width: 100%
+maxWidth768()
#site-name
padding: 0 !important
#pagination .pagination input
width: 2.5em
height: 2.5em
border-radius: 8px
border: var(--style-border-always)
transition: 0.3s
outline-style: none
font-size: 16px
padding-left: 12px
a#toPageButton
display: flex
position: absolute
width: 2.5em
height: 2.5em
right: 0px
top: 0px
border-radius: 8px
justify-content: center
align-items: center
transition: 0.3s
background: var(--anzhiyu-card-bg)
border: var(--style-border-always)
cursor: pointer
#pagination .pagination .toPageGroup:hover input,
#pagination .pagination .toPageGroup input:focus
border: var(--style-border-hover-always)
outline-style: none
width: 100px
#pagination .toPageGroup:hover a#toPageButton,
#pagination .toPageGroup:focus-within a#toPageButton
width: 30px
height: 30px
right: 4px
top: 5px
background: var(--anzhiyu-secondbg)
border: 1px solid var(--anzhiyu-none)
border-radius: 4px

View File

@@ -0,0 +1,547 @@
beautify()
headStyle(fontsize)
&:before
margin-left: unit((-(fontsize + 6)), 'px')
font-size: unit(fontsize, 'px')
&:hover
&:before
color: $light-blue
h1
headStyle(20)
h2
headStyle(18)
h3
headStyle(16)
h4
headStyle(14)
h5
headStyle(12)
h6
headStyle(12)
ol,
ul
p
margin: 0 0 8px
li
&::marker
color: $light-blue
font-weight: 600
font-size: 1.05em
&:hover
&::marker
color: var(--pseudo-hover)
blockquote {
border: var(--style-border-always);
background-color: var(--anzhiyu-secondbg);
color: var(--anzhiyu-secondtext);
border-radius: 8px;
margin: 1rem 0;
padding: 0.5rem 0.8rem;
}
#article-container
word-wrap: break-word
overflow-wrap: break-word
h1,
h2,
h3,
h4,
h5,
h6
.post-content
line-height: 1.6;
border-top: 1px dashed var(--anzhiyu-theme-op);
padding-top: 1.5rem;
padding-left: 0;
a
color: $theme-link-color
&:hover
text-decoration: underline
img
display: block
margin: 0 auto 20px
max-width: 100%
transition: .3s
border-radius: 8px
p
margin: 0 0 16px
iframe
margin: 0 0 20px
border-radius: 12px
kbd
margin: 0 3px
padding: 3px 5px
border: 1px solid #b4b4b4
border-radius: 3px
background-color: #f8f8f8
box-shadow: 0 1px 3px rgba(0, 0, 0, .25), 0 2px 1px 0 rgba(255, 255, 255, .6) inset
color: #34495e
white-space: nowrap
font-weight: 600
font-size: .9em
font-family: Monaco, 'Ubuntu Mono', monospace
line-height: 1em
h1
.headerlink
float: right;
opacity: 0.08;
position: relative;
padding: 0px;
border: none;
line-height: 2;
font-size: 2rem;
border-radius: 8px !important;
text-decoration: none;
font-weight: 700;
&::before
font-size: 2rem;
> :first-child:is(h2)
border-top: none;
padding-top: 0;
margin-top: 0;
h2
.headerlink
float: right;
opacity: 0.08;
position: relative;
padding: 0px;
border: none;
line-height: 2;
font-size: 1.8rem;
border-radius: 8px !important;
text-decoration: none;
font-weight: 700;
&::before
font-size: 1.8rem;
h3,h4,h5,h6
.headerlink
float: right;
opacity: 0.08;
position: relative;
padding: 0px;
border: none;
line-height: 2;
font-size: 1.3rem;
border-radius: 8px !important;
text-decoration: none;
font-weight: 700;
&::before
font-size: 1.3rem;
a.headerlink
&::before
if hexo-config('icons.fontawesome')
@extend .fontawesomeIcon
else
@extend .anzhiyufont
content: '\f0c1'
float: right
color: var(--headline-presudo)
transition: all .3s
&:hover
&:after
color: var(--pseudo-hover)
h1,
h2,
h3,
h4,
h5,
h6
&:hover
a.headerlink
&:after
opacity: 1
ol,
ul
ol,
ul
padding-left: 20px
li
margin: 4px 0
p
margin: 0 0 8px
if hexo-config('beautify.enable')
if hexo-config('beautify.field') == 'site'
beautify()
else if hexo-config('beautify.field') == 'post'
&.post-content
beautify()
> :last-child
margin-bottom: 0 !important
#post
+maxWidth768()
background: var(--anzhiyu-background) !important;
border: none;
#article-container
h2
if hexo-config("h2Divider")
border-top: 1px dashed var(--anzhiyu-theme-op);
padding-top: 1.5rem;
margin-top: 1.5rem;
.post_share
margin: 8px 0 0
width: fit-content
min-width 205px
.tag_share
display: flex
align-items: center;
justify-content: space-between;
width: 100%;
.post-meta
&__box
display: flex
flex-direction: column;
width: 100%;
&__tag-list,&__category-list
display: flex
width: 100%;
flex-wrap: wrap;
&__tags,&__categoryes
display: flex
align-items: center
justify-content: center
padding: 4px 12px
width: fit-content
border-radius: 8px
font-size: .85em
transition: all .2s ease-in-out
+maxWidth768()
margin: 4px 8px 4px 0 !important
&__tags
margin: 0px 8px 0px 0
&__categoryes
margin: 0px 8px 4px 0
&:hover
background: $light-blue
color: var(--white)
.social-share
font-size: .85em
.social-share-icon
margin: 0 4px
width: w = 1.85em
height: w
font-size: 1.2em
line-height: w
.post-copyright
background: var(--anzhiyu-secondbg);
padding: 1rem 1.3rem;
border: var(--style-border);
border-width: 1px;
transition: 0.3s;
position: relative;
margin: 80px 0 30px;
border-radius: 12px;
.copyright-cc-box
position: absolute;
right: 0;
overflow: hidden;
width: 100%;
height: 100%;
top: 0;
pointer-events: none;
&__author_box
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin-top: 1.5rem;
.post-copyright__author_img
width: 66px;
height: 66px;
margin: auto;
border-radius: 66px;
overflow: hidden;
position: absolute;
left: calc(50% - 33px);
top: -33px;
border: var(--style-border-always);
box-shadow: var(--anzhiyu-shadow-main);
&:hover
img.post-copyright__author_img_back
z-index: 21;
transform: translateY(0px);
if hexo-config('post_copyright.avatarSinks')
img.post-copyright__author_img_front
transform: translateY(3px);
img.post-copyright__author_img_front
z-index: 20;
transition: .3s
img.post-copyright__author_img_back
border-radius: 66px;
z-index: 10;
transition: .3s
img
position: absolute;
bottom: 0;
left: 0;
.post-copyright__author_name
text-align: center;
font-size: 20px;
font-weight: 700;
color: var(--anzhiyu-fontcolor);
line-height: 1;
.post-copyright__author_desc
text-align: center;
font-size: 14px;
color: var(--anzhiyu-secondtext);
margin-top: 4px;
&__post__info
display: flex;
align-items: center;
justify-content: center;
margin-top: 0.2rem;
&__original,&__reprint
background: var(--anzhiyu-main);
color: var(--anzhiyu-wihite-font);
padding: 0.2rem 1rem;
font-size: .8rem;
border-radius: 8px;
margin-right: 0.5rem;
font-weight: bold;
line-height: 1.5;
white-space: nowrap;
user-select: none;
.anzhiyufont.anzhiyu-icon-copyright
position: absolute
font-size: 1.3em
top: -71px;
right: -20px;
font-size: 8.3em;
z-index: -1;
color: var(--anzhiyu-main)
@media screen and (min-width: 1365px)
z-index: 0;
&-title
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 500
max-width: 70%;
span
cursor pointer
&:hover
color: var(--anzhiyu-fontcolor)
.post-copyright__notice
font-size: 12px;
.post-copyright-info
padding-left: 0;
color: var(--anzhiyu-secondtext);
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-align: center;
+maxWidth768()
-webkit-line-clamp: 2;
a
&:hover
color: var(--anzhiyu-main)
.post-outdate-notice
position: relative
margin: 0 0 20px
padding: .5em 1.2em
border-radius: 3px
background-color: $noticeOutdate-bg
color: $noticeOutdate-color
if hexo-config('noticeOutdate.style') == 'flat'
padding: .5em 1em .5em 2.6em
border-left: 5px solid $noticeOutdate-border
&:before
if hexo-config('icons.fontawesome')
@extend .fontawesomeIcon
content: '\f071'
else
@extend .anzhiyufont
content: '\e66f'
position: absolute
top: 50%
left: .9em
color: $noticeOutdate-border
transform: translateY(-50%)
.ads-wrap
margin: 40px 0
#content-inner.layout #article-container
h1,
h2,
h3,
h4,
h5,
h6
padding-left: 0;
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row-reverse;
.post-ai-description
background: var(--anzhiyu-secondbg);
border-radius: 12px;
padding: 12px 16px;
line-height: 1.3;
border: var(--style-border-always);
margin-bottom: 10px;
.ai-title
display: flex;
color: var(--font-color);
border-radius: 8px;
align-items: center;
padding: 0 5px;
i
font-weight: 800;
font-size: 20px;
line-height: 20px;
height 20px
.anzhiyufont.anzhiyu-icon-circle-dot
margin-left: auto;
margin-right: 4px;
font-size: 14px;
opacity: 0;
&:active
transform: scale(0.97);
.anzhiyufont.anzhiyu-icon-arrow-rotate-right
font-size: 14px;
margin-left: 4px
cursor pointer
.ai-title-text
font-weight: bold;
margin-left: 8px;
#ai-tag
font-size: 12px;
background-color: var(--anzhiyu-lighttext);
color: rgba(255, 255, 255, 0.9);
border-radius: 4px;
line-height: 1;
padding: 4px 5px;
cursor pointer
#ai-Toggle
font-size: 12px;
background: var(--anzhiyu-lighttext);
color: var(--anzhiyu-card-bg);
padding: 4px;
border-radius: 4px;
margin-left: 6px;
transform: scale(0.8);
cursor: pointer;
transition: 0.3s;
font-weight: bold;
&:hover
background: var(--anzhiyu-fontcolor);
color: var(--anzhiyu-card-bg);
#go-tianli-blog
display: none
.ai-explanation
margin-top: 12px;
padding: 8px 12px;
background: var(--anzhiyu-card-bg);
border-radius: 8px;
border: var(--style-border-always);
font-size: 15px;
line-height: 1.4;
.ai-cursor
display: inline-block;
width: 7px;
background: #333;
height: 16px;
margin-bottom: -2px;
opacity: 0.95;
margin-left: 3px;
transition: all 0.3s;
[data-theme="dark"] .ai-cursor
background: rgb(255, 255, 255, 0.9);
.ai-btn-box
font-size: 15.5px;
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
.ai-btn-item
padding: 5px 10px;
margin: 10px 16px 0px 5px;
width: fit-content;
line-height: 1;
background: var(--anzhiyu-main)
color: #fff;
border-radius: 6px;
user-select: none;
transition: all 0.3s;
cursor: pointer;
&:hover
background: var(--anzhiyu-theme);
.ai-recommend
display: flex;
flex-direction: row;
flex-wrap: wrap;
.ai-recommend-item
width: calc(50% - 20px);
margin: 10px;
background: var(--anzhiyu-secondbg);
border-radius: 4px;
padding: 10px;
cursor pointer
transition: .3s;
animation: slide-in 0.6s 0.1s backwards;
span.index
padding: 4px
&:hover
color: var(--anzhiyu-white);
background: var(--anzhiyu-theme);
a
color: var(--anzhiyu-white);
+maxWidth768()
.ai-btn-box
justify-content: center;
.ai-recommend .ai-recommend-item
width: 100%;

View File

@@ -0,0 +1,110 @@
if hexo-config('ptool.enable') == true
.post-tools
display: flex;
width: 100%;
justify-content: space-between;
flex-wrap: wrap;
-webkit-user-select: none;
flex-direction: column;
align-items: center;
.post-tools-left
white-space: nowrap;
display: flex;
text-overflow: ellipsis;
flex-wrap: wrap;
margin-bottom: 0.5rem;
justify-content: center;
.rewardLeftButton, .shareRight
display: flex
margin: 10px
+maxWidth768()
margin-top: 1rem;
justify-content: center;
width: 100%;
> div
margin: 8px;
.post-tools-right
padding-right: 0px;
display: flex;
align-items: center;
margin-bottom: 0.5rem;
+maxWidth768()
flex-direction: column;
.share-link
margin-left: 0.5rem;
display: flex;
justify-content: center;
position: relative;
text-align: center;
&.mobile:hover
.share-button
background: var(--anzhiyu-green);
border-color: var(--anzhiyu-green);
box-shadow: var(--anzhiyu-shadow-green);
color: var(--anzhiyu-white);
.share-main
opacity: 1;
transform: translateY(0);
.share-qrcode
display: flex;
justify-content: center;
.share-button
background: var(--anzhiyu-card-bg);
border: var(--style-border);
color: var(--anzhiyu-fontcolor);
border-radius: 8px;
cursor: pointer;
transition: 0.3s;
width: 56px;
height: 40px;
&:hover
background: var(--anzhiyu-main);
border-color: var(--anzhiyu-main);
color: var(--anzhiyu-white);
transition: 0.3s;
box-shadow: var(--anzhiyu-shadow-blue);
i
line-height: 38px;
font-size: 1.1rem;
.share-main
position: absolute;
bottom: 40px;
z-index: 100;
padding-bottom: 15px;
opacity: 0;
pointer-events: none;
transition: 0.3s;
transform: translateY(8px);
.share-main-all
padding: 12px;
border-radius: 12px;
background: var(--anzhiyu-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(--anzhiyu-white);
padding: 8px;
border-radius: 8px;
margin-bottom: 8px;
border: var(--style-border-always);
.reward-dec
font-size: 12px;
if hexo-config('ptool.enable') == true && !hexo-config('ptool.mode')
.post-tools .post-tools-left > div
margin: 0
.post-tools .post-tools-left
width auto
if hexo-config('ptool.enable') == true && hexo-config('ptool.categories')
#post .tag_share
margin-bottom: 2rem
flex-direction: column;

View File

@@ -0,0 +1,43 @@
.relatedPosts
margin-top: 1.25rem
& > .headline
margin-bottom: 5px
font-weight: 700
font-size: 1.43em
& > .relatedPosts-list
& > div
position: relative
display: inline-block
overflow: hidden
margin: 3px
width: calc(33.333% - 6px)
height: 200px
background: $dark-black
vertical-align: bottom
@extend .postImgHover
+maxWidth768()
margin: 2px
width: calc(50% - 4px)
height: 150px
+maxWidth600()
width: calc(100% - 4px)
.content
position: absolute
top: 50%
padding: 0 20px
width: 100%
transform: translate(0, -50%)
.date
color: var(--light-grey)
font-size: 90%
.title
@extend .limit-more-line
color: var(--white)
-webkit-line-clamp: 2

View File

@@ -0,0 +1,145 @@
.post-reward
position: relative;
text-align: center;
margin-top: 0rem;
display: flex;
justify-content: center;
&:hover
.reward-button
color: var(--anzhiyu-white);
background: var(--anzhiyu-theme);
box-shadow: none;
.reward-main
display: flex !important;
justify-content: left;
& > *
pointer-events: auto
.reward-button
border-radius: 8px
background: var(--anzhiyu-red);
color: var(--anzhiyu-white);
padding: 0;
margin-right: 0.5rem;
width: 126px;
height: 40px;
line-height: 39px;
box-shadow: var(--anzhiyu-shadow-red);
display: inline-block;
cursor: pointer;
transition: all 0.4s ease 0s;
.reward-main
position: absolute;
bottom: 40px;
if hexo-config('ptool.enable') == true && hexo-config('ptool.mode')
left: 0;
else
left: -70%;
z-index: 90;
display: none;
padding: 0px 0px 15px;
width: 100%;
.reward-all
border-radius: 12px;
background: var(--anzhiyu-background);
border: var(--style-border-always);
padding: 0.8rem;
display: flex;
margin: 0px;
box-shadow: var(--anzhiyu-shadow-border);
flex-direction: column;
align-items: center;
&::before
position: absolute;
bottom: -10px;
left: 0px;
width: 100%;
height: 20px;
content: "";
.reward-title
font-weight: bold;
color: var(--anzhiyu-red);
.reward-group
display: flex;
margin-top: 0.5rem;
padding: 0;
.reward-item
display: inline-block;
padding: 0px 8px;
list-style-type: none;
vertical-align: top;
.post-qr-code-img
box-shadow: var(--anzhiyu-shadow-lightblack);
border-radius: 12px;
border: var(--style-border-always);
.post-qr-code-desc
padding-top: 0rem;
margin-top: -8px;
margin-bottom: 8px;
img
width: 130px;
height: 130px;
max-width: fit-content
&:first-child img
border-color: var(--anzhiyu-green);
&:last-child img
border-color: var(--anzhiyu-blue);
.reward-main-btn
background: var(--anzhiyu-secondbg);
color: var(--anzhiyu-fontcolor);
display: flex;
flex-direction: column;
border-radius: 12px;
padding: 4px 0;
border: var(--style-border-always);
margin: 8px;
width: 100%;
&:hover
color: var(--anzhiyu-white);
background: var(--anzhiyu-red);
box-shadow: var(--anzhiyu-shadow-red);
.reward-text
margin-bottom: 0rem;
font-weight: bold;
.reward-dec
font-size: 12px;
.reward-link.mode
background: var(--anzhiyu-green);
color: var(--anzhiyu-white);
padding: 0;
width: 173px;
height: 40px;
line-height: 39px;
box-shadow: var(--anzhiyu-shadow-green);
border-radius: 8px;
text-align: center;
transition: 0.3s;
&:hover
background: var(--anzhiyu-theme);
box-shadow: none;
a
color: var(--anzhiyu-white);
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
i
margin-right: 4px;
#quit-box
position: fixed;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, .2);
top: 0;
left: 0;
display: none;
z-index: 101;
margin: 0;

View File

@@ -0,0 +1,89 @@
/* rightMenu */
#rightMenu {
display: none;
position: fixed;
padding: 0 0.25rem;
width: 11rem;
height: fit-content;
top: 10%;
left: 10%;
background-color: var(--anzhiyu-card-bg);
color: var(--anzhiyu-fontcolor);
border-radius: 12px;
z-index: 10002;
border: var(--style-border);
user-select: none;
}
#rightMenu a {
color: var(--anzhiyu-fontcolor);
}
#rightMenu:hover {
border: var(--style-border-hover);
box-shadow: var(--anzhiyu-shadow-theme);
}
#rightMenu .rightMenu-group {
padding: 0.35rem 0.3rem;
}
#rightMenu .rightMenu-group:not(:nth-last-child(1)) {
border-bottom: 2px dashed var(--anzhiyu-theme-op);
}
#rightMenu .rightMenu-group.rightMenu-small {
display: flex;
justify-content: space-between;
}
#rightMenu .rightMenu-group .rightMenu-item {
border-radius: 8px;
transition: 0.1s;
cursor: pointer;
padding: 0 6px;
}
#rightMenu .rightMenu-line .rightMenu-item {
margin: 0.25rem 0;
padding: 0.25rem 0;
}
#rightMenu .rightMenu-group.rightMenu-line .rightMenu-item {
display: flex;
align-items: center;
padding: 8px;
}
#rightMenu .rightMenu-group .rightMenu-item:hover {
background-color: var(--anzhiyu-main);
color: var(--anzhiyu-white);
box-shadow: var(--anzhiyu-shadow-theme);
}
#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: 1.1rem;
}
#rightMenu .rightMenu-line .rightMenu-item i {
margin: 0 0.5rem 0 0.25rem;
}
#rightMenu .rightMenu-group .rightMenu-item span {
line-height: 1.5rem;
}
#rightmenu-mask {
position: fixed;
width: 100vw;
height: 100vh;
background: none;
/* background: var(--anzhiyu-maskbg); */
top: 0;
left: 0;
display: none;
z-index: 10001;
margin: 0 !important;
}
@media screen and (max-width: 768px) {
:root {
--style-border: 1px solid var(--anzhiyu-card-border);
--style-border-hover: 1px solid var(--anzhiyu-theme);
}
}

View File

@@ -0,0 +1,55 @@
#rightside
position: fixed
right: -48px
bottom: $rightside-bottom
z-index: 100
opacity: 0
transition: all .5s
+maxWidth768()
#switch-commentBarrage
display: none
i
font-size: 1rem
#rightside-config-hide
height: 0
opacity: 0
transition: transform .4s
transform: translate(45px, 0)
&.show
height: auto
opacity: 1
transform: translate(0, 0)
&.status
height: auto
opacity: 1
& > div
& > button,
& > a
display: block
margin-bottom: 5px
width: w = 35px
height: w
border-radius: 5px
background-color: var(--btn-bg)
color: var(--btn-color)
text-align: center
font-size: 16px
line-height: w
&:hover
background-color: var(--btn-hover-color)
#mobile-toc-button
display: none
+maxWidth900()
display: block
+maxWidth900()
#hide-aside-btn
display: none

View File

@@ -0,0 +1,57 @@
#keyboard-tips
position: fixed;
top: 80px;
left: 20px;
z-index: 999;
background: var(--anzhiyu-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);
transform: translateZ(0);
pointer-events: none;
box-shadow: var(--anzhiyu-shadow-border);
opacity: 0;
transition: 0.3s;
+maxWidth768()
display: none !important
&.show
opacity: 1;
transition: 0.1s;
.keyboardTitle
font-size: 12px;
color: var(--anzhiyu-secondtext);
line-height: 1;
.keybordList
display: flex;
flex-direction: column;
margin-top: 8px;
.keybordItem
display: flex;
margin-top: 4px;
.keyGroup
display: flex;
align-items: center;
width: 90px;
.key
padding: 0.2em 0.4em;
font-family: inherit;
background-color: var(--anzhiyu-card-bg);
color: var(--anzhiyu-fontcolor);
border: var(--style-border);
border-color: var(--anzhiyu-secondtext);
border-bottom: 2px solid var(--anzhiyu-secondtext);
box-shadow: var(--anzhiyu-shadow-border);
border-radius: 0.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;

View File

@@ -0,0 +1,412 @@
#menu-mask
position: fixed
z-index: 102
display: none
width: 100%
height: 100%
background: var(--anzhiyu-maskbg);
backdrop-filter: saturate(180%) blur(20px);
-webkit-backdrop-filter: blur(20px);
transform: translateZ(0);
animation: .6s ease 0s 1 normal none running to_show;
-webkit-transform-style: preserve-3d;
#sidebar
position: absolute;
top: 0;
#sidebar-menus
position: fixed
top: 0;
right: -300px;
z-index: 103;
overflow: hidden auto;
width: 300px;
height: 100%;
background: var(--anzhiyu-background);
transition: all .5s ease 0s;
padding-top: 30px;
border-left: var(--style-border-always);
.sidebar-menu-item a.menu-child span
margin-left: 10px;
.back-menu-list-groups
padding: 0 16px;
.back-menu-list-title
font-size: 12px;
color: var(--anzhiyu-secondtext);
.back-menu-list
width: calc(100% + 16px);
justify-content: flex-start;
margin: 0 -8px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
.back-menu-item
width: calc(50% - 16px);
background: var(--anzhiyu-card-bg);
border: var(--style-border-always);
border-radius: 8px;
display: flex;
align-items: center;
margin: 4px 8px;
padding: 4px 8px;
transition: .3s;
.sidebar-menu-item
display: flex;
flex-direction: column;
padding: 0 16px;
margin-bottom: 6px;
a.darkmode_switchbutton
padding: 4px 8px;
cursor: pointer;
margin: 0;
font-size: .9rem;
color: var(--anzhiyu-fontcolor);
width: 100%;
background: var(--anzhiyu-card-bg);
border-radius: 8px;
border: var(--style-border-always);
display: flex;
align-items: center;
font-size: 14px;
span.sidebar-menu-item-title
font-size: 12px;
color: var(--anzhiyu-secondtext);
margin-left: 16px;
.card-tag-cloud
padding: 0 11px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 60px;
a
color: var(--anzhiyu-fontcolor);
padding: 2px 8px 2px 12px;
margin: 4px;
border-radius: 8px;
border: var(--style-border-always);
background: var(--anzhiyu-card-bg);
sup
opacity: .6;
margin-left: 4px;
&.open
transform: translate3d(-100%,0,0);
.sidebar-site-data
padding: 0 10px
hr
margin: 20px auto
.menus_items
padding: 0 10px
.site-page
@extend .limit-one-line
display: flex;
font-size: 12px;
position: relative
padding-left: .3rem
color: var(--anzhiyu-fontcolor)
i:first-child
width: 15%
text-align: left
max-height: 20px;
font-size: 16px;
&.group
& > i:last-child
position: absolute
top: .78em
right: 18px
transition: transform .3s
&.hide
& > i:last-child
transform: rotate(90deg)
& + .menus_item_child
display: none
.menus_item_child
margin: 0
list-style: none
.site-page.child
background: var(--anzhiyu-card-bg);
/* tags */
#aside-content .card-tag-cloud a {
border-radius: var(--anzhiyu-border-radius);
display: inline-block;
margin-right: 4px;
}
#aside-content .card-tag-cloud a:hover {
background: var(--anzhiyu-theme);
color: var(--anzhiyu-white) !important;
box-shadow: var(--anzhiyu-shadow-theme);
}
@media screen and (min-width: 1200px) {
#aside-content .card-tag-cloud a:active {
transform: scale(0.97);
}
}
#aside-content .card-tag-cloud a sup {
opacity: 0.4;
margin-left: 2px;
}
/* */
span.card-archive-list-count {
width: auto;
text-align: left;
font-size: 1.5rem;
line-height: 0.9;
font-weight: 700;
}
.card-archive-list-count-group {
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;
}
span.card-archive-list-count {
width: auto;
text-align: left;
font-size: 1.1rem;
line-height: 0.9;
font-weight: 700;
}
.card-archive-list-date,
span.card-category-list-name {
font-size: 13px;
opacity: 0.6;
}
li.card-archive-list-item,
li.card-category-list-item {
width: 100%;
flex: 0 0 48%;
}
#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(--anzhiyu-white);
background-color: var(--anzhiyu-theme);
border-radius: var(--anzhiyu-border-radius);
border: 1px solid transparent;
}
@media screen and (min-width: 1200px) {
#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,
#aside-content .card-categories ul.card-category-list > .card-category-list-item a {
border-radius: var(--anzhiyu-border-radius);
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;
flex: inherit;
}
#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;
}
/* card */
#aside-content .card-info #card-info-btn {
border-radius: var(--anzhiyu-border-radius);
}
/* */
#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: 700;
padding: 2px 0;
width: 100%;
height: 100%;
display: -webkit-box;
}
#aside-content .aside-list > .aside-list-item {
padding: 8px;
padding-top: 6px !important;
padding-bottom: 6px !important;
border-radius: 12px;
transition: 0.3s;
margin: 6px 0;
cursor: pointer;
}
@media screen and (min-width: 1200px) {
#aside-content .aside-list > .aside-list-item:hover {
transform: scale(1.03);
}
#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:not(:last-child) {
border-bottom: 0 dashed var(--anzhiyu-background) !important;
}
#aside-content .aside-list > .aside-list-item .thumbnail {
border-radius: var(--anzhiyu-border-radius);
border: var(--style-border);
}
#aside-content .aside-list > .aside-list-item:hover {
background: var(--anzhiyu-main);
color: var(--anzhiyu-white);
transition: 0.3s;
box-shadow: var(--anzhiyu-shadow-main);
}
#aside-content .aside-list > .aside-list-item:hover a {
color: var(--anzhiyu-white) !important;
}
.card-widget.card-recent-post {
padding: 0.4rem 1rem !important;
}
/* toc */
#aside-content #card-toc .toc-content .toc-link.active {
border-radius: var(--anzhiyu-border-radius);
}
#aside-content #card-toc .toc-content {
overflow-y: auto;
}
#aside-content #card-toc span.toc-number {
display: none;
}
#aside-content #card-toc .toc-content .toc-link.active {
line-height: 1.2;
border-radius: 12px;
border-left-color: var(--anzhiyu-hovertext);
background-color: var(--anzhiyu-card-bg);
color: var(--anzhiyu-lighttext);
font-weight: 700;
font-size: 20px;
}
[data-theme="dark"].toc .toc-item.active .toc-link .toc-text {
color: var(--anzhiyu-white);
}
#aside-content #card-toc .toc-content .toc-item.active .toc-link {
opacity: 1;
border-radius: 8px;
}
#aside-content #card-toc .toc-content .toc-link {
line-height: 1.2;
padding: 8px;
border-left: 0 solid transparent;
border-radius: 12px;
color: var(--anzhiyu-secondtext);
cursor: default;
}
#aside-content #card-toc .toc-content .toc-link:not(.active) span {
opacity: 0.6;
cursor: pointer;
filter: blur(1px);
transition: 0.3s;
}
#aside-content #card-toc:hover .toc-content .toc-link:not(.active) span {
filter: blur(0);
opacity: 1;
}
#aside-content #card-toc .toc-content .toc-link:not(.active) span:hover {
color: var(--anzhiyu-lighttext);
}
.site-data > a .headline,
.site-data > a .length-num {
color: var(--anzhiyu-white);
}
#sidebar-menus.open .site-data > a .headline,
#sidebar-menus.open .site-data > a .length-num {
color: var(--anzhiyu-fontcolor);
}
@media screen and (min-width: 900px) {
#aside-content .sticky_layout {
top: 60px;
}
.post #aside-content .sticky_layout {
top: 80px;
}
}
/* */
@media screen and (min-width: 900px) {
#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 {
padding: 3px 10px;
}
}
#aside-content .card-widget {
border-radius: 12px;
transition: 0.3s;
}
#aside-content .card-widget {
box-shadow: var(--anzhiyu-shadow-border);
background: var(--anzhiyu-card-bg);
border: var(--style-border);
transition: 0.3s;
}
#aside-content hr {
display: flex;
position: relative;
margin: 1rem 0;
border: 1px dashed var(--anzhiyu-theme-op);
}
#aside-content hr:before {
content: none;
}
#article-container hr:before {
content: none;
}
#anMusic-page-meting
+maxWidth768()
.aplayer.aplayer-withlist .aplayer-list
opacity: 0
#body-wrap
&.open
transition-property: transform, border-radius;
transition-duration: 0ms;
transform-origin: 0 46%;
transform: translate3d(300px, 0px, 0px) scale3d(0.86, 0.86, 1);
border-radius: 12px
transition: 0.3s ease-out;
z-index 2
#menu-mask
display: block
#post-top-cover
display: none
overflow-y: overlay;
transition: 0s
border-radius: 12px;
#anMusic-page-meting .aplayer.aplayer-withlist .aplayer-list
display: none

View File

@@ -0,0 +1,109 @@
#vcomment
font-size: 1.1em
.vbtn
border: none
background: var(--btn-bg)
color: var(--btn-color)
&:hover
background: var(--btn-hover-color)
.vimg
transition: all .3s
&:hover
transform: rotate(360deg)
.vcards .vcard .vcontent.expand
&:before,
&:after
z-index: 22
#waline-wrap
--waline-font-size: 1.1em
--waline-theme-color: $button-bg
--waline-active-color: $button-hover-color
.vuser
transition: all .5s
&:hover
transform: rotate(360deg)
if hexo-config('valine.bg')
#vcomment
textarea
background: url(hexo-config('valine.bg')) 100% 100% no-repeat
&:focus
background-image: none
if hexo-config('waline.bg')
#waline-wrap
textarea
background: url(hexo-config('waline.bg')) 100% 100% no-repeat
&:focus
background-image: none
.fireworks
position: fixed
top: 0
left: 0
z-index: $fireworks-zIndex
pointer-events: none
.medium-zoom-image--opened
z-index: 99999 !important
margin: 0 !important
.medium-zoom-overlay
z-index: 99999 !important
.mermaid-wrap
margin: 0 0 20px
text-align: center
& > svg
height: 100%
.fb-comments iframe
width: 100% !important
.katex-wrap
overflow: auto
if hexo-config('katex') && hexo-config('katex.hide_scrollbar')
&::-webkit-scrollbar
display: none
// mathjax
mjx-container[display],
.has-jax
overflow-x: auto
overflow-y: hidden
line-height: normal !important
.aplayer
color: $font-black
#article-container
.aplayer
margin: 0 0 20px
if hexo-config('beautify.enable')
ol,
ul
margin: 0
padding: 0
li
margin: 0
padding: 0 15px
&:before
content: none
.snackbar-css
border-radius: 5px !important