fix theme...
This commit is contained in:
69
themes/anzhiyu/source/css/_page/404.styl
Normal file
69
themes/anzhiyu/source/css/_page/404.styl
Normal file
@@ -0,0 +1,69 @@
|
||||
if hexo-config('error_404.enable')
|
||||
.error404
|
||||
#error-wrap
|
||||
position: absolute
|
||||
top: 50%
|
||||
right: 0
|
||||
left: 0
|
||||
margin: 0 auto
|
||||
padding: 60px 20px 0
|
||||
max-width: 1000px
|
||||
transform: translate(0, -50%)
|
||||
|
||||
.error-content
|
||||
@extend .cardHover
|
||||
overflow: hidden
|
||||
margin: 0 20px
|
||||
height: 360px
|
||||
|
||||
+maxWidth768()
|
||||
margin: 0
|
||||
height: 500px
|
||||
|
||||
.error-img
|
||||
display: inline-block
|
||||
overflow: hidden
|
||||
width: 50%
|
||||
height: 100%
|
||||
|
||||
+maxWidth768()
|
||||
width: 100%
|
||||
height: 45%
|
||||
|
||||
img
|
||||
@extend .imgHover
|
||||
background-color: $theme-color
|
||||
|
||||
.error-info
|
||||
display: inline-flex
|
||||
flex-direction: column
|
||||
justify-content: center
|
||||
align-content: center
|
||||
width: 50%
|
||||
height: 100%
|
||||
vertical-align: top
|
||||
text-align: center
|
||||
|
||||
if $site-name-font
|
||||
font-family: $site-name-font
|
||||
|
||||
+maxWidth768()
|
||||
width: 100%
|
||||
height: 55%
|
||||
|
||||
.error_title
|
||||
margin-top: -.6em
|
||||
font-size: 9em
|
||||
|
||||
+maxWidth768()
|
||||
font-size: 8em
|
||||
|
||||
.error_subtitle
|
||||
@extend .limit-more-line
|
||||
margin-top: -3em
|
||||
word-break: break-word
|
||||
font-size: 1.6em
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
& + #rightside
|
||||
display: none
|
||||
1276
themes/anzhiyu/source/css/_page/about.styl
Normal file
1276
themes/anzhiyu/source/css/_page/about.styl
Normal file
File diff suppressed because it is too large
Load Diff
113
themes/anzhiyu/source/css/_page/archives.styl
Normal file
113
themes/anzhiyu/source/css/_page/archives.styl
Normal file
@@ -0,0 +1,113 @@
|
||||
.article-sort
|
||||
margin: .25rem
|
||||
&-title
|
||||
margin: 0.25rem;
|
||||
padding: 0;
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
font-size: 2em;
|
||||
|
||||
&-item
|
||||
position: relative
|
||||
display: flex
|
||||
align-items: center
|
||||
transition: all 0.2s ease-in-out 0s;
|
||||
border: none;
|
||||
margin: 0 0 1rem 0rem;
|
||||
overflow: hidden;
|
||||
border-radius: 12px;
|
||||
|
||||
&.no-article-cover
|
||||
height: 80px
|
||||
|
||||
.article-sort-item-info
|
||||
padding: 0
|
||||
|
||||
&.year
|
||||
font-size: 1rem;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $light-blue
|
||||
|
||||
&:before
|
||||
border-color: var(--pseudo-hover)
|
||||
|
||||
&-time
|
||||
color: $theme-meta-color
|
||||
font-size: 95%
|
||||
|
||||
time
|
||||
padding-left: 6px
|
||||
cursor: default
|
||||
|
||||
&-title
|
||||
@extend .limit-more-line
|
||||
color: var(--font-color)
|
||||
font-size: 1.1em
|
||||
transition: all .3s
|
||||
-webkit-line-clamp: 1
|
||||
margin-right: auto;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
order: 0;
|
||||
font-weight: bold;
|
||||
line-height: 1.3;
|
||||
|
||||
&:hover
|
||||
color: var(--anzhiyu-lighttext)
|
||||
&-index
|
||||
opacity: .5
|
||||
position: absolute
|
||||
top: .5rem
|
||||
right: .5rem
|
||||
font-style: italic
|
||||
font-size: 2.5rem
|
||||
line-height: 1.5rem
|
||||
|
||||
&-img
|
||||
overflow: hidden
|
||||
width: 151px
|
||||
height: 80px
|
||||
border-radius: 12px;
|
||||
min-width: 151px;
|
||||
min-height: 80px;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
-webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0));
|
||||
|
||||
img
|
||||
@extend .imgHover
|
||||
|
||||
&-info
|
||||
padding: 0 0.8rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-height: 80px;
|
||||
height: 80px;
|
||||
justify-content: space-between;
|
||||
.article-sort-item-index
|
||||
+maxWidth768()
|
||||
display: none
|
||||
.article-sort-item-title
|
||||
height: 30%;
|
||||
+maxWidth768()
|
||||
font-size: .9em;
|
||||
height: 25%;
|
||||
.article-meta-wrap
|
||||
height: 35%;
|
||||
.article-sort-item-tags a
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
transition: 0.3s;
|
||||
margin-right: auto;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding: 0 0.2rem;
|
||||
padding-left: 0;
|
||||
span
|
||||
font-size: 12px;
|
||||
margin-right: 1px;
|
||||
pointer-events: none
|
||||
.article-sort-item-time
|
||||
font-size: 12px;
|
||||
37
themes/anzhiyu/source/css/_page/categories.styl
Normal file
37
themes/anzhiyu/source/css/_page/categories.styl
Normal file
@@ -0,0 +1,37 @@
|
||||
.category-lists
|
||||
.category-title
|
||||
font-size: 2.57em
|
||||
|
||||
+maxWidth768()
|
||||
font-size: 2em
|
||||
|
||||
.category-list
|
||||
margin-bottom: 0
|
||||
|
||||
a
|
||||
color: var(--font-color)
|
||||
|
||||
&:hover
|
||||
color: $text-hover
|
||||
|
||||
.category-list-count
|
||||
margin-left: 8px
|
||||
color: $theme-meta-color
|
||||
|
||||
&:before
|
||||
content: '('
|
||||
|
||||
&:after
|
||||
content: ')'
|
||||
|
||||
ul
|
||||
padding: 0 0 0 20px
|
||||
@extend .list-beauty
|
||||
|
||||
ul
|
||||
padding-left: 4px
|
||||
|
||||
li
|
||||
position: relative
|
||||
margin: 6px 0
|
||||
padding: .12em .4em .12em 1.4em
|
||||
81
themes/anzhiyu/source/css/_page/common.styl
Normal file
81
themes/anzhiyu/source/css/_page/common.styl
Normal file
@@ -0,0 +1,81 @@
|
||||
.post .layout#content-inner
|
||||
+maxWidth768()
|
||||
background: var(--anzhiyu-main);
|
||||
#body-wrap
|
||||
display: flex
|
||||
flex-direction: column
|
||||
min-height: 100vh
|
||||
justify-content: space-between;
|
||||
+maxWidth768()
|
||||
.layout
|
||||
padding: 0;
|
||||
#archive
|
||||
background: var(--anzhiyu-background)
|
||||
border: none
|
||||
padding-top: 0px
|
||||
|
||||
.layout
|
||||
display: flex
|
||||
flex: 1 auto
|
||||
margin: 0 auto
|
||||
padding: 1.25rem 1.5rem
|
||||
max-width: 1200px
|
||||
width: 100%
|
||||
justify-content: center;
|
||||
|
||||
+maxWidth1200()
|
||||
flex-direction: column
|
||||
padding-top: 10px
|
||||
|
||||
+maxWidth768()
|
||||
padding: 20px 15px;
|
||||
z-index: 3
|
||||
|
||||
+minWidth2000()
|
||||
max-width: 1700px
|
||||
|
||||
& > div:first-child:not(.recent-posts)
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
padding: 2rem 2.5rem;
|
||||
border-radius: 12px;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border: var(--style-border);
|
||||
width: calc(100% - 300px);
|
||||
align-self: flex-start;
|
||||
animation: slide-in 0.6s 0.1s backwards;
|
||||
|
||||
+maxWidth768()
|
||||
padding: 1rem 1rem;
|
||||
box-shadow: none;
|
||||
background: var(--anzhiyu-background);
|
||||
|
||||
& > div:first-child
|
||||
width: calc(100% - 300px)
|
||||
transition: all .3s ease 0s
|
||||
|
||||
+maxWidth900()
|
||||
width: 100% !important
|
||||
|
||||
if hexo-config('aside.position') == 'left'
|
||||
+minWidth900()
|
||||
order: 2
|
||||
|
||||
// 隱藏aside
|
||||
&.hide-aside
|
||||
max-width: 1000px
|
||||
|
||||
+minWidth2000()
|
||||
max-width: 1200px
|
||||
|
||||
& > div
|
||||
width: 100% !important
|
||||
|
||||
// for apple device
|
||||
.apple
|
||||
#page-header.full_page
|
||||
background-attachment: scroll !important
|
||||
|
||||
.recent-post-item,
|
||||
.avatar-img,
|
||||
.flink-item-icon
|
||||
transform: translateZ(0)
|
||||
105
themes/anzhiyu/source/css/_page/equipment.styl
Normal file
105
themes/anzhiyu/source/css/_page/equipment.styl
Normal file
@@ -0,0 +1,105 @@
|
||||
// 我的装备
|
||||
.goodthings-title
|
||||
margin: 1rem 0
|
||||
line-height: 1;
|
||||
.equipment-item
|
||||
.equipment-item-content
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
margin: 0 -8px
|
||||
.equipment-item-content-item
|
||||
width: calc(25% - 12px)
|
||||
border-radius: 12px
|
||||
border: var(--style-border-always)
|
||||
overflow: hidden
|
||||
margin: 8px 6px
|
||||
background: var(--anzhiyu-card-bg)
|
||||
box-shadow: var(--anzhiyu-shadow-border)
|
||||
min-height: 400px
|
||||
position: relative
|
||||
+maxWidth1200()
|
||||
width: calc(50% - 12px)
|
||||
+maxWidth768()
|
||||
width: 100%
|
||||
|
||||
.equipment-item-content-item-info
|
||||
padding: 8px 16px 16px 16px
|
||||
margin-top: 12px
|
||||
|
||||
.equipment-item-content-item-name
|
||||
font-size: 18px
|
||||
font-weight: bold
|
||||
line-height: 1
|
||||
margin-bottom: 8px
|
||||
white-space: nowrap
|
||||
overflow: hidden
|
||||
text-overflow: ellipsis
|
||||
width: fit-content
|
||||
cursor pointer
|
||||
&:hover
|
||||
color: var(--anzhiyu-main)
|
||||
|
||||
.equipment-item-content-item-specification
|
||||
font-size: 12px
|
||||
color: var(--anzhiyu-secondtext)
|
||||
line-height: 16px
|
||||
margin-bottom: 5px
|
||||
white-space: nowrap
|
||||
overflow: hidden
|
||||
text-overflow: ellipsis
|
||||
|
||||
.equipment-item-content-item-description
|
||||
line-height: 20px
|
||||
color: var(--anzhiyu-secondtext)
|
||||
height: 60px
|
||||
display: -webkit-box
|
||||
overflow: hidden
|
||||
-webkit-line-clamp: 3
|
||||
-webkit-box-orient: vertical
|
||||
font-size: 14px
|
||||
|
||||
a.equipment-item-content-item-link
|
||||
font-size: 12px
|
||||
background: var(--anzhiyu-gray-op)
|
||||
padding: 4px 8px
|
||||
border-radius: 8px
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
background: var(--anzhiyu-main)
|
||||
color: var(--anzhiyu-white)
|
||||
|
||||
.equipment-item-content-item-cover
|
||||
width: 100%
|
||||
height: 200px
|
||||
background: var(--anzhiyu-secondbg)
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center;
|
||||
|
||||
img.equipment-item-content-item-image
|
||||
object-fit: contain
|
||||
height: 80%
|
||||
width 260px
|
||||
|
||||
.equipment-item-content-item-toolbar
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
position: absolute
|
||||
bottom: 12px
|
||||
left: 0
|
||||
width: 100%
|
||||
padding: 0 16px
|
||||
|
||||
body[data-type="equipment"] #web_bg
|
||||
background: var(--anzhiyu-background);
|
||||
body[data-type="equipment"] #page
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: 0 0 !important;
|
||||
body[data-type="equipment"] #page .page-title
|
||||
display: none;
|
||||
|
||||
|
||||
478
themes/anzhiyu/source/css/_page/flink.styl
Normal file
478
themes/anzhiyu/source/css/_page/flink.styl
Normal file
@@ -0,0 +1,478 @@
|
||||
body[data-type="link"]
|
||||
#page
|
||||
.page-title
|
||||
display: none
|
||||
#flink-banners
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 76%;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
padding: 1.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;
|
||||
animation: slide-in 0.6s 0.2s backwards;
|
||||
.flink .banners-title
|
||||
top: 1.5rem;
|
||||
.banner-top-box
|
||||
display: flex
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.banner-button-group
|
||||
position: absolute;
|
||||
right: 2rem;
|
||||
top: 2.5rem;
|
||||
display: flex;
|
||||
+maxWidth768()
|
||||
display: none
|
||||
.banner-button
|
||||
color: var(--anzhiyu-card-bg);
|
||||
&.secondary
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
&:hover
|
||||
background: var(--anzhiyu-theme);
|
||||
color: var(--anzhiyu-white);
|
||||
i
|
||||
margin-right: 8px;
|
||||
font-size: 1rem;
|
||||
#skills-tags-group-all
|
||||
.img-alt
|
||||
display: none
|
||||
.tags-group-wrapper
|
||||
animation: rowup 120s linear infinite;
|
||||
.tags-group-icon
|
||||
border-radius: 50%;
|
||||
img
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
|
||||
.flink-desc
|
||||
margin: .2rem 0 .5rem
|
||||
|
||||
#article-container
|
||||
.anzhiyu-flink-list
|
||||
overflow: auto
|
||||
margin: -6px
|
||||
text-align: center
|
||||
.img-alt
|
||||
display: none
|
||||
&.cf-friends-lost-contact
|
||||
.flink-list-item
|
||||
height 60px
|
||||
&:hover
|
||||
.cf-friends-link img
|
||||
width: 0;
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
margin: 0.5rem;
|
||||
min-width: 0px;
|
||||
min-height: 0px;
|
||||
.cf-friends-link img
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
min-width: 30px;
|
||||
min-height: 30px;
|
||||
|
||||
.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(--anzhiyu-shadow-border);
|
||||
background: var(--anzhiyu-card-bg);
|
||||
display: flex;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
height: 90px;
|
||||
line-height: 17px;
|
||||
transform: translateZ(0px);
|
||||
.cf-friends-link
|
||||
display: flex;
|
||||
border: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
padding: 0 4px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
img
|
||||
border-radius: 32px;
|
||||
margin: 15px 20px 15px 15px;
|
||||
transition: 0.3s;
|
||||
background: var(--anzhiyu-background);
|
||||
min-width: 60px;
|
||||
min-height: 60px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
float: left;
|
||||
object-fit: cover;
|
||||
|
||||
|
||||
+maxWidth1200()
|
||||
width: calc(50% - 15px) !important
|
||||
|
||||
+maxWidth600()
|
||||
width: calc(100% - 15px) !important
|
||||
|
||||
|
||||
&:hover:before,
|
||||
&:focus:before,
|
||||
&:active:before
|
||||
transform: scale(1)
|
||||
|
||||
.flink-item-info
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: calc(100% - 90px);
|
||||
height: fit-content;
|
||||
|
||||
.flink-item-name
|
||||
@extend .limit-one-line
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
display: block;
|
||||
padding: 0px 10px 0px 0px;
|
||||
font-weight: 700;
|
||||
font-size: 19px;
|
||||
max-width: calc(100% - 12px);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
.flink-item-desc
|
||||
@extend .limit-one-line
|
||||
white-space: normal;
|
||||
padding: 5px 10px 16px 0;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
text-align: left;
|
||||
font-size: 0.93em;
|
||||
height: 40px;
|
||||
text-overflow: ellipsis;
|
||||
opacity: 0.7;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
&:hover
|
||||
transform: scale(1);
|
||||
background: var(--anzhiyu-theme);
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
.site-card-tag
|
||||
left: -70px;
|
||||
a
|
||||
img
|
||||
transition: 0.6s;
|
||||
width: 0;
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
margin: 0.5rem;
|
||||
min-width: 0px;
|
||||
min-height: 0px;
|
||||
.flink-item-info
|
||||
min-width: calc(100% - 20px);
|
||||
.flink-item-name
|
||||
color: var(--anzhiyu-white);
|
||||
.flink-item-desc
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
color: var(--anzhiyu-white);
|
||||
|
||||
.flink-name
|
||||
margin-bottom: 5px
|
||||
font-weight: bold
|
||||
font-size: 1.5em
|
||||
|
||||
#article-container img
|
||||
margin-bottom: 0.5rem;
|
||||
object-fit: cover;
|
||||
max-height: 900px;
|
||||
.flexcard-flink-list
|
||||
overflow hidden
|
||||
.flink-list-card
|
||||
.wrapper img
|
||||
transition: transform .5s ease-out !important;
|
||||
&:hover
|
||||
border-color: var(--anzhiyu-main)!important;
|
||||
background-color: var(--anzhiyu-main)!important;
|
||||
box-shadow: var(--anzhiyu-shadow-theme)!important;
|
||||
|
||||
& > a
|
||||
width: calc(100% / 5 - 0.5rem);
|
||||
height 150px
|
||||
position relative
|
||||
display block
|
||||
margin: 0.5rem 0.25rem;
|
||||
float left
|
||||
overflow hidden
|
||||
padding: 0;
|
||||
border-radius: 8px;
|
||||
transition all .3s ease 0s, transform .6s cubic-bezier(.6, .2, .1, 1) 0s
|
||||
box-shadow none
|
||||
border: var(--style-border)!important;
|
||||
&:hover
|
||||
.info
|
||||
transform translateY(-100%)
|
||||
.wrapper
|
||||
img
|
||||
transform scale(1.2)
|
||||
&::before
|
||||
position: fixed
|
||||
width:inherit
|
||||
margin:auto
|
||||
left:0
|
||||
right:0
|
||||
top:10%
|
||||
border-radius: 10px
|
||||
text-align: center
|
||||
z-index: 100
|
||||
content: attr(data-title)
|
||||
font-size: 20px
|
||||
color: #fff
|
||||
padding: 10px
|
||||
background-color: rgba($theme-color,0.8)
|
||||
|
||||
.cover
|
||||
width 100%
|
||||
transition transform .5s ease-out
|
||||
.wrapper
|
||||
position relative
|
||||
.fadeIn
|
||||
animation coverIn .8s ease-out forwards
|
||||
img
|
||||
height 150px
|
||||
pointer-events none
|
||||
.info
|
||||
display flex
|
||||
flex-direction column
|
||||
justify-content center
|
||||
align-items center
|
||||
width 100%
|
||||
height 100%
|
||||
overflow hidden
|
||||
border-radius 3px
|
||||
background-color hsla(0, 0%, 100%, .7)
|
||||
transition transform .5s cubic-bezier(.6, .2, .1, 1) 0s
|
||||
img
|
||||
position relative
|
||||
top 45px
|
||||
width 80px
|
||||
height 80px
|
||||
border-radius 50% !important
|
||||
box-shadow 0 0 10px rgba(0, 0, 0, .3)
|
||||
z-index 1
|
||||
text-align center
|
||||
pointer-events none
|
||||
span
|
||||
padding 20px 10% 60px 10%
|
||||
font-size 16px
|
||||
width 100%
|
||||
text-align center
|
||||
box-shadow 0 0 10px rgba(0, 0, 0, .3)
|
||||
background-color hsla(0, 0%, 100%, .7)
|
||||
color var(--font-color)
|
||||
white-space nowrap
|
||||
overflow hidden
|
||||
text-overflow ellipsis
|
||||
.flexcard-flink-list>a .info,
|
||||
.flexcard-flink-list>a .wrapper .cover
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
|
||||
@media screen and (max-width:1024px)
|
||||
.flexcard-flink-list
|
||||
& > a
|
||||
width calc(33.33333% - 15px)
|
||||
|
||||
@media screen and (max-width:600px)
|
||||
.flexcard-flink-list
|
||||
& > a
|
||||
width calc(50% - 15px)
|
||||
|
||||
[data-theme=dark]
|
||||
.flexcard-flink-list a .info,
|
||||
.flexcard-flink-list a .info span
|
||||
background-color rgba(0, 0, 0, .6)
|
||||
.flexcard-flink-list
|
||||
& > a
|
||||
&:hover
|
||||
&:before
|
||||
background-color: rgba(#121212,0.8);
|
||||
.justified-gallery > div > img,
|
||||
.justified-gallery > figure > img,
|
||||
.justified-gallery > a > a > img,
|
||||
.justified-gallery > div > a > img,
|
||||
.justified-gallery > figure > a > img,
|
||||
.justified-gallery > a > svg,
|
||||
.justified-gallery > div > svg,
|
||||
.justified-gallery > figure > svg,
|
||||
.justified-gallery > a > a > svg,
|
||||
.justified-gallery > div > a > svg,
|
||||
.justified-gallery > figure > a > svg
|
||||
position static!important
|
||||
|
||||
.site-card-tag
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 4px 8px;
|
||||
background-color: var(--anzhiyu-theme);
|
||||
box-shadow: var(--anzhiyu-shadow-blue);
|
||||
color: var(--anzhiyu-white);
|
||||
z-index: 1;
|
||||
border-radius: 11px 0 12px 0;
|
||||
transition: 0.3s;
|
||||
font-size: 12px;
|
||||
&.speed
|
||||
background: var(--anzhiyu-green);
|
||||
box-shadow: var(--anzhiyu-shadow-green);
|
||||
&.vip
|
||||
background: linear-gradient(38deg, rgba(229, 176, 133, 1) 0%, rgba(212, 143, 22, 1) 100%);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--anzhiyu-shadow-yellow);
|
||||
i.light
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100px;
|
||||
height: 50px;
|
||||
background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0))
|
||||
animation: light_tag 4s both infinite;
|
||||
will-change: transform;
|
||||
|
||||
@keyframes light_tag
|
||||
0%
|
||||
transform: skewx(0) translateX(-150px);
|
||||
99%
|
||||
transform: skewx(-25deg) translateX(50px);
|
||||
#article-container
|
||||
.telescopic-site-card-group
|
||||
padding: 20px 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-pack: start;
|
||||
justify-content: flex-start;
|
||||
margin: -8px;
|
||||
-webkit-box-align: stretch;
|
||||
align-items: stretch;
|
||||
.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(--anzhiyu-card-bg);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
.img-alt
|
||||
display: none
|
||||
+maxWidth1200()
|
||||
width: calc(20% - 16px) !important;
|
||||
+maxWidth900()
|
||||
width: calc(25% - 16px) !important;
|
||||
+maxWidth768()
|
||||
width: calc(33.3333% - 16px) !important;
|
||||
+maxWidth600()
|
||||
width: calc(50% - 16px) !important;
|
||||
&:hover
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
.info
|
||||
background: var(--anzhiyu-theme);
|
||||
height: 120px;
|
||||
.site-card-text
|
||||
.title
|
||||
color: var(--anzhiyu-white);
|
||||
.desc
|
||||
transition: 0.3s;
|
||||
color: var(--anzhiyu-white);
|
||||
width: 100%;
|
||||
+minWidth768()
|
||||
.desc
|
||||
-webkit-line-clamp: 4;
|
||||
|
||||
.site-card-tag
|
||||
left: -50px;
|
||||
.img
|
||||
height: 80px;
|
||||
img
|
||||
transform: scale(1.1);
|
||||
filter: brightness(0.3);
|
||||
.info
|
||||
display: flex;
|
||||
border: none;
|
||||
padding: 0.7rem;
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
margin: 0;
|
||||
border-radius: 0 0 12px 12px;
|
||||
.site-card-text
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
.title
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
transition: all 0.3s ease 0s;
|
||||
.desc
|
||||
font-size: 0.9rem;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
opacity: 0.7;
|
||||
transition: 0.3s;
|
||||
text-align: left;
|
||||
overflow-wrap: break-word;
|
||||
line-height: 1.2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
.img-alt
|
||||
display: none;
|
||||
img
|
||||
border-radius: 32px;
|
||||
transition: 0.3s !important;
|
||||
margin: 2px 8px 0 0;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
min-width: 20px;
|
||||
min-height: 20px;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
.img
|
||||
-webkit-mask-image: -webkit-radial-gradient(center, rgb(255, 255, 255), rgb(0, 0, 0));
|
||||
border-radius: 0;
|
||||
height: 120px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border: none;
|
||||
padding: 0 !important;
|
||||
transition: all 0.3s ease 0s;
|
||||
img
|
||||
border-radius: 0;
|
||||
transform: scale(1.03);
|
||||
transition: 0.3s;
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
|
||||
407
themes/anzhiyu/source/css/_page/homepage.styl
Normal file
407
themes/anzhiyu/source/css/_page/homepage.styl
Normal file
@@ -0,0 +1,407 @@
|
||||
#recent-posts
|
||||
& > .recent-post-item:not(:first-child)
|
||||
margin-top: 20px
|
||||
animation: slide-in 0.6s 0.4s backwards;
|
||||
will-change: transform;
|
||||
+maxWidth768()
|
||||
margin: 20px 20px 0
|
||||
& > .recent-post-item
|
||||
@extend .cardHover
|
||||
display: flex
|
||||
flex-direction: row
|
||||
align-items: center
|
||||
overflow: hidden
|
||||
height: 18em
|
||||
position: relative
|
||||
border-radius: 12px;
|
||||
box-shadow: none;
|
||||
transition: all 0.3s ease 0s;
|
||||
.recent-post-info-top-tips
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
|
||||
.unvisited-post
|
||||
display: flex;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
font-size: .75rem;;
|
||||
position: relative;
|
||||
&:visited
|
||||
color: var(--anzhiyu-card-bg);
|
||||
.recent-post-info
|
||||
margin-top: 0px;
|
||||
position: relative;
|
||||
.recent-post-info-top
|
||||
position: relative;
|
||||
transition: .3s;
|
||||
padding: 0 32px;
|
||||
width: 100%;
|
||||
.article-categories-original
|
||||
display: flex;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
font-size: .75rem;;
|
||||
position: relative;
|
||||
margin-right: 8px;
|
||||
.newPost
|
||||
display: flex;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
font-size: .75rem;;
|
||||
position: relative;
|
||||
margin-right: 8px;
|
||||
.article-title
|
||||
font-size: 20px;
|
||||
-webkit-line-clamp: 2;
|
||||
line-height: 30px;
|
||||
margin-top: 0;
|
||||
font-weight: 700;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
margin-bottom: 0;
|
||||
width: 100%;
|
||||
transition: .3s;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
+maxWidth768()
|
||||
if hexo-config("post_meta.page.date_type") == 'both'
|
||||
// -webkit-line-clamp: 1 !important;
|
||||
line-height: 23px;
|
||||
font-size: 19px;
|
||||
|
||||
+maxWidth768()
|
||||
flex-direction: column
|
||||
height: auto
|
||||
&.lastestpost-item
|
||||
margin-top: 10px !important;
|
||||
|
||||
&:hover
|
||||
img.post_bg
|
||||
filter: brightness(0.82) !important;
|
||||
transform: scale(1.03) !important
|
||||
transition: 0.3s ease-in-out;
|
||||
|
||||
&.ads-wrap
|
||||
display: block !important
|
||||
height: auto !important
|
||||
|
||||
.post_cover
|
||||
overflow: hidden
|
||||
width: 70%
|
||||
height: 200px;
|
||||
|
||||
+maxWidth768()
|
||||
width: 100%
|
||||
height: 200px
|
||||
|
||||
img.post_bg
|
||||
border-radius: 0px
|
||||
height 100%
|
||||
width 100%
|
||||
transition: all 0.6s ease 0s;
|
||||
object-fit: cover;
|
||||
|
||||
&.right
|
||||
order: 1
|
||||
|
||||
+maxWidth768()
|
||||
order: 0
|
||||
& >.recent-post-info
|
||||
height: 174px;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
.sticky-warp
|
||||
line-height: 23px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 8px
|
||||
|
||||
.sticky
|
||||
color: $sticky-color
|
||||
font-size: 12px;
|
||||
+maxWidth768()
|
||||
width: 100%
|
||||
min-height: 140px;
|
||||
&.no-cover
|
||||
width: 100%
|
||||
|
||||
+maxWidth768()
|
||||
padding: 30px 20px
|
||||
&:hover
|
||||
color: $text-hover
|
||||
|
||||
& > .article-meta-wrap
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-size: .7rem;
|
||||
position: absolute;
|
||||
padding: 0 32px;
|
||||
transition: .3s;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
|
||||
if hexo-config("post_meta.page.date_type") == 'both'
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
bottom: 0px;
|
||||
+maxWidth768()
|
||||
bottom: 20px;
|
||||
else
|
||||
flex-direction: row-reverse
|
||||
align-items: center
|
||||
bottom: 30px;
|
||||
.article-meta
|
||||
if hexo-config("post_meta.page.date_type") != 'both'
|
||||
margin: 0 8px 0 0;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
& > .post-meta-date
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-size: .875rem;
|
||||
white-space: nowrap;
|
||||
if hexo-config("post_meta.page.date_type") == 'both'
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
+maxWidth500()
|
||||
font-size: 13px
|
||||
|
||||
i
|
||||
margin: 0 4px 0 0
|
||||
|
||||
.article-meta-label
|
||||
if hexo-config('post_meta.page.label')
|
||||
padding-right: 4px
|
||||
else
|
||||
display: none
|
||||
|
||||
.article-meta-separator
|
||||
margin: 0 6px
|
||||
|
||||
.article-meta-link
|
||||
margin: 0 4px
|
||||
|
||||
if hexo-config('post_meta.page.date_format') == 'relative'
|
||||
time
|
||||
display: none
|
||||
|
||||
a
|
||||
color: $theme-meta-color
|
||||
font-size: 14px
|
||||
margin-right: 4px
|
||||
span
|
||||
pointer-events: none
|
||||
|
||||
&:hover
|
||||
color: $text-hover
|
||||
|
||||
& > .content
|
||||
@extend .limit-more-line
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
#topPostGroup
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-top: 10px;
|
||||
height: 128px;
|
||||
align-content: space-between;
|
||||
width: 100%;
|
||||
#home_top
|
||||
margin: 0 auto 0;
|
||||
padding: 0px 1.5rem 0px;
|
||||
max-width: 1400px;
|
||||
width: 100%;
|
||||
animation: slide-in 0.6s 0.1s backwards;
|
||||
overflow: hidden;
|
||||
|
||||
+maxWidth768()
|
||||
#topPostGroup
|
||||
height: 240px;
|
||||
#swiper_container_blog
|
||||
padding: 10px;
|
||||
#home_top
|
||||
padding: 0px 20px 0px;
|
||||
|
||||
|
||||
if hexo-config('home_top.swiper.enable') == true
|
||||
div#bannerGroup
|
||||
margin-right: 10px;
|
||||
width: calc(51% - 10px) !important;
|
||||
+maxWidth768()
|
||||
#home_top
|
||||
padding: 0px 15px;
|
||||
#topPostGroup
|
||||
height: 280px;
|
||||
#swiper_container_blog
|
||||
padding: 0 10px;
|
||||
+maxWidth1200()
|
||||
div#bannerGroup {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
if hexo-config('article_double_row') == true
|
||||
#content-inner #recent-posts > .recent-post-item > .recent-post-info > .content
|
||||
opacity: 0;
|
||||
height: 0;
|
||||
+maxWidth1200()
|
||||
#recent-posts > .recent-post-item >.recent-post-info > .article-title
|
||||
line-height: 30px;
|
||||
font-weight: bold;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
width: 100%;
|
||||
transition: .3s;
|
||||
font-size: 1.2rem;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
+maxWidth768()
|
||||
#content-inner #recent-posts > .recent-post-item > .recent-post-info > .content
|
||||
opacity: 0;
|
||||
height: 0;
|
||||
@media screen and (min-width: 1201px)
|
||||
#recent-posts
|
||||
align-content: flex-start
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
justify-content: space-between
|
||||
|
||||
&>.recent-post-item
|
||||
margin-top: 1rem
|
||||
display: flex
|
||||
height: auto
|
||||
width: 49%
|
||||
.recent-post-info
|
||||
.content
|
||||
display: none
|
||||
.post_cover
|
||||
width: 100%
|
||||
height: 225px
|
||||
transition: 1s !important;
|
||||
|
||||
img.post_bg
|
||||
width: 100%
|
||||
height: 100%
|
||||
|
||||
-webkit-flex-direction: column
|
||||
-ms-flex-direction: column
|
||||
flex-direction: column
|
||||
|
||||
.left_radius
|
||||
border-radius: 8px 8px 0 0
|
||||
|
||||
.right_radius
|
||||
border-radius: 8px 8px 0 0
|
||||
|
||||
height: auto !important
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
#recent-posts>.recent-post-item
|
||||
width: 100%
|
||||
|
||||
#recent-posts > .recent-post-item >.recent-post-info > .article-meta-wrap > .tags > .article-meta__separator
|
||||
display: none
|
||||
|
||||
|
||||
|
||||
#content-inner #recent-posts > .recent-post-item > .recent-post-info > .content
|
||||
transition: all 0.3s ease 0s;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
line-height: 1.4;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
margin-top: 0.5rem;
|
||||
font-size: 14px;
|
||||
opacity 0
|
||||
height 0
|
||||
|
||||
#popup-window
|
||||
min-width: 300px;
|
||||
background: var(--anzhiyu-maskbgdeep);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
padding: 8px 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
position: fixed;
|
||||
border-radius: 12px;
|
||||
transition: .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);
|
||||
opacity 0
|
||||
pointer-events: none
|
||||
&.show-popup-window
|
||||
animation: barrageIn .6s cubic-bezier(.42,0,.3,1.11);
|
||||
opacity 1
|
||||
pointer-events: all
|
||||
cursor pointer
|
||||
&.no-url:hover
|
||||
background: var(--anzhiyu-maskbgdeep);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
border: var(--style-border);
|
||||
cursor: pointer
|
||||
&.no-url
|
||||
.popup-window-content .popup-link
|
||||
display: none
|
||||
&:hover
|
||||
background: var(--anzhiyu-main)
|
||||
color: var(--anzhiyu-white)
|
||||
border: var(--style-border-hover);
|
||||
.popup-window-content .popup-link i
|
||||
color: var(--anzhiyu-white)
|
||||
&.popup-hide
|
||||
opacity: 0;
|
||||
animation: barrageOut .6s cubic-bezier(.42,0,.3,1.11);
|
||||
.popup-window-title
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: var(--anzhiyu-card-bg);
|
||||
margin-right: 8px;
|
||||
background: var(--anzhiyu-fontcolor);
|
||||
line-height: 1;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
width: fit-content;
|
||||
.popup-window-divider
|
||||
width 100%
|
||||
border-bottom: var(--style-border);
|
||||
margin-top: 6px;
|
||||
.popup-window-content
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.popup-link
|
||||
margin-left: auto;
|
||||
font-size: 16px;
|
||||
i
|
||||
font-size: 16px;
|
||||
body[data-type="post"]
|
||||
#popup-window
|
||||
top: 70px;
|
||||
bottom: auto;
|
||||
&.show-popup-window
|
||||
animation: toLeftFull .6s cubic-bezier(.42,0,.3,1.11);
|
||||
opacity 1
|
||||
&.popup-hide
|
||||
opacity: 0;
|
||||
animation: toRightFull .6s cubic-bezier(.42,0,.3,1.11);
|
||||
377
themes/anzhiyu/source/css/_page/music.styl
Normal file
377
themes/anzhiyu/source/css/_page/music.styl
Normal file
@@ -0,0 +1,377 @@
|
||||
body[data-type="music"]
|
||||
background rgb(13, 13, 13)
|
||||
#body-wrap
|
||||
justify-content: flex-start;
|
||||
#center-console + label i
|
||||
background: var(--anzhiyu-white) !important
|
||||
.layout
|
||||
flex-direction: row;
|
||||
#page
|
||||
border 0
|
||||
box-shadow none !important
|
||||
padding 0 !important
|
||||
background transparent !important
|
||||
.page-title
|
||||
display: none
|
||||
#page-header
|
||||
#nav
|
||||
backdrop-filter none !important
|
||||
background 0 0 !important
|
||||
border-bottom none !important
|
||||
#blog_name,
|
||||
.mask-name-container,
|
||||
#menus,
|
||||
#nav-right .nav-button,
|
||||
#nav-right #toggle-menu
|
||||
a, .back-home-button
|
||||
color var(--anzhiyu-white)
|
||||
#footer, #nav-music
|
||||
display none
|
||||
#an_music_bg
|
||||
display block
|
||||
#web_bg
|
||||
display none
|
||||
.s-sticker
|
||||
div
|
||||
color var(--anzhiyu-white) !important
|
||||
|
||||
[data-theme="dark"]
|
||||
body[data-type="music"]
|
||||
.page
|
||||
#page-header
|
||||
&:before
|
||||
background-color transparent
|
||||
|
||||
|
||||
#an_music_bg
|
||||
display none
|
||||
filter blur(63px)
|
||||
opacity 0.6
|
||||
position fixed
|
||||
z-index -999
|
||||
background-attachment local
|
||||
background-position center center
|
||||
background-size cover
|
||||
background-repeat no-repeat
|
||||
width 200%
|
||||
height 200%
|
||||
top -50%
|
||||
left -50%
|
||||
transform rotate(0deg)
|
||||
transition .3s
|
||||
|
||||
if hexo-config('nav_music.console_widescreen_music') == false
|
||||
body
|
||||
&:has(#console.show)
|
||||
#nav-music
|
||||
display: none !important
|
||||
if hexo-config('nav_music.enable') == false
|
||||
#nav-music
|
||||
display: none !important
|
||||
body
|
||||
&:has(#console.show)
|
||||
#nav-music
|
||||
display: flex !important;
|
||||
|
||||
@media screen and (max-width: 1400px)
|
||||
body
|
||||
#anMusic-page
|
||||
#anMusicSwitching, #anMusicRefreshBtn, #anMusicBtnGetSong
|
||||
right 7vw
|
||||
#anMusicSwitching
|
||||
bottom: 100px
|
||||
#anMusicRefreshBtn
|
||||
bottom: 160px
|
||||
#anMusicBtnGetSong
|
||||
bottom: 220px
|
||||
|
||||
#anMusic-page
|
||||
#anMusicRefreshBtn, #anMusicBtnGetSong, #anMusicSwitching
|
||||
position: fixed;
|
||||
display: flex;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
bottom: 100px;
|
||||
padding: 5px;
|
||||
background: var(--anzhiyu-white-op);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
z-index 2
|
||||
#anMusicBtnGetSong
|
||||
right: 11vw;
|
||||
#anMusicRefreshBtn
|
||||
right: 7vw;
|
||||
#anMusicSwitching
|
||||
right: 15vw;
|
||||
+maxWidth768()
|
||||
div#anMusicBtnGetSong
|
||||
right: 80px;
|
||||
bottom: 150px;
|
||||
div#anMusicRefreshBtn
|
||||
right: 20px;
|
||||
bottom: 150px;
|
||||
div#anMusicSwitching
|
||||
right: 140px;
|
||||
bottom: 150px;
|
||||
meting-js
|
||||
.aplayer
|
||||
display flex
|
||||
flex-direction row-reverse
|
||||
background rgba(0, 0, 0, 0)
|
||||
border none
|
||||
box-shadow none
|
||||
.aplayer-body
|
||||
width 40%
|
||||
height calc(100vh - 169px)
|
||||
.aplayer-pic
|
||||
float none
|
||||
width 180px
|
||||
height 180px
|
||||
border-radius 12px
|
||||
margin auto
|
||||
left 0
|
||||
right 0
|
||||
transition: background-image 0.5s ease-in-out;
|
||||
background-size: cover;
|
||||
background-color: transparent !important;
|
||||
.aplayer-info
|
||||
margin 0 20px 0 20px
|
||||
border-bottom none
|
||||
.aplayer-music
|
||||
text-align center
|
||||
height auto
|
||||
margin 15px
|
||||
.aplayer-author, .aplayer-title
|
||||
font-size 2rem
|
||||
font-weight 700
|
||||
color #fff
|
||||
|
||||
.aplayer-lrc
|
||||
height 800%
|
||||
margin-top 10px
|
||||
mask-image linear-gradient(to bottom, #000, #000, #000, #000, #000, #000, #000, #000, #000, #000, #0000, #0000)
|
||||
p
|
||||
font-size 20px
|
||||
line-height: 20px !important;
|
||||
height: 20px !important;
|
||||
margin: 20px 0 !important;
|
||||
color #fff
|
||||
&.aplayer-lrc-current {
|
||||
min-height: 20px;
|
||||
}
|
||||
&::after, &::before
|
||||
display none
|
||||
.aplayer-controller
|
||||
position fixed
|
||||
max-width 1500px
|
||||
margin auto
|
||||
left 0
|
||||
right 0
|
||||
bottom 50px
|
||||
.aplayer-bar-wrap
|
||||
margin 0 160px 0 150px
|
||||
.aplayer-bar
|
||||
height: 6px;
|
||||
border-radius: 4px;
|
||||
.aplayer-played
|
||||
height: 6px;
|
||||
border-radius: 4px;
|
||||
background var(--anzhiyu-white) !important
|
||||
.aplayer-thumb
|
||||
width 20px
|
||||
height 20px
|
||||
margin-top: -7px
|
||||
transform none
|
||||
background #fff !important
|
||||
.aplayer-loaded
|
||||
height: 6px;
|
||||
border-radius: 4px;
|
||||
.aplayer-time
|
||||
position absolute
|
||||
width 100%
|
||||
bottom 21px
|
||||
height 0
|
||||
display flex
|
||||
justify-content flex-end
|
||||
.aplayer-volume-wrap
|
||||
.aplayer-volume-bar-wrap
|
||||
bottom: 0;
|
||||
right: -5px;
|
||||
.aplayer-icon
|
||||
width 2rem
|
||||
height 2rem
|
||||
margin-left 15px
|
||||
path
|
||||
fill var(--anzhiyu-white)
|
||||
opacity 0.8
|
||||
&.aplayer-icon-loop
|
||||
margin-right 15px
|
||||
.aplayer-time-inner
|
||||
margin-right 18px
|
||||
margin-top -8px
|
||||
.aplayer-icon-back
|
||||
position absolute
|
||||
left 0
|
||||
display inline
|
||||
.aplayer-icon-play
|
||||
position absolute
|
||||
left 40px
|
||||
display inline
|
||||
.aplayer-icon-forward
|
||||
position absolute
|
||||
left 80px
|
||||
display inline
|
||||
|
||||
.aplayer-icon-menu
|
||||
display none
|
||||
|
||||
.aplayer-list
|
||||
width 60%
|
||||
height 100%
|
||||
ol
|
||||
padding-right 25px
|
||||
& > li
|
||||
border-top 1px solid transparent
|
||||
font-size 14px
|
||||
&:hover
|
||||
background #ffffff33
|
||||
border-radius 6px
|
||||
&.aplayer-list-light
|
||||
background #ffffff33
|
||||
border-radius 6px
|
||||
padding 20px 15px
|
||||
span.aplayer-list-title
|
||||
font-weight: bolder;
|
||||
.aplayer-list-cur
|
||||
display none
|
||||
span
|
||||
color var(--anzhiyu-white)
|
||||
&.aplayer-list-author
|
||||
opacity 0.6
|
||||
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
body[data-type="music"]
|
||||
#rightside
|
||||
display none
|
||||
#content-inner,#page
|
||||
z-index auto
|
||||
#anMusic-page
|
||||
meting-js
|
||||
.aplayer
|
||||
.aplayer-list
|
||||
position fixed
|
||||
z-index 1002
|
||||
width 100%
|
||||
bottom -88%
|
||||
left 0
|
||||
background var(--sidebar-bg)
|
||||
height auto
|
||||
border-radius 15px 15px 0px 0px
|
||||
padding 15px 0px
|
||||
&.aplayer-list-hide
|
||||
bottom 0% !important
|
||||
ol
|
||||
max-height 60vh !important
|
||||
padding-right 0px
|
||||
& > li
|
||||
display flex
|
||||
margin 0 10px
|
||||
span
|
||||
color var(--font-color)
|
||||
&.aplayer-list-title
|
||||
width 30%
|
||||
max-width 55%
|
||||
width auto
|
||||
display -webkit-box
|
||||
-webkit-line-clamp 1
|
||||
overflow hidden
|
||||
-webkit-box-orient vertical
|
||||
&.aplayer-list-author
|
||||
position absolute
|
||||
right 10px
|
||||
width auto
|
||||
max-width 35%
|
||||
display -webkit-box
|
||||
-webkit-line-clamp 1
|
||||
overflow hidden
|
||||
-webkit-box-orient vertical
|
||||
&.aplayer-list-light
|
||||
background #33a673
|
||||
padding 5px 20px
|
||||
border-radius 10px
|
||||
span
|
||||
color #fff
|
||||
&.aplayer-list-author
|
||||
right 15px
|
||||
.aplayer-body
|
||||
width 100%
|
||||
position fixed
|
||||
margin auto
|
||||
left 0
|
||||
right 0
|
||||
top 100px
|
||||
.aplayer-info
|
||||
.aplayer-lrc
|
||||
margin-top 40px
|
||||
height auto
|
||||
max-height 200%
|
||||
min-height 100%
|
||||
mask-image linear-gradient(to bottom, #000, #000, #000, #000, #0000, #0000)
|
||||
p
|
||||
&.aplayer-lrc-current
|
||||
color #33a673
|
||||
.aplayer-controller
|
||||
width 100%
|
||||
bottom 100px
|
||||
.aplayer-volume-wrap
|
||||
left -66px
|
||||
.aplayer-volume-bar-wrap
|
||||
bottom 0px
|
||||
right 7px
|
||||
.aplayer-bar-wrap
|
||||
margin 0 30px
|
||||
.aplayer-controller
|
||||
.aplayer-time
|
||||
bottom -40px
|
||||
.aplayer-time-inner
|
||||
position absolute
|
||||
width 100%
|
||||
margin-right 0
|
||||
margin-top -33px
|
||||
.aplayer-dtime
|
||||
position absolute
|
||||
right 30px
|
||||
.aplayer-ptime
|
||||
position absolute
|
||||
left 35px
|
||||
.aplayer-icon-back
|
||||
margin auto
|
||||
right 110px
|
||||
.aplayer-icon-play
|
||||
margin auto
|
||||
right 0
|
||||
left 0
|
||||
.aplayer-icon-forward
|
||||
margin auto
|
||||
left 110px
|
||||
right 0
|
||||
.aplayer-icon-order
|
||||
position absolute
|
||||
left 22px
|
||||
.aplayer-icon-loop
|
||||
position absolute
|
||||
right 25px
|
||||
.aplayer-icon-menu
|
||||
display inline
|
||||
position absolute
|
||||
right 25px
|
||||
top -90px
|
||||
|
||||
|
||||
135
themes/anzhiyu/source/css/_page/reward.styl
Normal file
135
themes/anzhiyu/source/css/_page/reward.styl
Normal file
@@ -0,0 +1,135 @@
|
||||
.reward
|
||||
& #con
|
||||
width 350px
|
||||
height 85px
|
||||
position relative
|
||||
border-radius 4px
|
||||
|
||||
& #TA-con
|
||||
width 157px
|
||||
height 50px
|
||||
background-color #f25d8e
|
||||
box-shadow 0 4px 4px rgba(255, 112, 159, 0.3)
|
||||
position absolute
|
||||
top 50%
|
||||
left 10%
|
||||
transform translateY(-50%)
|
||||
border-radius 4px
|
||||
cursor pointer
|
||||
+maxWidth768()
|
||||
width: 125px;
|
||||
left: 54px;
|
||||
|
||||
&:hover
|
||||
background-color #ff6b9a
|
||||
|
||||
& #text-con
|
||||
width 100px
|
||||
height 100%
|
||||
margin 0 auto
|
||||
position relative
|
||||
|
||||
|
||||
& #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
|
||||
transform rotate(-55deg)
|
||||
|
||||
&::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
|
||||
transform rotate(180deg)
|
||||
border-radius 4px
|
||||
|
||||
& #TA
|
||||
float right
|
||||
line-height 50px
|
||||
font-size 15px
|
||||
color #fff
|
||||
|
||||
& #tube-con
|
||||
width 157px
|
||||
height 55px
|
||||
position absolute
|
||||
right -5px
|
||||
top 15px
|
||||
|
||||
& svg
|
||||
width 100%
|
||||
height 100%
|
||||
|
||||
& #mask
|
||||
width 0px
|
||||
height 100%
|
||||
overflow hidden
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
transition all 0.5s
|
||||
|
||||
& #mask svg
|
||||
width 157px
|
||||
height 55px
|
||||
|
||||
& #TA-con:hover + #tube-con > #mask
|
||||
width 157px
|
||||
|
||||
& #TA-con:hover + #tube-con > #orange-mask
|
||||
animation move1 0.5s linear 0.2s infinite
|
||||
|
||||
& #TA-con:hover + #tube-con > #orange-mask svg
|
||||
animation movetwo 0.5s linear 0.2s infinite
|
||||
|
||||
& #orange-mask
|
||||
width 18px
|
||||
height 100%
|
||||
overflow hidden
|
||||
position absolute
|
||||
left -15px
|
||||
top 0px
|
||||
|
||||
& #orange-mask svg
|
||||
position absolute
|
||||
top 0
|
||||
left 15px
|
||||
width 157px
|
||||
height 55px
|
||||
|
||||
@keyframes move1
|
||||
0%
|
||||
transform: translateX(-15px);
|
||||
100%
|
||||
transform: translateX(140px);
|
||||
|
||||
@keyframes movetwo
|
||||
0%
|
||||
transform: translateX(15px);
|
||||
100%
|
||||
transform: translateX(-140px);
|
||||
|
||||
.reward #people
|
||||
position absolute
|
||||
right 10px
|
||||
top 4px
|
||||
font-size 12px
|
||||
font-family "雅黑"
|
||||
color #aaa
|
||||
|
||||
& > b
|
||||
color #777
|
||||
168
themes/anzhiyu/source/css/_page/tag_page.styl
Normal file
168
themes/anzhiyu/source/css/_page/tag_page.styl
Normal file
@@ -0,0 +1,168 @@
|
||||
#tag #tag-page-tags
|
||||
display: flex
|
||||
flex-flow: row wrap
|
||||
|
||||
#tag #tag-page-tags a
|
||||
line-height: 1.6
|
||||
display: flex
|
||||
align-items: center
|
||||
color: var(--anzhiyu-fontcolor) !important
|
||||
padding: 0.1rem 0.5rem
|
||||
margin: 0.25rem
|
||||
border-radius: 8px
|
||||
border: var(--style-border-always)
|
||||
|
||||
&.selected
|
||||
box-shadow: var(--anzhiyu-shadow-theme)
|
||||
color: var(--anzhiyu-white) !important
|
||||
background: var(--anzhiyu-theme)
|
||||
border: var(--style-border-none)
|
||||
|
||||
&.select .tagsPageCount
|
||||
background: var(--anzhiyu-card-bg)
|
||||
color: var(--anzhiyu-lighttext)
|
||||
|
||||
#post .tag_share .post-meta__box__tags span.tagsPageCount,
|
||||
#tag-page-tags .tagsPageCount
|
||||
padding: 4px 6px
|
||||
background: var(--anzhiyu-secondbg)
|
||||
border: var(--style-border-always)
|
||||
min-width: 22.5px
|
||||
display: inline-block
|
||||
border-radius: 4px
|
||||
line-height: 0.6rem
|
||||
text-align: center
|
||||
font-size: 0.7rem
|
||||
color: var(--anzhiyu-fontcolor)
|
||||
margin-left: 4px
|
||||
|
||||
#tag #tag-page-tags a:hover .tagsPageCount,
|
||||
#post .tag_share .post-meta__box__tags:hover span.tagsPageCount
|
||||
background: var(--anzhiyu-card-bg)
|
||||
color: var(--anzhiyu-lighttext)
|
||||
|
||||
#tag #tag-page-tags a
|
||||
font-family: $font-family
|
||||
font-size: 0.9em
|
||||
|
||||
#tag #tag-page-tags a:hover
|
||||
box-shadow: var(--anzhiyu-shadow-theme)
|
||||
color: var(--anzhiyu-white) !important
|
||||
background: var(--anzhiyu-theme)
|
||||
border: var(--style-border-none)
|
||||
|
||||
span.tags-punctuation,
|
||||
span.categoryes-punctuation
|
||||
margin-right: 4px
|
||||
|
||||
span.tags-punctuation .icon-biaoqian,
|
||||
span.categoryes-punctuation .icon-biaoqian
|
||||
font-size: 13px
|
||||
|
||||
.tagsPageCount
|
||||
font-family: $font-family
|
||||
|
||||
[data-theme="light"] #post .tag_share .post-meta__box__tags span.tagsPageCount
|
||||
background-color: transparent
|
||||
color: white
|
||||
|
||||
[data-theme="light"] #post .tag_share .post-meta__box__categoryes span.categoryesPageCount
|
||||
background-color: transparent
|
||||
color: white
|
||||
|
||||
#post .tag_share .post-meta__box__categoryes span.categoryesPageCount
|
||||
padding: 4px 6px
|
||||
background: var(--anzhiyu-secondbg)
|
||||
border: var(--style-border-always)
|
||||
min-width: 22.5px
|
||||
display: inline-block
|
||||
border-radius: 4px
|
||||
line-height: 0.6rem
|
||||
text-align: center
|
||||
font-size: 0.7rem
|
||||
color: var(--anzhiyu-fontcolor)
|
||||
margin-left: 4px
|
||||
|
||||
.post-meta__box__categories
|
||||
border-radius: 12px
|
||||
|
||||
/* 文章彩色标签 */
|
||||
/*文章随机彩色标签*/
|
||||
.post-meta__box a
|
||||
color: var(--anzhiyu-white)
|
||||
border: none
|
||||
|
||||
[data-theme="dark"] .post-meta__box a
|
||||
opacity: 0.5
|
||||
|
||||
[data-theme="dark"] .post-reward .reward-button,
|
||||
[data-theme="dark"] .reward-link.mode
|
||||
opacity: 0.5
|
||||
|
||||
.post-meta__box__tag-list a:nth-child(5n)
|
||||
background-color: #4a4a4a
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__tag-list a:nth-child(5n + 1)
|
||||
background-color: #ff5e5c
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__tag-list a:nth-child(5n + 2)
|
||||
background-color: #ffbb50
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__tag-list a:nth-child(5n + 3)
|
||||
background-color: #1ac756
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__tag-list a:nth-child(5n + 4)
|
||||
background-color: #19b5fe
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__tag-list a:hover
|
||||
background-color: var(--anzhiyu-main)
|
||||
color: #fff
|
||||
[data-theme="dark"] .post-meta__box__tag-list a:hover
|
||||
color: #fff
|
||||
/* 文章分类颜色背景 */
|
||||
.post-meta__box__category-list a:nth-child(5n)
|
||||
background-color: #4a4a4a
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__category-list a:nth-child(5n + 1)
|
||||
background-color: #1ac756
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__category-list a:nth-child(5n + 2)
|
||||
background-color: #ffbb50
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__category-list a:nth-child(5n + 3)
|
||||
background-color: #19b5fe
|
||||
color: #fff
|
||||
|
||||
.post-meta__box__category-list a:nth-child(5n + 4)
|
||||
background-color: #ff5e5c
|
||||
color: #fff
|
||||
|
||||
|
||||
|
||||
body[data-type="tags"],body[data-type="categories"]
|
||||
#page
|
||||
border-radius: 12px
|
||||
+maxWidth768()
|
||||
#tag
|
||||
padding: 0px 15px 20px
|
||||
.page-title
|
||||
margin: 8px 0 0px
|
||||
+maxWidth768()
|
||||
#body-wrap .layout
|
||||
padding: 0 20px 15px
|
||||
#tag #tag-page-tags
|
||||
justify-content: center;
|
||||
a
|
||||
font-size: 1.4rem;
|
||||
margin: 0.3rem 0.65rem;
|
||||
+maxWidth768()
|
||||
font-size: 1.8rem;
|
||||
margin: 0.6rem 0.8rem;
|
||||
23
themes/anzhiyu/source/css/_page/tags.styl
Normal file
23
themes/anzhiyu/source/css/_page/tags.styl
Normal file
@@ -0,0 +1,23 @@
|
||||
.tag-cloud
|
||||
&-list
|
||||
a
|
||||
display: inline-block
|
||||
padding: 0 8px
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
color: $text-hover !important
|
||||
transform: scale(1.1)
|
||||
|
||||
+maxWidth768()
|
||||
zoom: .85
|
||||
|
||||
&-title
|
||||
font-size: 2.57em
|
||||
|
||||
+maxWidth768()
|
||||
font-size: 2em
|
||||
|
||||
h1.page-title
|
||||
& + .tag-cloud-list
|
||||
text-align: left
|
||||
Reference in New Issue
Block a user