init...
This commit is contained in:
@@ -0,0 +1,121 @@
|
||||
/* 处理单页背景 */
|
||||
body[data-type="album"] #web_bg {
|
||||
background: var(--anzhiyu-background);
|
||||
}
|
||||
body[data-type="album"] #page {
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: 0 0 !important;
|
||||
}
|
||||
body[data-type="album"] #page .page-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 变量定义 */
|
||||
:root {
|
||||
--album-background-dark: #2d3548;
|
||||
--album-text-light: rgba(255, 255, 255, 0.6);
|
||||
--album-text-lighter: rgba(255, 255, 255, 0.9);
|
||||
--album-spacing-s: 8px;
|
||||
--album-spacing-m: 16px;
|
||||
--album-spacing-l: 24px;
|
||||
--album-spacing-xl: 32px;
|
||||
--album-spacing-xxl: 64px;
|
||||
}
|
||||
|
||||
/* 卡片样式 */
|
||||
#album .card-album {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
margin: var(--album-spacing-xxl) 0 0;
|
||||
}
|
||||
#album .card-album .album-content-nocover {
|
||||
width: calc(100% / 4 - 40px);
|
||||
}
|
||||
|
||||
#album .card-album .card {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
display: flex;
|
||||
width: calc(100% / 4 - 10px);
|
||||
padding: 10px;
|
||||
}
|
||||
#album .card-album .card:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#album .card_cover {
|
||||
border-radius: var(--album-spacing-l);
|
||||
filter: brightness(0.75) saturate(1.2) contrast(0.85);
|
||||
transform-origin: center;
|
||||
transform: scale(1) translateZ(0);
|
||||
transition: filter 200ms linear, transform 200ms linear;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
height: 550px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: var(--album-spacing-l);
|
||||
}
|
||||
|
||||
#album .card:hover .card_cover {
|
||||
transform: scale(1.05) translateZ(0);
|
||||
filter: brightness(0.9) saturate(1.2) contrast(1);
|
||||
}
|
||||
|
||||
#album .card-album:hover > .card:not(:hover) .card_cover {
|
||||
filter: brightness(0.5) saturate(0.9) contrast(1.2) blur(20px);
|
||||
}
|
||||
|
||||
#album .card__content {
|
||||
left: 0;
|
||||
padding: var(--album-spacing-l);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#album .card__category {
|
||||
color: var(--album-text-light);
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: var(--album-spacing-s);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#album .card__heading {
|
||||
color: var(--album-text-lighter);
|
||||
font-size: 1.9rem;
|
||||
text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);
|
||||
line-height: 1.4;
|
||||
word-spacing: 100vw;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
#album img.card_cover {
|
||||
height: 600px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 960px) {
|
||||
#album .card-album .card {
|
||||
width: calc(100% / 2 - 40px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 540px) {
|
||||
#album .card-album .card {
|
||||
width: calc(100%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#album .card-album {
|
||||
margin-top: 10px;
|
||||
}
|
||||
#album .card-album .card {
|
||||
padding: 10px 0px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,309 @@
|
||||
/* 处理单页背景 */
|
||||
body[data-type="album_detail"] #web_bg {
|
||||
background: var(--anzhiyu-background);
|
||||
}
|
||||
body[data-type="album_detail"] #page {
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: 0 0 !important;
|
||||
}
|
||||
body[data-type="album_detail"] #page .page-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 处理页面样式 */
|
||||
#album_detail .album-container-img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
#album_detail .album-container-img .album-content-noimg {
|
||||
width: calc(100% / 2 - 5px);
|
||||
}
|
||||
|
||||
#album_detail .album-content-img img {
|
||||
object-fit: cover;
|
||||
max-width: 100%;
|
||||
border-radius: 12px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
#album_detail .album-content-img {
|
||||
height: 100%;
|
||||
max-height: 300px;
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#album_detail .album-content .datacont {
|
||||
order: 0;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
width: 100%;
|
||||
line-height: 1.38;
|
||||
border-radius: 12px;
|
||||
margin-bottom: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: justify;
|
||||
}
|
||||
#album_detail p {
|
||||
margin: 0px;
|
||||
}
|
||||
#album_detail div.album-content {
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
border-radius: 12px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#album_detail .timeline ul li.album-item {
|
||||
position: relative;
|
||||
width: 32%;
|
||||
border: var(--style-border-always);
|
||||
border-radius: 12px;
|
||||
padding: 1rem 1rem 0.5rem;
|
||||
transition: all 0.3s ease 0s;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
margin-right: 2%;
|
||||
}
|
||||
#album_detail .timeline #waterfall.show {
|
||||
opacity: 1;
|
||||
}
|
||||
#album_detail .timeline #waterfall {
|
||||
opacity: 0;
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
#album_detail ul.list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#album_detail {
|
||||
margin-top: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
#album_detail > section > ul > li.album-item {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#album-tips {
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
#album_detail .timeline ul li.album-item hr {
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin: 8px 0px;
|
||||
border: 1px dashed var(--anzhiyu-theme-op);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#album_detail .album-info {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li > div .album-info-time,
|
||||
#album_detail > section > ul > li > div .album-info-address,
|
||||
#album_detail > section > ul > li > div .album-info-from {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-size: 0.7rem;
|
||||
background-color: var(--anzhiyu-gray-op);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
cursor: default;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
margin: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#album_detail > section > ul > li > div .album-info-time time {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li > div .album-info-address,
|
||||
#album_detail > section > ul > li > div .album-info-from {
|
||||
margin-left: 4px;
|
||||
}
|
||||
#album_detail > section > ul > li > div .album-info-address span,
|
||||
#album_detail > section > ul > li > div .album-info-from span {
|
||||
margin-left: 4px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
#album_detail .album-info .anzhiyufont.anzhiyu-icon-instagram {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#album_detail .album-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#album_detail .album-bottom .album-reply {
|
||||
cursor: pointer;
|
||||
width: 5%;
|
||||
}
|
||||
|
||||
#album_detail .timeline ul li.album-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
}
|
||||
|
||||
#album_detail .album-content-link {
|
||||
display: flex;
|
||||
margin-left: 0.5rem;
|
||||
font-size: 0.7rem;
|
||||
align-items: center;
|
||||
background-color: rgba(245, 108, 108, 0.13);
|
||||
color: rgb(245, 108, 108);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
#album_detail .album-content-link i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
#album_detail .album-content-link:hover {
|
||||
background-color: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
#album_detail .album-music {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
margin: 0.5rem 0;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
border: var(--style-border-always);
|
||||
background: var(--anzhiyu-secondbg);
|
||||
}
|
||||
#album_detail .aplayer {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#album_detail .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
height: 82px;
|
||||
width: 82px;
|
||||
margin: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.album-music .aplayer.aplayer-withlrc .aplayer-info {
|
||||
padding: 5px 7px 0;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-music {
|
||||
height: 23px;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-music .aplayer-title {
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller {
|
||||
align-items: center;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
|
||||
padding: 0;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
position: initial;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
|
||||
background: var(--anzhiyu-gray);
|
||||
height: 8px;
|
||||
border-radius: 12px;
|
||||
transition: 0.3s;
|
||||
overflow: hidden;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded {
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played {
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb {
|
||||
display: none;
|
||||
}
|
||||
#album_detail .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
position: initial;
|
||||
}
|
||||
|
||||
body[data-type="album_detail"] #page .author-content-item .card-content .banner-button-group .banner-button:hover {
|
||||
color: var(--anzhiyu-white);
|
||||
border-radius: 20px !important;
|
||||
}
|
||||
|
||||
/* 响应式 */
|
||||
@media screen and (max-width: 1200px) {
|
||||
#album_detail .timeline ul li.album-item {
|
||||
width: 49%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#album_detail .timeline ul li.album-item {
|
||||
width: 100%;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
[data-theme="dark"] #album_detail .album-music .aplayer,
|
||||
[data-theme="dark"] #album_detail .aplayer .aplayer-lrc:before,
|
||||
[data-theme="dark"] #album_detail .aplayer .aplayer-lrc:after {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
#album_detail .aplayer .aplayer-lrc p {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#album_detail .type-gallery {
|
||||
overflow: hidden;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
#album_detail_gallery_load_more {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#album_detail .tag-address {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 8px;
|
||||
top: 8px;
|
||||
padding: 4px 6px;
|
||||
border-radius: 8px;
|
||||
background: var(--anzhiyu-black-op);
|
||||
font-size: 12px;
|
||||
color: var(--anzhiyu-white);
|
||||
transition: 0.3s;
|
||||
z-index: 1;
|
||||
user-select: none;
|
||||
}
|
||||
@@ -0,0 +1,216 @@
|
||||
h1#site-title {
|
||||
font-size: 3em !important;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 3em;
|
||||
/* 可以定义图标大小 */
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* 时间轴生肖icon */
|
||||
svg.icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
/* width和height定义图标的默认宽度和高度*/
|
||||
vertical-align: -0.15em;
|
||||
fill: currentColor;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.icon-zhongbiao::before {
|
||||
color: #f7c768;
|
||||
}
|
||||
|
||||
/* 解决artitalk的图标问题 */
|
||||
#uploadSource > svg {
|
||||
width: 1.19em;
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
/*top-img黑色透明玻璃效果移除，不建议加，除非你执着于完全一图流或者背景图对比色明显 */
|
||||
/* #page-header:not(.not-top-img):before {
|
||||
background-color: transparent !important;
|
||||
} */
|
||||
|
||||
/* 文章页面正文背景 */
|
||||
div#post {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
#recent-posts > .recent-post-item:not(:first-child):active {
|
||||
transform: scale(0.97);
|
||||
}
|
||||
/* 分页页面 */
|
||||
div#page {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
/* 归档页面 */
|
||||
div#archive {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
/* 标签页面 */
|
||||
div#tag {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
/* 分类页面 */
|
||||
div#category {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
/*夜间模式伪类遮罩层透明*/
|
||||
[data-theme="dark"] #recent-posts > .recent-post-item {
|
||||
background: #121212;
|
||||
}
|
||||
|
||||
[data-theme="dark"] .card-widget {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#post {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#tag {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#archive {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#page {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#category {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
}
|
||||
|
||||
[data-theme="dark"] div#category {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* md网站下划线 */
|
||||
#article-container a:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
#article-container #hpp_talk p img {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
/* 宽屏适配 */
|
||||
.page .layout,
|
||||
.post .layout {
|
||||
max-width: 1400px;
|
||||
}
|
||||
|
||||
.card-widget.card-clock {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#article-container
|
||||
a:not([data-fancybox="gallery"]):not(.headerlink):not(.cf-friends-link):not(.tag-Link):not(.btn-anzhiyu):not(
|
||||
.no-text-decoration
|
||||
) {
|
||||
font-weight: 500;
|
||||
border-bottom: solid 2px var(--anzhiyu-lighttext);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
padding: 0 0.2em;
|
||||
text-decoration: none;
|
||||
font-family: auto;
|
||||
}
|
||||
#article-container
|
||||
a:not([data-fancybox="gallery"]):not(.headerlink):not(.cf-friends-link):not(.btn-anzhiyu):not(
|
||||
.no-text-decoration
|
||||
):hover {
|
||||
color: var(--anzhiyu-white);
|
||||
background: var(--anzhiyu-main);
|
||||
box-shadow: var(--anzhiyu-shadow-lightblack);
|
||||
border-radius: 0.25em;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html.hide-aside .layout > div:first-child {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 动画wowjs兼容调整 */
|
||||
.animate__animated {
|
||||
-webkit-animation-fill-mode: backwards !important;
|
||||
animation-fill-mode: backwards !important;
|
||||
}
|
||||
|
||||
/* 文章hover边框 */
|
||||
#recent-posts .recent-post-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
}
|
||||
#recent-posts .recent-post-item:hover .recent-post-info .article-title {
|
||||
color: var(--anzhiyu-theme);
|
||||
}
|
||||
#recent-posts .recent-post-item {
|
||||
height: fit-content;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
border: var(--style-border);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
user-select: none;
|
||||
}
|
||||
/* 移动端容器padding */
|
||||
@media screen and (max-width: 768px) {
|
||||
#body-wrap .layout #page {
|
||||
padding: 20px 15px !important;
|
||||
}
|
||||
}
|
||||
/* 首页文章宽度 */
|
||||
@media screen and (max-width: 1200px) {
|
||||
.layout > div:first-child {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="dark"] #footer:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.layout > div:first-child:not(.recent-posts) {
|
||||
border-radius: 12px 12px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.banners-title {
|
||||
animation: slide-in 0.6s 0.3s backwards;
|
||||
}
|
||||
#algolia-search .search-dialog {
|
||||
animation: slide-in 0.6s ease 0s 1 normal none running;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1200px) {
|
||||
#page > div:not(.author-content-item) {
|
||||
animation: slide-in 0.6s 0.2s backwards;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1200px) {
|
||||
.author-content-item {
|
||||
animation: slide-in 0.6s 0s backwards;
|
||||
}
|
||||
}
|
||||
|
||||
/* 元素透明度改变 */
|
||||
@keyframes slide-in-op {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,53 @@
|
||||
#aside-content .card-widget#card-wechat {
|
||||
background: #57bd6a;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
height: 110px;
|
||||
}
|
||||
[data-theme="dark"] #aside-content .card-widget#card-wechat {
|
||||
background-color: #121121;
|
||||
border: var(--style-border);
|
||||
}
|
||||
|
||||
#flip-wrapper {
|
||||
-webkit-perspective: 1000;
|
||||
perspective: 1000;
|
||||
}
|
||||
|
||||
#flip-wrapper {
|
||||
position: relative;
|
||||
width: 235px;
|
||||
height: 110px;
|
||||
z-index: 1;
|
||||
}
|
||||
#flip-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
transition: cubic-bezier(0, 0, 0, 1.29) 0.3s;
|
||||
}
|
||||
#aside-content #flip-wrapper #flip-content .face {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
#aside-content #flip-wrapper #flip-content .back.face {
|
||||
display: block;
|
||||
-webkit-transform: rotateY(180deg);
|
||||
transform: rotateY(180deg);
|
||||
box-sizing: border-box;
|
||||
background-size: 100%;
|
||||
}
|
||||
#flip-wrapper:hover #flip-content {
|
||||
-webkit-transform: rotateY(180deg);
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
/* 分类目录条、标签目录条 */
|
||||
#catalog-bar {
|
||||
border-radius: var(--anzhiyu-border-radius);
|
||||
display: flex;
|
||||
border: var(--anzhiyu-border-radius);
|
||||
margin-bottom: 1rem;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#catalog-bar:hover {
|
||||
border-color: var(--anzhiyu-theme);
|
||||
}
|
||||
|
||||
#catalog-bar i {
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
#catalog-list {
|
||||
/* 分类/标签较少时，可以选择不设置 width，居中显示 catalog-list-item */
|
||||
display: flex;
|
||||
white-space: nowrap;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
#catalog-list::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.catalog-list-item a {
|
||||
margin-right: 0.3rem;
|
||||
font-weight: bold;
|
||||
color: var(--font-color);
|
||||
transition: all 0.3s ease-in-out;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.1rem 0.5rem;
|
||||
border-radius: 8px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.catalog-list-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.catalog-list-item.selected a {
|
||||
background: var(--anzhiyu-lighttext);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
a.catalog-more {
|
||||
min-width: fit-content;
|
||||
font-weight: bold;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
a.catalog-more:hover {
|
||||
color: var(--anzhiyu-theme);
|
||||
}
|
||||
@@ -0,0 +1,105 @@
|
||||
#categoryBar {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#category-bar {
|
||||
padding: 0.5rem 10px;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
display: flex;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
border: var(--style-border);
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
border-radius: 12px;
|
||||
transition: all 0.3s ease 0s;
|
||||
animation: slide-in 0.6s 0.3s backwards;
|
||||
}
|
||||
|
||||
.category-bar-next {
|
||||
margin-left: 16px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.category-bar-next:hover {
|
||||
color: var(--anzhiyu-lighttext);
|
||||
}
|
||||
|
||||
#category-bar #catalog-bar {
|
||||
margin-bottom: 0;
|
||||
overflow-y: hidden;
|
||||
margin: -0.2rem 0;
|
||||
}
|
||||
|
||||
#category-bar.category-bar:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
|
||||
#category #category-bar {
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#category a.catalog-list-item.select a {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#category #catalog-list .catalog-list-item:first-child {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.catalog-list-item:hover a {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
.catalog-list-item.select a {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.category-bar-more {
|
||||
margin-left: 1rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
[data-theme="dark"] #category-bar.category-bar {
|
||||
background: var(--anzhiyu-background);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#catalog-bar i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
#categoryBar {
|
||||
margin-bottom: 0;
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 60px;
|
||||
z-index: 2;
|
||||
align-items: center;
|
||||
margin-top: 0;
|
||||
}
|
||||
#category-bar.category-bar {
|
||||
width: 100%;
|
||||
}
|
||||
#category-bar.category-bar {
|
||||
background: var(--anzhiyu-background);
|
||||
}
|
||||
[data-theme="dark"] #category-bar.category-bar {
|
||||
background: var(--anzhiyu-black);
|
||||
}
|
||||
#category-bar.category-bar:hover {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
#category-bar {
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
padding: 0.5rem 20px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,137 @@
|
||||
/*和风天气 */
|
||||
#he-plugin-simple {
|
||||
z-index: 92;
|
||||
transition: 0.3s;
|
||||
position: fixed !important;
|
||||
}
|
||||
|
||||
#he-plugin-simple.shown {
|
||||
opacity: 0.5;
|
||||
pointer-events: unset;
|
||||
}
|
||||
|
||||
#he-plugin-simple .sticker-important {
|
||||
color: var(--anzhiyu-white) !important;
|
||||
}
|
||||
|
||||
.s-sticker div[data-v-41ba7e2c]:not(:first-child):not(:last-child) {
|
||||
padding: 0 0.07em !important;
|
||||
}
|
||||
|
||||
body:has(#sidebar-menus.open) #he-plugin-simple {
|
||||
z-index: 104;
|
||||
left: 95px !important;
|
||||
opacity: 1;
|
||||
display: block;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
div.s-sticker {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.s-sticker div {
|
||||
color: var(--font-color) !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
body:has(.post-bg.nav-fixed) #he-plugin-simple .s-sticker div {
|
||||
color: var(--font-color) !important;
|
||||
}
|
||||
body:has(.post-bg) #he-plugin-simple .s-sticker div {
|
||||
color: var(--anzhiyu-white) !important;
|
||||
}
|
||||
[data-theme="dark"] body:has(.post-bg) #he-plugin-simple .s-sticker div {
|
||||
color: var(--font-color) !important;
|
||||
}
|
||||
|
||||
#weather-view-he {
|
||||
height: 285px !important;
|
||||
padding: 10px !important;
|
||||
border-radius: 10px !important;
|
||||
background-color: var(--anzhiyu-card-bg) !important;
|
||||
box-shadow: rgba(0, 0, 0, 0.1) 0 0 20px;
|
||||
margin-top: 20px !important;
|
||||
transform: 0.3s;
|
||||
opacity: 1;
|
||||
}
|
||||
.s-sticker ~ [data-v-41ba7e2c] {
|
||||
opacity: 0;
|
||||
}
|
||||
[data-v-41ba7e2c]:has([data-v-db6ccf64][data-v-41ba7e2c]) {
|
||||
opacity: 1;
|
||||
}
|
||||
[data-v-db6ccf64][data-v-41ba7e2c] {
|
||||
top: 38px !important;
|
||||
}
|
||||
.wv-lt-location,
|
||||
.wv-lt-refresh {
|
||||
display: inline-block;
|
||||
}
|
||||
.wv-lt-location a {
|
||||
padding: 0 5px;
|
||||
border-radius: 3px;
|
||||
color: var(--anzhiyu-blue) !important;
|
||||
background-color: var(--anzhiyu-blue-tint);
|
||||
text-decoration: none !important;
|
||||
}
|
||||
.wv-lt-col-5 {
|
||||
text-align: right;
|
||||
}
|
||||
.wv-lt-refresh a {
|
||||
font-size: 0 !important;
|
||||
}
|
||||
.wv-lt-refresh a::after {
|
||||
content: "\5b89\77e5\9c7c\548c\98ce";
|
||||
font-size: small !important;
|
||||
}
|
||||
.vw-f-cell a,
|
||||
.wv-n-h-now-rain-text,
|
||||
.wv-n-h-now-tmp span,
|
||||
.wv-n-h-now-txt span,
|
||||
.wv-n-h-now-txt-t {
|
||||
color: var(--anzhiyu-fontcolor) !important;
|
||||
}
|
||||
.wv-f-table div .vw-f-cell:nth-child(1) a {
|
||||
color: #9b9b9b !important;
|
||||
}
|
||||
.wv-top-backdrop {
|
||||
height: 285px !important;
|
||||
padding-top: 50px !important;
|
||||
}
|
||||
.wv-top-backdrop::after {
|
||||
content: "\8BF7\4F7F\7528\952E\76D8\2191\2193\9009\62E9\FF0C\56DE\8F66\9009\5B9A" !important;
|
||||
padding-left: 5%;
|
||||
}
|
||||
.wv-top-button,
|
||||
.wv-top-select {
|
||||
height: 36px !important;
|
||||
border: none !important;
|
||||
border-radius: 5px !important;
|
||||
cursor: pointer;
|
||||
transition: 0.25s;
|
||||
}
|
||||
.wv-top-select {
|
||||
padding-left: 10px !important;
|
||||
}
|
||||
.wv-top-button {
|
||||
background-color: var(--anzhiyu-blue) !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.wv-top-button:hover {
|
||||
background-color: var(--anzhiyu-blue-hover) !important;
|
||||
}
|
||||
.wv-top-button:active {
|
||||
background-color: var(--anzhiyu-blue-hover) !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1400px) {
|
||||
#he-plugin-simple {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1400px) and (max-width: 1690px) {
|
||||
#he-plugin-simple {
|
||||
left: 262px !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,83 @@
|
||||
#article-container ol,
|
||||
#article-container ul {
|
||||
margin-top: 0.4rem;
|
||||
padding: 0px 0px 0px 0.8rem;
|
||||
list-style: none;
|
||||
counter-reset: li 0;
|
||||
}
|
||||
#article-container code {
|
||||
padding: 0.2rem 0.4rem;
|
||||
border-radius: 4px;
|
||||
margin: 0 4px;
|
||||
line-height: 2;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
}
|
||||
#article-container.post-content li::marker {
|
||||
content: none;
|
||||
}
|
||||
#article-container ol li:not(.tab),
|
||||
#article-container ul li:not(.tab) {
|
||||
position: relative;
|
||||
margin: 0.2rem 0px;
|
||||
}
|
||||
#article-container ul > li:not(.tab) {
|
||||
padding: 0.2em 0.2em 0.2em 1.4em;
|
||||
}
|
||||
#article-container ul > li:not(.tab):before {
|
||||
border: 0.21em solid var(--anzhiyu-lighttext);
|
||||
background: var(--anzhiyu-lighttext);
|
||||
}
|
||||
#article-container ul > li:not(.tab)::before {
|
||||
top: 0.78em;
|
||||
width: 0.42em;
|
||||
height: 0.42em;
|
||||
border-radius: 0.42em;
|
||||
content: "";
|
||||
line-height: 0.42em;
|
||||
}
|
||||
|
||||
#article-container ol li::before,
|
||||
#article-container ul li::before {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
background: var(--anzhiyu-main);
|
||||
color: rgb(255, 255, 255);
|
||||
transition: all 0.3s ease-out 0s;
|
||||
}
|
||||
#article-container ol > li::before {
|
||||
margin-top: 0.65em;
|
||||
width: 1.45em;
|
||||
height: 1.45em;
|
||||
border-radius: 0.725em;
|
||||
content: counter(li);
|
||||
counter-increment: li 1;
|
||||
text-align: center;
|
||||
font-size: 0.85em;
|
||||
line-height: 1.45em;
|
||||
}
|
||||
#article-container ol[start] {
|
||||
counter-reset: unset;
|
||||
}
|
||||
#article-container ol li:not(.tab),
|
||||
#article-container ul li:not(.tab) {
|
||||
position: relative;
|
||||
margin: 0.2rem 0px;
|
||||
}
|
||||
#article-container ol > li:not(.tab) {
|
||||
padding: 0.2em 0.2em 0.2em 1.8em;
|
||||
}
|
||||
|
||||
/* 代码框主题 */
|
||||
#article-container figure.highlight {
|
||||
border-radius: 10px;
|
||||
}
|
||||
#post-comment blockquote {
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border: var(--style-border);
|
||||
box-shadow: none;
|
||||
margin: 0px 0px 0.5rem;
|
||||
font-size: 12px;
|
||||
color: var(--anzhiyu-secondtext);
|
||||
border-radius: 8px;
|
||||
}
|
||||
@@ -0,0 +1,70 @@
|
||||
details.folding-tag[open] {
|
||||
border-radius: 15px !important;
|
||||
border-color: var(--anzhiyu-main) !important;
|
||||
border: 1px solid var(--anzhiyu-main) !important;
|
||||
}
|
||||
|
||||
li details.folding-tag {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
li details.folding-tag summary {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
details.folding-tag {
|
||||
transition: border 0s ease !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
details.folding-tag[open] > summary {
|
||||
color: var(--anzhiyu-white) !important;
|
||||
background: var(--anzhiyu-main) !important;
|
||||
border: 1px solid var(--anzhiyu-main) !important;
|
||||
border-top: none !important;
|
||||
border-left: none !important;
|
||||
border-right: none !important;
|
||||
border-bottom-left-radius: 0 !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
}
|
||||
details.folding-tag > summary {
|
||||
border: var(--style-border) !important;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 14px !important;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
color: var(--font-color) !important;
|
||||
user-select: none;
|
||||
}
|
||||
details.folding-tag > summary::marker {
|
||||
color: var(--anzhiyu-main);
|
||||
font-size: 16px;
|
||||
}
|
||||
details.folding-tag > summary::before {
|
||||
content: " ";
|
||||
margin-right: 2px;
|
||||
}
|
||||
details.folding-tag[open] > div.content {
|
||||
border-radius: 0 0 16px 16px;
|
||||
}
|
||||
details.folding-tag summary:hover::marker {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
details.folding-tag[open] > summary::marker {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
details.folding-tag summary:hover {
|
||||
cursor: pointer;
|
||||
background: var(--anzhiyu-main) !important;
|
||||
color: var(--anzhiyu-white) !important;
|
||||
transition: 0.3s;
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
details .content > *:nth-child(1) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.flink details.folding-tag[open] > div.content {
|
||||
padding: 20px;
|
||||
margin: 0px;
|
||||
margin-top: 0;
|
||||
}
|
||||
@@ -0,0 +1,136 @@
|
||||
.comment-barrage {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 60px;
|
||||
padding: 0 0 20px 10px;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: end;
|
||||
align-items: flex-end;
|
||||
z-index: 999;
|
||||
transition: 0.3s;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.comment-barrage {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.comment-barrage-item {
|
||||
min-width: 300px;
|
||||
max-width: 300px;
|
||||
width: fit-content;
|
||||
min-height: 80px;
|
||||
max-height: 150px;
|
||||
margin: 4px;
|
||||
padding: 8px 14px;
|
||||
background: var(--anzhiyu-maskbgdeep);
|
||||
border-radius: 8px;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
animation: barrageIn 0.6s cubic-bezier(0.42, 0, 0.3, 1.11);
|
||||
transition: 0.3s;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: var(--style-border);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
transform: translateZ(0);
|
||||
position: fixed;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
}
|
||||
.comment-barrage-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
.comment-barrage-item.out {
|
||||
opacity: 0;
|
||||
animation: barrageOut 0.6s cubic-bezier(0.42, 0, 0.3, 1.11);
|
||||
}
|
||||
.comment-barrage-item a.barrageContent:hover {
|
||||
color: var(--anzhiyu-main);
|
||||
}
|
||||
.comment-barrage-item.hovered {
|
||||
opacity: 0;
|
||||
}
|
||||
.comment-barrage-item .comment-barrage-close {
|
||||
color: var(--anzhiyu-secondtext);
|
||||
cursor: pointer;
|
||||
line-height: 1;
|
||||
padding: 4px;
|
||||
}
|
||||
.comment-barrage-item .comment-barrage-close:hover {
|
||||
color: var(--anzhiyu-main);
|
||||
}
|
||||
.comment-barrage-item pre {
|
||||
display: none;
|
||||
}
|
||||
.comment-barrage-item p img:not(.tk-owo-emotion) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageHead {
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
line-height: 30px;
|
||||
font-size: 12px;
|
||||
border-bottom: var(--style-border);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: 700;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
.comment-barrage-item .barrageHead .barrageTitle {
|
||||
color: var(--anzhiyu-card-bg);
|
||||
margin-right: 8px;
|
||||
background: var(--anzhiyu-fontcolor);
|
||||
line-height: 1;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.comment-barrage-item .barrageHead .barrageTitle.barrageBloggerTitle {
|
||||
background: var(--anzhiyu-orange);
|
||||
}
|
||||
.comment-barrage-item .barrageAvatar {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
}
|
||||
.comment-barrage-item .barrageContent {
|
||||
font-size: 14px !important;
|
||||
font-weight: 400 !important;
|
||||
height: calc(100% - 30px);
|
||||
overflow: scroll;
|
||||
cursor: pointer;
|
||||
}
|
||||
.comment-barrage-item .barrageContent::-webkit-scrollbar {
|
||||
height: 0;
|
||||
width: 4px;
|
||||
}
|
||||
.comment-barrage-item .barrageContent::-webkit-scrollbar-button {
|
||||
display: none;
|
||||
}
|
||||
.comment-barrage-item .barrageContent p {
|
||||
margin: 8px 0;
|
||||
line-height: 1.3;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.comment-barrage-item .barrageContent blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
.comment-barrage-item .barrageContent h1,
|
||||
.comment-barrage-item .barrageContent h2,
|
||||
.comment-barrage-item .barrageContent h3,
|
||||
.comment-barrage-item .barrageContent h4 {
|
||||
font-size: 14px !important;
|
||||
font-weight: 400 !important;
|
||||
margin: 8px 0 !important;
|
||||
}
|
||||
@@ -0,0 +1,976 @@
|
||||
/* 中控台 */
|
||||
#console {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
justify-content: center;
|
||||
opacity: 0;
|
||||
transition: 0.3s ease-out, color 0s;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
margin: 0 !important;
|
||||
z-index: 2;
|
||||
}
|
||||
#console-music-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#console.show,
|
||||
#console.reward-show {
|
||||
opacity: 1;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
#console.reward-show .console-card-group {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#console .console-card-group {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0 30px;
|
||||
transform: translateY(20px);
|
||||
transition: 0.3s;
|
||||
opacity: 0;
|
||||
max-width: 80%;
|
||||
max-height: 70%;
|
||||
}
|
||||
|
||||
#console.show .console-card-group {
|
||||
transform: translateY(0px);
|
||||
opacity: 1;
|
||||
transition-delay: 0.1s;
|
||||
}
|
||||
|
||||
#console .console-card-group-left {
|
||||
margin-right: 0.5rem;
|
||||
width: 40%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#console .console-card-group-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
width: 60%;
|
||||
overflow: hidden;
|
||||
min-width: 575px;
|
||||
}
|
||||
|
||||
#console .console-card {
|
||||
background: var(--card-bg);
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
border: var(--style-border);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
padding: 40px;
|
||||
}
|
||||
|
||||
#console .console-card.tags {
|
||||
height: calc(100% - 172px);
|
||||
}
|
||||
|
||||
#console .console-mask {
|
||||
background: var(--anzhiyu-maskbgdeep);
|
||||
backdrop-filter: saturate(100%) blur(0px);
|
||||
-webkit-backdrop-filter: blur(0px);
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
transition: 0.3s;
|
||||
margin: 0px !important;
|
||||
}
|
||||
|
||||
#console.show .console-mask,
|
||||
#console.reward-show .console-mask {
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
#card-newest-comments .aside-list-item .thumbnail img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 8px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#card-newest-comments .aside-list-item {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
border: var(--style-border);
|
||||
padding: 12px 16px;
|
||||
width: 49%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 150px;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#card-newest-comments .aside-list-item:not(:last-child) {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
#card-newest-comments .aside-list-item .name {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
width: 130px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#console .author-content-item-tips {
|
||||
opacity: 0.8;
|
||||
font-size: 12px;
|
||||
margin-bottom: 0.5rem;
|
||||
color: var(--font-color);
|
||||
}
|
||||
|
||||
#console .author-content-item-title {
|
||||
font-size: 27px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: var(--font-color);
|
||||
}
|
||||
|
||||
#console .aside-list-item .thumbnail {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
#console .aside-list-item .content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
#card-newest-comments .aside-list-item:hover {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#console .aside-list-item .content .comment {
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
line-height: 24px;
|
||||
font-size: 14px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
#console .aside-list-item:hover .thumbnail,
|
||||
#console .aside-list-item:hover .content .comment,
|
||||
#console .aside-list-item:hover .content time {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#console .aside-list-item .content time {
|
||||
font-size: 12px;
|
||||
margin-top: auto;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#console .aside-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
#console .button-group {
|
||||
display: flex;
|
||||
margin: 1rem auto 0 auto;
|
||||
justify-content: center;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
#console .button-group .console-btn-item {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#console .button-group .console-btn-item:not(:last-child) {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
#console .button-group .console-btn-item a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--card-bg);
|
||||
border: var(--style-border);
|
||||
border-radius: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#console .button-group .console-btn-item.on a {
|
||||
background: var(--anzhiyu-orange);
|
||||
color: var(--anzhiyu-white);
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.console-card.tags .card-tag-cloud {
|
||||
margin-top: 1.5rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
max-height: 230px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.console-card.tags .card-tag-cloud a {
|
||||
color: var(--anzhiyu-fontcolor) !important;
|
||||
margin: 6px 4px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 8px;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border: var(--style-border);
|
||||
font-size: 14px !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.console-card.tags .card-tag-cloud a:hover {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white) !important;
|
||||
}
|
||||
|
||||
.console-card.tags .card-tag-cloud a sup {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#console .console-card.history {
|
||||
margin-top: 8px;
|
||||
padding: 0;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
overflow: hidden;
|
||||
min-width: 575px;
|
||||
}
|
||||
|
||||
#console .console-card.history .item-headline {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#console .console-card.history .card-archive-list {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#console .console-card.history .card-archive-list li.card-archive-list-item {
|
||||
flex: 0 0 25%;
|
||||
}
|
||||
|
||||
#console .console-card.history .card-archive-list .card-archive-list-link {
|
||||
border-radius: 8px;
|
||||
margin: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-content: space-between;
|
||||
border: var(--style-border);
|
||||
background: var(--card-bg);
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
#console .console-card.history .card-archive-list .card-archive-list-link:hover {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#console #card-newest-comments {
|
||||
height: 100%;
|
||||
min-height: 580px;
|
||||
}
|
||||
|
||||
#console .button-group i {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
#console hr {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#console ul {
|
||||
padding-left: 0;
|
||||
}
|
||||
#console ul li {
|
||||
list-style: none;
|
||||
}
|
||||
#console .console-card.history ul.card-archive-list {
|
||||
margin: -4px;
|
||||
}
|
||||
|
||||
[data-theme="dark"] #console .button-group .console-btn-item a.darkmode_switchbutton {
|
||||
background: var(--anzhiyu-orange);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
/* 控制台音乐css */
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap:hover
|
||||
.aplayer-bar
|
||||
.aplayer-played
|
||||
.aplayer-thumb {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer.aplayer-arrow .aplayer-icon-loop,
|
||||
.aplayer.aplayer-arrow .aplayer-icon-order {
|
||||
display: inline;
|
||||
}
|
||||
body:has(#console.show) .aplayer-volume-wrap {
|
||||
display: none;
|
||||
}
|
||||
body:has(#console.show) #nav-music {
|
||||
z-index: 10000;
|
||||
left: 45%;
|
||||
top: 23%;
|
||||
box-shadow: none;
|
||||
align-items: flex-start;
|
||||
transition: 0s;
|
||||
height: 35%;
|
||||
width: 42%;
|
||||
opacity: 1 !important;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
body:has(#console.show) #nav-music:active {
|
||||
transform: scale(1);
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-lrc {
|
||||
opacity: 1;
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc p.aplayer-lrc-current,
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc p {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
body:has(#console.show) #nav-music #nav-music-hoverTips {
|
||||
opacity: 0;
|
||||
height: 70px;
|
||||
width: 70px;
|
||||
margin-left: 0px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 14px #ffffffa6;
|
||||
transform: rotate(0deg) scale(1.1);
|
||||
border: var(--style-border-always);
|
||||
animation: changeright 24s linear infinite;
|
||||
margin-top: 10px;
|
||||
left: auto;
|
||||
}
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap
|
||||
.aplayer-bar
|
||||
.aplayer-loaded {
|
||||
display: block;
|
||||
border-radius: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
body:has(#console.show) meting-js {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-body {
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
cursor: auto;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 10px 10px 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer {
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
body:has(#console.show) #nav-music.playing {
|
||||
animation: none;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music {
|
||||
height: auto;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-info {
|
||||
flex-direction: column;
|
||||
height: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-play {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-play svg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-44%, -50%);
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
height: 70px;
|
||||
width: 70px;
|
||||
margin-left: 0px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-author {
|
||||
display: inline;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-title {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
cursor: auto;
|
||||
line-height: 2;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
max-width: 300px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: 0.3s;
|
||||
user-select: none;
|
||||
margin-right: 3px;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
top: 26px;
|
||||
align-items: center;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
|
||||
height: 10px;
|
||||
border-radius: 10px;
|
||||
background: #cdcdcd;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
display: block;
|
||||
bottom: 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer.aplayer-withlist
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-time
|
||||
.aplayer-icon.aplayer-icon-menu {
|
||||
display: none;
|
||||
}
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap
|
||||
.aplayer-bar
|
||||
.aplayer-played {
|
||||
background: var(--anzhiyu-main) !important;
|
||||
opacity: 0.8;
|
||||
animation: none;
|
||||
border-radius: 10px;
|
||||
}
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap
|
||||
.aplayer-bar
|
||||
.aplayer-played
|
||||
.aplayer-thumb {
|
||||
margin-top: -2px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc .aplayer-lrc-contents {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1200px) and (max-width: 1450px) {
|
||||
body:has(#console.show) #nav-music {
|
||||
left: 45%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 赞赏部分控制台css */
|
||||
.console-card-group-reward {
|
||||
opacity: 0;
|
||||
display: none;
|
||||
}
|
||||
.reward-show .console-card-group-reward {
|
||||
opacity: 1;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
.console-card-group-reward .reward-all {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.console-card-group-reward .reward-all .reward-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin: 0.625rem;
|
||||
}
|
||||
.console-card-group-reward .reward-all .reward-item img {
|
||||
width: 230px;
|
||||
height: 230px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
/* 移动端音乐列表 */
|
||||
body:has(#console.show) #nav-music .aplayer-list {
|
||||
display: block;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
background: white;
|
||||
left: 0;
|
||||
}
|
||||
body:has(#console.show) .aplayer-list {
|
||||
max-height: none !important;
|
||||
}
|
||||
body:has(#console.show) .aplayer-list {
|
||||
position: fixed;
|
||||
display: none;
|
||||
width: 100%;
|
||||
bottom: -76%;
|
||||
left: 0;
|
||||
background: var(--sidebar-bg);
|
||||
height: auto;
|
||||
border-radius: 15px 15px 0px 0px;
|
||||
padding: 15px 0px;
|
||||
}
|
||||
body:has(#console.show) .aplayer-list.aplayer-list-hide {
|
||||
bottom: 0% !important;
|
||||
}
|
||||
body:has(#console.show) ol > li {
|
||||
display: flex;
|
||||
margin: 0 10px;
|
||||
}
|
||||
body:has(#console.show) ol > li span.aplayer-list-title {
|
||||
width: 30%;
|
||||
}
|
||||
body:has(#console.show) ol > li.aplayer-list-light {
|
||||
background: #33a673;
|
||||
padding: 5px 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
body:has(#console.show) ol > li.aplayer-list-light span {
|
||||
color: #fff;
|
||||
}
|
||||
body:has(#console.show) ol > li span.aplayer-list-title {
|
||||
max-width: 55%;
|
||||
width: auto;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
body:has(#console.show) ol > li span.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;
|
||||
}
|
||||
body:has(#console.show) ol > li.aplayer-list-light span.aplayer-list-author {
|
||||
right: 15px;
|
||||
}
|
||||
/* 移动端音乐 */
|
||||
body:has(#console.show) meting-js {
|
||||
position: relative;
|
||||
}
|
||||
#console .console-card-group {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#console .console-card-group {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#console .console-card-group-right {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#consoleCommentBarrage {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#console .button-group {
|
||||
position: absolute;
|
||||
bottom: 70px;
|
||||
}
|
||||
body:has(#console.show) #nav-music #nav-music-hoverTips {
|
||||
display: none;
|
||||
}
|
||||
body:has(#console.show) #nav-music {
|
||||
position: fixed;
|
||||
display: block !important;
|
||||
left: 5.2%;
|
||||
top: 3.9rem !important;
|
||||
height: 70%;
|
||||
width: 85%;
|
||||
}
|
||||
body:has(#console.show) #console-music-bg {
|
||||
display: block;
|
||||
filter: blur(33px);
|
||||
display: block;
|
||||
background: #000000;
|
||||
opacity: 0.58;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transform: scale(1.2);
|
||||
}
|
||||
[data-theme="dark"] body:has(#console.show) #console-music-bg {
|
||||
background: var(--anzhiyu-white);
|
||||
}
|
||||
body:has(#console.show) #console-music-bg::after {
|
||||
box-shadow: inset 0 0px 10px 116px #000000;
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
[data-theme="dark"] body:has(#console.show) #console-music-bg::after {
|
||||
box-shadow: inset 0 0px 10px 116px var(--anzhiyu-white);
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
border-radius: 50%;
|
||||
animation: none;
|
||||
border: none;
|
||||
transform: none !important;
|
||||
box-shadow: none;
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
body:has(#console.show) #nav-music .aplayer {
|
||||
padding: 30px;
|
||||
border-radius: 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-title,
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music .aplayer-author {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-info {
|
||||
width: 100%;
|
||||
height: 45%;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-body {
|
||||
justify-content: space-between;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-info::after {
|
||||
position: absolute;
|
||||
content: "iPhone";
|
||||
top: -20px;
|
||||
left: 0;
|
||||
color: #b5b8bc;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-music {
|
||||
padding: 25px 0 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer.aplayer-withlrc .aplayer-lrc {
|
||||
height: 25px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc p.aplayer-lrc-current {
|
||||
color: var(--anzhiyu-white);
|
||||
font-size: 20px;
|
||||
line-height: 25px !important;
|
||||
float: left;
|
||||
white-space: nowrap;
|
||||
animation: an-text-roll 4s cubic-bezier(0.6, 0, 0.5, 1) alternate infinite;
|
||||
min-width: 100%;
|
||||
/* margin: 0; */
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc p {
|
||||
color: var(--anzhiyu-white);
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-lrc .aplayer-lrc-contents {
|
||||
margin: -40px 0px 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
color: var(--anzhiyu-white);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 15px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller {
|
||||
top: 58px;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-icon-back,
|
||||
body:has(#console.show) .aplayer .aplayer-icon-forward,
|
||||
body:has(#console.show) .aplayer .aplayer-icon-order,
|
||||
body:has(#console.show) .aplayer .aplayer-icon-play,
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer.aplayer-withlist
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-time
|
||||
.aplayer-icon.aplayer-icon-menu,
|
||||
body:has(#console.show) .aplayer.aplayer-mobile .aplayer-icon-volume-down {
|
||||
display: inline-block;
|
||||
opacity: 1;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-icon-volume-down {
|
||||
width: 36px;
|
||||
height: 30px;
|
||||
}
|
||||
body:has(#console.show) .aplayer-volume-wrap {
|
||||
position: absolute;
|
||||
top: 150px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 75px;
|
||||
}
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
|
||||
height: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
body:has(#console.show)
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap
|
||||
.aplayer-bar
|
||||
.aplayer-loaded {
|
||||
display: block;
|
||||
height: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer .aplayer-icon-back {
|
||||
left: 0;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-icon-forward {
|
||||
right: 0;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-icon-forward,
|
||||
body:has(#console.show) .aplayer .aplayer-icon-back {
|
||||
height: 40px;
|
||||
width: 33%;
|
||||
margin: 15px 0;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-play {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-pause {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-play svg {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-pic .aplayer-pause svg {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer .aplayer-icon-play {
|
||||
height: 50px;
|
||||
width: 33%;
|
||||
margin: 10px 0;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
body:has(#console.show)
|
||||
.aplayer.aplayer-withlist
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-time
|
||||
.aplayer-icon.aplayer-icon-menu {
|
||||
right: 0;
|
||||
}
|
||||
body:has(#console.show) .aplayer.aplayer-arrow .aplayer-icon-order {
|
||||
left: 0;
|
||||
}
|
||||
body:has(#console.show)
|
||||
.aplayer.aplayer-withlist
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-time
|
||||
.aplayer-icon.aplayer-icon-menu,
|
||||
body:has(#console.show) .aplayer.aplayer-arrow .aplayer-icon-order {
|
||||
height: 40px;
|
||||
width: 33%;
|
||||
top: 80px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
body:has(#console.show) .aplayer.aplayer-arrow .aplayer-icon-loop {
|
||||
height: 40px;
|
||||
width: 33%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 80px;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
body:has(#console.show) #nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-time-inner {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon path {
|
||||
fill: var(--anzhiyu-white);
|
||||
}
|
||||
body:has(#console.show) .aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap {
|
||||
overflow: visible;
|
||||
bottom: 0px;
|
||||
left: 45px;
|
||||
right: auto;
|
||||
}
|
||||
body:has(#console.show)
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-volume-wrap
|
||||
.aplayer-volume-bar-wrap
|
||||
.aplayer-volume-bar,
|
||||
body:has(#console.show)
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-volume-wrap
|
||||
.aplayer-volume-bar-wrap
|
||||
.aplayer-volume-bar
|
||||
.aplayer-volume {
|
||||
width: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 867px) {
|
||||
#center-console:checked + label {
|
||||
display: none;
|
||||
}
|
||||
#console .console-card-group {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#consoleHideAside {
|
||||
display: none;
|
||||
}
|
||||
.console-card-group-reward .reward-all .reward-item img {
|
||||
width: 130px;
|
||||
height: 130px;
|
||||
}
|
||||
#console #consoleKeyboard {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 800px) {
|
||||
#console .console-card-group {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#consoleMusic {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#consoleCommentBarrage {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body:has(#console.show) #nav-music {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
#console .button-group .console-btn-item a:hover {
|
||||
background: var(--anzhiyu-main) !important;
|
||||
}
|
||||
#console .button-group .console-btn-item:hover a {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
body:has(#console.show) #nav-music {
|
||||
width: 90%;
|
||||
}
|
||||
#center-console + label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
/* 歌词超出文本滚动动画 */
|
||||
@keyframes an-text-roll {
|
||||
from {
|
||||
margin-left: 0;
|
||||
}
|
||||
to {
|
||||
margin-left: 100%;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,309 @@
|
||||
body[data-type="essay"] #page {
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
body[data-type="essay"] #page .page-title {
|
||||
display: none;
|
||||
}
|
||||
body[data-type="essay"] #web_bg {
|
||||
background: var(--anzhiyu-background);
|
||||
}
|
||||
#bber .bber-container-img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
#bber .bber-container-img .bber-content-noimg {
|
||||
width: calc(100% / 4 - 5px);
|
||||
}
|
||||
|
||||
#bber .bber-content-img img {
|
||||
object-fit: cover;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
#bber .bber-content-img,
|
||||
#bber .bber-content-video {
|
||||
height: 100px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
width: calc(100% / 4 - 5px);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#bber .bber-content-video video {
|
||||
border-radius: 8px;
|
||||
object-fit: cover;
|
||||
max-height: 100%;
|
||||
}
|
||||
#bber .bber-content-video::after {
|
||||
content: "视频";
|
||||
display: inline-block;
|
||||
padding: 1px 6px;
|
||||
background: var(--anzhiyu-black-op);
|
||||
border-radius: 8px;
|
||||
margin-left: 4px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: var(--anzhiyu-white);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
transform: translateZ(0);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 4px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#bber .bber-content .datacont {
|
||||
order: 0;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
width: 100%;
|
||||
line-height: 1.38;
|
||||
border-radius: 12px;
|
||||
margin-bottom: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: justify;
|
||||
}
|
||||
#bber p {
|
||||
margin: 0px;
|
||||
}
|
||||
#bber div.bber-content {
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
border-radius: 12px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#bber .timeline ul li.bber-item {
|
||||
position: relative;
|
||||
width: 32%;
|
||||
border: var(--style-border-always);
|
||||
border-radius: 12px;
|
||||
padding: 1rem 1rem 0.5rem;
|
||||
transition: all 0.3s ease 0s;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
margin-right: 2%;
|
||||
}
|
||||
#bber .timeline #waterfall.show {
|
||||
opacity: 1;
|
||||
}
|
||||
#bber .timeline #waterfall {
|
||||
opacity: 0;
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
#bber ul.list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#bber {
|
||||
margin-top: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
#bber > section > ul > li.bber-item {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#bber-tips {
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
#bber .timeline ul li.bber-item hr {
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin: 8px 0px;
|
||||
border: 1px dashed var(--anzhiyu-theme-op);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#bber .bber-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#bber > section > ul > li > div .bber-info-time,
|
||||
#bber > section > ul > li > div .bber-info-from {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-size: 0.7rem;
|
||||
background-color: var(--anzhiyu-gray-op);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
cursor: default;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#bber .bber-info .anzhiyufont.anzhiyu-icon-clock {
|
||||
margin-right: 4px;
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
#bber > section > ul > li > div .bber-info-from span,
|
||||
#bber > section > ul > li > div .bber-info-from {
|
||||
margin-left: 4px;
|
||||
}
|
||||
#bber > section > ul > li > div .bber-info-from i {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
#bber .bber-item hr::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#bber .bber-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.bber-reply {
|
||||
cursor: pointer !important;
|
||||
}
|
||||
|
||||
.bber-reply:hover {
|
||||
color: var(--anzhiyu-main);
|
||||
max-height: 35px;
|
||||
}
|
||||
|
||||
#bber .timeline ul li.bber-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
}
|
||||
|
||||
#bber .bber-content-link {
|
||||
display: flex;
|
||||
margin-left: 0.5rem;
|
||||
font-size: 0.7rem;
|
||||
align-items: center;
|
||||
background-color: rgba(245, 108, 108, 0.13);
|
||||
color: rgb(245, 108, 108);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
#bber .bber-content-link i {
|
||||
margin-right: 3px;
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
#bber .bber-content-link:hover {
|
||||
background-color: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
#bber .bber-music {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
margin: 0.5rem 0;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
border: var(--style-border-always);
|
||||
background: var(--anzhiyu-secondbg);
|
||||
}
|
||||
#bber .aplayer {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#bber .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
height: 82px;
|
||||
width: 82px;
|
||||
margin: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.bber-music .aplayer.aplayer-withlrc .aplayer-info {
|
||||
padding: 5px 7px 0;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-music {
|
||||
height: 23px;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-music .aplayer-title {
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#bber .aplayer .aplayer-info .aplayer-controller {
|
||||
align-items: center;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
|
||||
padding: 0;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
position: initial;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
|
||||
background: var(--anzhiyu-gray);
|
||||
height: 8px;
|
||||
border-radius: 12px;
|
||||
transition: 0.3s;
|
||||
overflow: hidden;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded {
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played {
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb {
|
||||
display: none;
|
||||
}
|
||||
#bber .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
position: initial;
|
||||
}
|
||||
|
||||
/* 顶部样式 */
|
||||
.author-content.author-content-item.essayPage {
|
||||
height: 19rem;
|
||||
color: var(--anzhiyu-white);
|
||||
overflow: hidden;
|
||||
margin-top: 0px;
|
||||
}
|
||||
body[data-type="essay"] #page .author-content-item .card-content .banner-button-group .banner-button:hover {
|
||||
color: var(--anzhiyu-white);
|
||||
border-radius: 20px !important;
|
||||
}
|
||||
|
||||
/* 响应式 */
|
||||
@media screen and (max-width: 1200px) {
|
||||
#bber .timeline ul li.bber-item {
|
||||
width: 49%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#bber .timeline ul li.bber-item {
|
||||
width: 100%;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
[data-theme="dark"] #bber .bber-music .aplayer,
|
||||
[data-theme="dark"] #bber .aplayer .aplayer-lrc:before,
|
||||
[data-theme="dark"] #bber .aplayer .aplayer-lrc:after {
|
||||
background: var(--anzhiyu-card-bg);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
#bber .aplayer .aplayer-lrc p {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
min-height: 40px;
|
||||
line-height: 30px !important;
|
||||
height: 40px !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
@@ -0,0 +1,101 @@
|
||||
#bbTimeList {
|
||||
background: var(--anzhiyu-white);
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: var(--anzhiyu-shadow-lightblack);
|
||||
display: flex;
|
||||
transition: all 0.3s ease 0s;
|
||||
margin: 1rem auto 0;
|
||||
border: var(--style-border);
|
||||
align-items: center;
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
max-width: calc(1400px - 3rem);
|
||||
animation: slide-in .6s 0s backwards;
|
||||
}
|
||||
@media screen and (max-width: 1400px) {
|
||||
#bbTimeList {
|
||||
max-width: calc(100% - 3rem);
|
||||
animation: slide-in 0.6s 0s backwards;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
div#bbTimeList {
|
||||
margin: 0 20px 15px;
|
||||
}
|
||||
}
|
||||
[data-theme="dark"] #bbTimeList {
|
||||
background: #000 !important;
|
||||
}
|
||||
#bbtalk {
|
||||
width: 100%;
|
||||
}
|
||||
#bber-talk {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
i.bber-logo {
|
||||
font-size: 2rem;
|
||||
line-height: 22px;
|
||||
margin-right: 1rem;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
i.bber-logo:hover,
|
||||
i.bber-gotobb:hover {
|
||||
color: var(--anzhiyu-main);
|
||||
}
|
||||
|
||||
i.bber-gotobb {
|
||||
line-height: 30px;
|
||||
margin-left: 1rem;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#bber-talk .li-style {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: 0.3s;
|
||||
font-weight: 700;
|
||||
margin: auto;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#bber-talk .li-style:hover {
|
||||
color: var(--anzhiyu-main);
|
||||
}
|
||||
|
||||
#bbTimeList:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
|
||||
/* 文章页H1-H6图标样式效果 */
|
||||
@-webkit-keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: rotate(-1turn);
|
||||
transform: rotate(-1turn);
|
||||
}
|
||||
}
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: rotate(-1turn);
|
||||
transform: rotate(-1turn);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,323 @@
|
||||
/* 音乐播放器 */
|
||||
|
||||
.aplayer.aplayer-narrow .aplayer-body,
|
||||
.aplayer.aplayer-narrow .aplayer-pic {
|
||||
height: 66px;
|
||||
width: 66px;
|
||||
}
|
||||
|
||||
/* 导航栏音乐 */
|
||||
@media screen and (max-width: 1200px) {
|
||||
#nav-music {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
#nav-music {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 9;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s, left 0s;
|
||||
transform-origin: left bottom;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
border-radius: 40px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#nav-music:active {
|
||||
transform: scale(0.97);
|
||||
}
|
||||
|
||||
#nav-music.playing {
|
||||
border: var(--style-border);
|
||||
box-shadow: 0 0px 12px -3px var(--anzhiyu-none);
|
||||
animation: playingShadow 5s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes playingShadow {
|
||||
0% {
|
||||
box-shadow: 0 0px 12px -3px var(--anzhiyu-none);
|
||||
}
|
||||
|
||||
50% {
|
||||
box-shadow: 0 0px 12px 0px var(--anzhiyu-main);
|
||||
}
|
||||
|
||||
100% {
|
||||
box-shadow: 0 0px 12px -3px var(--anzhiyu-none);
|
||||
}
|
||||
}
|
||||
|
||||
#nav-music .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
border-radius: 40px;
|
||||
z-index: 1;
|
||||
transition: 0.3s;
|
||||
transform: rotate(0deg) scale(1);
|
||||
border: var(--style-border-always);
|
||||
animation: changeright 24s linear infinite;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
#nav-music.playing .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
box-shadow: 0 0 14px #ffffffa6;
|
||||
transform: rotate(0deg) scale(1.1);
|
||||
border-color: var(--anzhiyu-white);
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
@keyframes changeright {
|
||||
0% {
|
||||
transform: rotate(0deg) scale(1.1);
|
||||
box-shadow: 0 0 2px #ffffff00;
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: rotate(90deg) scale(1.1);
|
||||
box-shadow: 0 0 14px #ffffff;
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: rotate(180deg) scale(1.1);
|
||||
box-shadow: 0 0 2px #ffffff00;
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: rotate(270deg) scale(1.1);
|
||||
box-shadow: 0 0 14px #ffffff;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg) scale(1.1);
|
||||
box-shadow: 0 0 2px #ffffff00;
|
||||
}
|
||||
}
|
||||
|
||||
#nav-music .aplayer.aplayer-withlrc .aplayer-info {
|
||||
height: 100%;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#nav-music.playing .aplayer.aplayer-withlrc .aplayer-info {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#nav-music.playing #nav-music-hoverTips {
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
#nav-music #nav-music-hoverTips {
|
||||
color: var(--anzhiyu-white);
|
||||
background: var(--anzhiyu-main);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
border-radius: 40px;
|
||||
opacity: 0;
|
||||
font-size: 12px;
|
||||
z-index: 2;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
#nav-music:hover:not(.playing) #nav-music-hoverTips {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#nav-music
|
||||
.aplayer
|
||||
.aplayer-info
|
||||
.aplayer-controller
|
||||
.aplayer-bar-wrap:hover
|
||||
.aplayer-bar
|
||||
.aplayer-played
|
||||
.aplayer-thumb {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer {
|
||||
background: var(--card-bg);
|
||||
border-radius: 60px;
|
||||
height: 41px;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
transition: 0.3s;
|
||||
border: var(--style-border);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#nav-music.playing .aplayer {
|
||||
background: var(--anzhiyu-main);
|
||||
border: var(--style-border-hover);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
backdrop-filter: blur(20px);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-notice {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-miniswitcher {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-body {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#nav-music .aplayer-list {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-music {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 12px 0 8px;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-time {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-music .aplayer-author {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer.aplayer-withlist .aplayer-info {
|
||||
border: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-pic .aplayer-button {
|
||||
bottom: 50%;
|
||||
right: 50%;
|
||||
transform: translate(50%, 50%);
|
||||
margin: 0;
|
||||
transition: 0.3s;
|
||||
}
|
||||
#nav-music .aplayer .aplayer-pic:has(.aplayer-button.aplayer-play) {
|
||||
animation-play-state: paused;
|
||||
transform: rotate(0deg) scale(1) !important;
|
||||
}
|
||||
#nav-music .aplayer.aplayer-withlrc .aplayer-pic {
|
||||
margin-left: 8px;
|
||||
}
|
||||
#nav-music .aplayer .aplayer-info .aplayer-music .aplayer-title {
|
||||
cursor: pointer;
|
||||
line-height: 1;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
max-width: 120px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: 0.3s;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
|
||||
height: 100%;
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played {
|
||||
height: 100%;
|
||||
opacity: 0.1;
|
||||
background-color: var(--anzhiyu-white) !important;
|
||||
animation: lightBar 5s ease infinite;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
#nav-music.playing .aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played {
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
@keyframes lightBar {
|
||||
0% {
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
60% {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0.1;
|
||||
}
|
||||
}
|
||||
|
||||
/* 歌词 */
|
||||
#nav-music .aplayer.aplayer-withlrc .aplayer-lrc {
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
transition: 0.3s;
|
||||
margin-top: -2px;
|
||||
padding: 5px 0;
|
||||
}
|
||||
#nav-music.stretch .aplayer.aplayer-withlrc .aplayer-lrc {
|
||||
width: 200px;
|
||||
margin-left: 8px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-lrc p.aplayer-lrc-current {
|
||||
color: var(--anzhiyu-white);
|
||||
border: none;
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-lrc:after,
|
||||
#nav-music .aplayer .aplayer-lrc:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-lrc p {
|
||||
color: #ffffffb3;
|
||||
line-height: 40px !important;
|
||||
height: 40px !important;
|
||||
margin: 0px 0;
|
||||
vertical-align: top;
|
||||
/* display: inline-block; */
|
||||
}
|
||||
|
||||
#nav-music .aplayer .aplayer-pic {
|
||||
pointer-events: none;
|
||||
}
|
||||
#nav-music .aplayer .aplayer-pic .aplayer-button {
|
||||
pointer-events: all;
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
/* bilibli番剧插件 */
|
||||
#page #article-container .bangumi-tab.bangumi-active {
|
||||
background: var(--anzhiyu-theme);
|
||||
color: var(--anzhiyu-ahoverbg);
|
||||
border-radius: 10px;
|
||||
}
|
||||
#page #article-container .bangumi-tabs .bangumi-tab {
|
||||
border-bottom: none;
|
||||
border-radius: 10px;
|
||||
}
|
||||
#page #article-container .bangumi-tabs a.bangumi-tab:hover {
|
||||
text-decoration: none !important;
|
||||
border-radius: 10px;
|
||||
column-gap: var(--anzhiyu-ahoverbg);
|
||||
}
|
||||
#page #article-container .bangumi-pagination a.bangumi-button {
|
||||
border-bottom: none;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.bangumi-button:hover {
|
||||
background: var(--anzhiyu-theme) !important;
|
||||
border-radius: 10px !important;
|
||||
color: var(--anzhiyu-ahoverbg) !important;
|
||||
}
|
||||
a.bangumi-button.bangumi-nextpage:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
.bangumi-button {
|
||||
padding: 5px 10px !important;
|
||||
}
|
||||
|
||||
a.bangumi-tab {
|
||||
padding: 5px 10px !important;
|
||||
}
|
||||
svg.icon.faa-tada {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.bangumi-info-item {
|
||||
border-right: 1px solid #f2b94b;
|
||||
}
|
||||
.bangumi-info-item span {
|
||||
color: #f2b94b;
|
||||
}
|
||||
.bangumi-info-item em {
|
||||
color: #f2b94b;
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
/*哔哩哔哩视频适配*/
|
||||
.aspect-ratio {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
padding-bottom: 75%;
|
||||
margin: 3% auto;
|
||||
text-align: center;
|
||||
}
|
||||
.aspect-ratio iframe {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
#page:has(#lib-cards):has(#libCategories) #post-comment .tk-comments-container > .tk-comment {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#libCategories {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
#page:has(#lib-cards):has(#libCategories) h1.page-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
body[data-type="categories"] #body-wrap #category {
|
||||
padding: 20px 15px 20px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
.card-glass .card-background {
|
||||
box-shadow: none;
|
||||
margin: 0 15px;
|
||||
}
|
||||
[data-theme="dark"] .card-glass .card-background {
|
||||
background-color: transparent;
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
/* 留言板样式补丁 */
|
||||
#maincontent #form-wrap .formmain .comments-main h3.title3 {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
body[data-type="envelope"] #page #post-comment .tk-comments-container > .tk-comment {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
[data-theme="dark"] #universe {
|
||||
display: block;
|
||||
position: fixed;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
}
|
||||
canvas#universe {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
@media screen and (max-width: 768px) {
|
||||
#page .fcircle_page .author-content-item .card-content .banner-button-group .banner-button i,
|
||||
#page .fcircle_page .author-content-item .card-content .banner-button-group .banner-button svg {
|
||||
margin-left: 140px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
#gitcalendar #git_container ul li {
|
||||
margin: 0 !important;
|
||||
}
|
||||
#gitcalendar #git_container ul li::before{
|
||||
content: none !important;
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
.dplayer-video-wrap,
|
||||
.dplayer {
|
||||
border-radius: 12px;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
.note .hide-block {
|
||||
margin: 0;
|
||||
}
|
||||
.note .hide-block button {
|
||||
border-radius: 30px;
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
body[data-type="link"] main #page {
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
[data-theme="dark"] body[data-type="link"] #page {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.flink .anzhiyu-flink-list {
|
||||
padding: 0;
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
/* 修复时间轴wowjs超出盒子 */
|
||||
div#archive {
|
||||
overflow: hidden;
|
||||
padding: 22px;
|
||||
}
|
||||
/* 修复加载时图片太大超出范围 */
|
||||
.aplayer.aplayer-fixed {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#page .fcircle_page .author-content-item .card-content .banner-button-group .banner-button {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
.relatedPosts > .relatedPosts-list > div {
|
||||
border-radius: var(--anzhiyu-border-radius);
|
||||
}
|
||||
|
||||
/* 侧边栏按钮圆角 */
|
||||
#rightside > div > button {
|
||||
border-radius: 5px;
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
/* site-card样式修复 */
|
||||
#article-container .site-card-group a {
|
||||
padding: 0;
|
||||
border-bottom: 0;
|
||||
font-weight: 400;
|
||||
}
|
||||
#article-container .site-card-group .site-card {
|
||||
background: #fff !important;
|
||||
border-radius: 8px;
|
||||
}
|
||||
#article-container .site-card-group a:hover {
|
||||
padding: 0;
|
||||
border-bottom: 0;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -0,0 +1,34 @@
|
||||
[data-theme="light"] #footer-wrap {
|
||||
color: var(--font-color);
|
||||
}
|
||||
#footer-wrap .anzhiyufont.anzhiyu-icon-heartbeat {
|
||||
transition: 0.3s;
|
||||
animation: heartbeat-bounce 2s ease-in-out infinite;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
display: var(--fa-display, inline-block);
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
line-height: 1;
|
||||
text-rendering: auto;
|
||||
}
|
||||
@keyframes heartbeat-bounce {
|
||||
0%,
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
10%,
|
||||
30% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
20%,
|
||||
40%,
|
||||
60%,
|
||||
80% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
50%,
|
||||
70% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,95 @@
|
||||
/* 顶部样式 */
|
||||
.fcircle_page .author-content.fcirclePage {
|
||||
height: 19rem;
|
||||
color: var(--anzhiyu-white);
|
||||
overflow: hidden;
|
||||
margin-top: 0px;
|
||||
}
|
||||
body[data-type="fcircle"] #web_bg {
|
||||
background-color: #f7f9fe;
|
||||
}
|
||||
|
||||
[data-theme="dark"] body[data-type="fcircle"] #web_bg {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
body[data-type="fcircle"] #page .page-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body[data-type="fcircle"] #page {
|
||||
border: 0;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
.fcircle_page a {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.fcircle_page .cf-article-avatar a:hover {
|
||||
background: none !important;
|
||||
color: var(--anzhiyu-fontcolor) !important;
|
||||
}
|
||||
/* 随机文章样式 */
|
||||
|
||||
.title-h2-a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
.title-h2-a-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.title-h2-a-left h2 {
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
.title-h2-a a {
|
||||
margin-left: 0.5rem;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-weight: 700;
|
||||
}
|
||||
#random-post {
|
||||
min-height: 32px;
|
||||
background: var(--card-bg);
|
||||
border: var(--style-border-always);
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
padding: 20px 30px;
|
||||
border-radius: 12px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
#random-post .random-friends-post {
|
||||
text-decoration: none;
|
||||
border-bottom: 2px solid var(--anzhiyu-lighttext) !important;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
font-weight: 700;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
#random-post .random-friends-post:hover {
|
||||
text-decoration: none;
|
||||
border-bottom: 2px solid var(--anzhiyu-none) !important;
|
||||
color: var(--anzhiyu-white) !important;
|
||||
background: var(--anzhiyu-main) !important;
|
||||
border-radius: 4px;
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
#article-container .title-h2-a a:hover {
|
||||
color: var(--anzhiyu-hovertext) !important;
|
||||
}
|
||||
.fcircle_page .title-h2-a-right a.random-post-all {
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
#cf-overshow.cf-show-now p a.cf-article-title:hover,
|
||||
.fcircle_page #fcircleContainer .cf-article a.cf-article-title:hover,
|
||||
.fcircle_page .title-h2-a-right a.random-post-all:hover,
|
||||
.fcircle_page .title-h2-a-left a.random-post-start:hover {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
color: var(--anzhiyu-theme);
|
||||
}
|
||||
.fcircle_page .fish-pond-item .cf-article .cf-article-title {
|
||||
line-height: 2;
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
#greetingBox {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 15%;
|
||||
width: 400px;
|
||||
text-align: center;
|
||||
z-index: 999;
|
||||
pointer-events: none;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#greetingBox {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#greeting {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
top: -110px;
|
||||
padding: 5px 40px;
|
||||
border-radius: 50px;
|
||||
background-color: white;
|
||||
color: black;
|
||||
font-size: small;
|
||||
transition: 0.5s;
|
||||
box-shadow: rgb(0 0 0 / 5%) 0 10px 20px;
|
||||
}
|
||||
|
||||
#greeting.shown {
|
||||
opacity: 1;
|
||||
top: 0;
|
||||
}
|
||||
@@ -0,0 +1,118 @@
|
||||
/* 首页分类框展示 */
|
||||
.categoryGroup {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
min-width: 200px;
|
||||
height: 24%;
|
||||
width: 100%;
|
||||
|
||||
animation: slide-in 0.6s 0.2s backwards;
|
||||
}
|
||||
.categoryItem:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.categoryItem {
|
||||
width: calc(100% / 3 - 0.33rem);
|
||||
height: 100%;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.categoryItem {
|
||||
overflow: hidden;
|
||||
transform: scale(1);
|
||||
transition: all 0.8s cubic-bezier(0.65, 0.15, 0.37, 1.19);
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
a.categoryButton {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
line-height: 4em;
|
||||
font-weight: 700;
|
||||
font-size: 1.1rem;
|
||||
color: var(--anzhiyu-white);
|
||||
transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
|
||||
transform: scale(1);
|
||||
overflow: hidden;
|
||||
font-family: inherit;
|
||||
}
|
||||
.categoryButtonText {
|
||||
padding-left: 21px;
|
||||
}
|
||||
a.categoryButton svg,
|
||||
a.categoryButton i {
|
||||
font-size: 5rem;
|
||||
opacity: 0.2;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 20%;
|
||||
transition: 0.3s;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
filter: blur(2px);
|
||||
transform: scale(1) rotate(15deg);
|
||||
}
|
||||
|
||||
a.categoryButton.blue {
|
||||
background: linear-gradient(to right, #358bff, #15c6ff);
|
||||
background-size: 200%;
|
||||
}
|
||||
a.categoryButton.red {
|
||||
background: linear-gradient(to right, #f65, #ffbf37);
|
||||
background-size: 200%;
|
||||
}
|
||||
a.categoryButton.green {
|
||||
background: linear-gradient(to right, #18e7ae, #1eebeb);
|
||||
background-size: 200%;
|
||||
}
|
||||
|
||||
.categoryItem:hover {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.categoryItem:hover svg,
|
||||
.categoryItem:hover i {
|
||||
opacity: 0.8;
|
||||
transition: 0.8s;
|
||||
transition-delay: 0.15s;
|
||||
transform: scale(1.03);
|
||||
font-size: 2.5rem;
|
||||
filter: blur(0);
|
||||
top: 15%;
|
||||
}
|
||||
a.categoryButton:after {
|
||||
top: 47px;
|
||||
width: 1rem;
|
||||
left: 21px;
|
||||
height: 2px;
|
||||
background: var(--anzhiyu-white);
|
||||
content: "";
|
||||
border-radius: 1px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.categoryGroup {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="dark"] a.categoryButton.blue {
|
||||
background: linear-gradient(to right, #0653b8, #2fcbff);
|
||||
background-size: 200%;
|
||||
}
|
||||
[data-theme="dark"] a.categoryButton.red {
|
||||
background: linear-gradient(to right, #e22a16, #da980c);
|
||||
background-size: 200%;
|
||||
}
|
||||
[data-theme="dark"] a.categoryButton.green {
|
||||
background: linear-gradient(to right, #099e74, #0ea4a4);
|
||||
background-size: 200%;
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
a span.top-group-text {
|
||||
border-radius: 0px 0 12px 0;
|
||||
}
|
||||
|
||||
div#bannerGroup {
|
||||
width: calc(100% - 600px - 2rem);
|
||||
height: 340px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
#topPostGroup .top-group-list-item {
|
||||
display: flex;
|
||||
width: calc(100% / 4 - 5px);
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
height: 128px;
|
||||
max-height: 128px;
|
||||
border: var(--style-border-always);
|
||||
transition: 0.3s;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
}
|
||||
#topPostGroup .post_cover {
|
||||
width: 100%;
|
||||
}
|
||||
#topPostGroup .post_cover img {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border-radius: 12px 12px 0 0;
|
||||
}
|
||||
|
||||
#topPostGroup .top-group-list-item .post_cover a {
|
||||
height: 80px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
span.top-group-text {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -40px;
|
||||
display: flex;
|
||||
z-index: 1;
|
||||
background: var(--anzhiyu-theme);
|
||||
color: var(--anzhiyu-white);
|
||||
padding: 2px 8px;
|
||||
font-size: 12px;
|
||||
border-radius: 12px 0 12px 0;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
.top-group-list-item:hover span.top-group-text {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#topPostGroup .top-group-list-item .top-group-info {
|
||||
padding: 0.3rem 0.5rem 0.3rem 0.5rem !important;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
#topPostGroup .top-group-list-item .top-group-info .article-title {
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
line-height: 1.5;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
align-content: center;
|
||||
padding-top: 0.5rem;
|
||||
font-weight: 700;
|
||||
font-size: 0.8rem !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
#topPostGroup .top-group-list-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
transform: scale(1.03);
|
||||
}
|
||||
|
||||
#topPostGroup .top-group-list-item:hover .article-title {
|
||||
color: var(--anzhiyu-theme);
|
||||
}
|
||||
|
||||
.top-group-list-none {
|
||||
width: calc(100% / 4 - 5px);
|
||||
}
|
||||
#topPostGroup .topPostGroupTime {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1450px) {
|
||||
#topPostGroup .top-group-list-item {
|
||||
width: calc(100% / 4 - 20px) !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#topPostGroup .top-group-list-item {
|
||||
width: calc(100% / 2 - 5px) !important;
|
||||
margin: 2px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#topGroup {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,439 @@
|
||||
#swiper_container_blog {
|
||||
width: 49%;
|
||||
transition: all 0.3s, width 0s;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.swiper-wrapper {
|
||||
align-items: center;
|
||||
}
|
||||
div#swiper_container {
|
||||
transition: 0.3s;
|
||||
}
|
||||
/* 防止轮播图css未加载完时的超度横行滚动条 */
|
||||
#swiper_container {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
div.swiper_container_card {
|
||||
margin: 1rem auto 0;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
div.swiper_container_card {
|
||||
margin: 0.2rem auto 0;
|
||||
}
|
||||
}
|
||||
div#swiper_container {
|
||||
background: rgba(255, 255, 255, 0);
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
overflow: initial;
|
||||
background: var(--card-bg);
|
||||
border-radius: 12px;
|
||||
border: var(--style-border);
|
||||
}
|
||||
div#swiper_container:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--anzhiyu-shadow-main);
|
||||
}
|
||||
.blog-slider {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
border-radius: 12px 8px 8px 12px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.blog-slider__item {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: box;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-moz-box-align: center;
|
||||
-o-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__img img {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
-webkit-transition-delay: 0.3s;
|
||||
-moz-transition-delay: 0.3s;
|
||||
-o-transition-delay: 0.3s;
|
||||
-ms-transition-delay: 0.3s;
|
||||
transition-delay: 0.3s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > * {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
-webkit-transform: none;
|
||||
-moz-transform: none;
|
||||
-o-transform: none;
|
||||
-ms-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(1) {
|
||||
-webkit-transition-delay: 0.3s;
|
||||
-moz-transition-delay: 0.3s;
|
||||
-o-transition-delay: 0.3s;
|
||||
-ms-transition-delay: 0.3s;
|
||||
transition-delay: 0.3s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(2) {
|
||||
-webkit-transition-delay: 0.4s;
|
||||
-moz-transition-delay: 0.4s;
|
||||
-o-transition-delay: 0.4s;
|
||||
-ms-transition-delay: 0.4s;
|
||||
transition-delay: 0.4s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(3) {
|
||||
-webkit-transition-delay: 0.5s;
|
||||
-moz-transition-delay: 0.5s;
|
||||
-o-transition-delay: 0.5s;
|
||||
-ms-transition-delay: 0.5s;
|
||||
transition-delay: 0.5s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(4) {
|
||||
-webkit-transition-delay: 0.6s;
|
||||
-moz-transition-delay: 0.6s;
|
||||
-o-transition-delay: 0.6s;
|
||||
-ms-transition-delay: 0.6s;
|
||||
transition-delay: 0.6s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(5) {
|
||||
-webkit-transition-delay: 0.7s;
|
||||
-moz-transition-delay: 0.7s;
|
||||
-o-transition-delay: 0.7s;
|
||||
-ms-transition-delay: 0.7s;
|
||||
transition-delay: 0.7s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(6) {
|
||||
-webkit-transition-delay: 0.8s;
|
||||
-moz-transition-delay: 0.8s;
|
||||
-o-transition-delay: 0.8s;
|
||||
-ms-transition-delay: 0.8s;
|
||||
transition-delay: 0.8s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(7) {
|
||||
-webkit-transition-delay: 0.9s;
|
||||
-moz-transition-delay: 0.9s;
|
||||
-o-transition-delay: 0.9s;
|
||||
-ms-transition-delay: 0.9s;
|
||||
transition-delay: 0.9s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(8) {
|
||||
-webkit-transition-delay: 1s;
|
||||
-moz-transition-delay: 1s;
|
||||
-o-transition-delay: 1s;
|
||||
-ms-transition-delay: 1s;
|
||||
transition-delay: 1s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(9) {
|
||||
-webkit-transition-delay: 1.1s;
|
||||
-moz-transition-delay: 1.1s;
|
||||
-o-transition-delay: 1.1s;
|
||||
-ms-transition-delay: 1.1s;
|
||||
transition-delay: 1.1s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(10) {
|
||||
-webkit-transition-delay: 1.2s;
|
||||
-moz-transition-delay: 1.2s;
|
||||
-o-transition-delay: 1.2s;
|
||||
-ms-transition-delay: 1.2s;
|
||||
transition-delay: 1.2s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(11) {
|
||||
-webkit-transition-delay: 1.3s;
|
||||
-moz-transition-delay: 1.3s;
|
||||
-o-transition-delay: 1.3s;
|
||||
-ms-transition-delay: 1.3s;
|
||||
transition-delay: 1.3s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(12) {
|
||||
-webkit-transition-delay: 1.4s;
|
||||
-moz-transition-delay: 1.4s;
|
||||
-o-transition-delay: 1.4s;
|
||||
-ms-transition-delay: 1.4s;
|
||||
transition-delay: 1.4s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(13) {
|
||||
-webkit-transition-delay: 1.5s;
|
||||
-moz-transition-delay: 1.5s;
|
||||
-o-transition-delay: 1.5s;
|
||||
-ms-transition-delay: 1.5s;
|
||||
transition-delay: 1.5s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(14) {
|
||||
-webkit-transition-delay: 1.6s;
|
||||
-moz-transition-delay: 1.6s;
|
||||
-o-transition-delay: 1.6s;
|
||||
-ms-transition-delay: 1.6s;
|
||||
transition-delay: 1.6s;
|
||||
}
|
||||
.blog-slider__item.swiper-slide-active .blog-slider__content > :nth-child(15) {
|
||||
-webkit-transition-delay: 1.7s;
|
||||
-moz-transition-delay: 1.7s;
|
||||
-o-transition-delay: 1.7s;
|
||||
-ms-transition-delay: 1.7s;
|
||||
transition-delay: 1.7s;
|
||||
}
|
||||
.blog-slider__img {
|
||||
width: 290px;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
height: 200px;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
transform: translateX(0);
|
||||
overflow: hidden;
|
||||
}
|
||||
.blog-slider__img:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 5px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.blog-slider__img img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
opacity: 0;
|
||||
border-radius: 5px;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.blog-slider__content {
|
||||
padding-right: 50px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.blog-slider__content > * {
|
||||
opacity: 0;
|
||||
-webkit-transform: translateY(25px);
|
||||
-moz-transform: translateY(25px);
|
||||
-o-transform: translateY(25px);
|
||||
-ms-transform: translateY(25px);
|
||||
transform: translateY(25px);
|
||||
-webkit-transition: all 0.4s;
|
||||
-moz-transition: all 0.4s;
|
||||
-o-transition: all 0.4s;
|
||||
-ms-transition: all 0.4s;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
.blog-slider__code {
|
||||
color: var(--font-color);
|
||||
margin-bottom: 0;
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
}
|
||||
.blog-slider__title {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: var(--font-color);
|
||||
margin-bottom: 15px;
|
||||
-webkit-line-clamp: 1;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.blog-slider__text {
|
||||
color: var(--font-color);
|
||||
margin-bottom: 15px;
|
||||
line-height: 1.5em;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
.blog-slider__button {
|
||||
display: -webkit-inline-box;
|
||||
display: -moz-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-box;
|
||||
display: inline-flex;
|
||||
background-color: var(--btn-bg);
|
||||
padding: 4px 14px;
|
||||
border-radius: 8px;
|
||||
color: var(--btn-color);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
-webkit-box-pack: center;
|
||||
-moz-box-pack: center;
|
||||
-o-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
letter-spacing: 1px;
|
||||
display: none;
|
||||
}
|
||||
.blog-slider__button:hover {
|
||||
background-color: var(--btn-hover-color);
|
||||
color: var(--btn-color);
|
||||
}
|
||||
.blog-slider .swiper-container-horizontal > .swiper-pagination-bullets,
|
||||
.blog-slider .swiper-pagination-custom,
|
||||
.blog-slider .swiper-pagination-fraction {
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.blog-slider__pagination {
|
||||
position: absolute;
|
||||
z-index: 21;
|
||||
right: 20px;
|
||||
width: 11px !important;
|
||||
text-align: center;
|
||||
left: auto !important;
|
||||
top: 50%;
|
||||
bottom: auto !important;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-moz-transform: translateY(-50%);
|
||||
-o-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.blog-slider .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
|
||||
margin: 8px 0;
|
||||
}
|
||||
.blog-slider__pagination .swiper-pagination-bullet {
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
display: block;
|
||||
border-radius: 10px;
|
||||
background: #858585;
|
||||
opacity: 0.2;
|
||||
-webkit-transition: all 0.3s;
|
||||
-moz-transition: all 0.3s;
|
||||
-o-transition: all 0.3s;
|
||||
-ms-transition: all 0.3s;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.blog-slider__pagination .swiper-pagination-bullet-active {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
background: var(--btn-bg);
|
||||
height: 30px;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.blog-slider__pagination {
|
||||
-webkit-transform: translateX(-50%);
|
||||
-moz-transform: translateX(-50%);
|
||||
-o-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
left: 50% !important;
|
||||
top: 320px;
|
||||
width: 100% !important;
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: box;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-moz-box-pack: center;
|
||||
-o-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-moz-box-align: center;
|
||||
-o-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
.blog-slider .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
|
||||
margin: 0 5px;
|
||||
}
|
||||
.blog-slider__pagination .swiper-pagination-bullet-active {
|
||||
height: 11px;
|
||||
width: 30px;
|
||||
}
|
||||
.blog-slider__button {
|
||||
display: -webkit-inline-box;
|
||||
display: -moz-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-box;
|
||||
display: inline-flex;
|
||||
width: 100%;
|
||||
}
|
||||
.blog-slider {
|
||||
min-height: 350px;
|
||||
height: auto;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.blog-slider__content {
|
||||
text-align: center;
|
||||
padding: 0 30px;
|
||||
}
|
||||
.blog-slider__item {
|
||||
-webkit-box-orient: vertical;
|
||||
-moz-box-orient: vertical;
|
||||
-o-box-orient: vertical;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.blog-slider__img {
|
||||
width: 100%;
|
||||
padding-top: 0;
|
||||
}
|
||||
.blog-slider__content {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.blog-slider__pagination.swiper-pagination-clickable.swiper-pagination-bullets {
|
||||
top: 218px;
|
||||
}
|
||||
|
||||
.swiper_container_card #swiper_container_blog div#swiper_container.blog-slider {
|
||||
padding: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.blog-slider__item .blog-slider__content .blog-slider__code {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.blog-slider__title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 768px) {
|
||||
.blog-slider {
|
||||
height: 200px;
|
||||
}
|
||||
.blog-slider__img {
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
div#swiper_container {
|
||||
width: 100%;
|
||||
}
|
||||
#swiper_container_blog {
|
||||
width: 99%;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper_container_card {
|
||||
display: flex !important;
|
||||
justify-content: space-around;
|
||||
flex-direction: row !important;
|
||||
user-select: none;
|
||||
}
|
||||
@@ -0,0 +1,268 @@
|
||||
.todayCard-title,
|
||||
.todayCard-tips,
|
||||
.topGroup .banner-button {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.topGroup {
|
||||
height: 340px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
width: calc(600px + 1.5rem);
|
||||
position: relative;
|
||||
align-content: space-between;
|
||||
}
|
||||
.topGroup .todayCard {
|
||||
position: absolute;
|
||||
width: calc(600px + 1rem);
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
margin-left: 0.5rem;
|
||||
overflow: hidden;
|
||||
transition: 0.3s;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
.topGroup .todayCard .todayCard-info {
|
||||
position: absolute;
|
||||
bottom: 2rem;
|
||||
left: 2rem;
|
||||
z-index: 2;
|
||||
color: var(--anzhiyu-white);
|
||||
max-width: 60%;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.topGroup .todayCard .todayCard-info .todayCard-tips {
|
||||
opacity: 0.8;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.topGroup .todayCard .todayCard-info .todayCard-title {
|
||||
font-size: 28px;
|
||||
font-weight: bold;
|
||||
line-height: 36px;
|
||||
}
|
||||
.topGroup .todayCard .todayCard-cover {
|
||||
position: absolute;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-size: cover;
|
||||
z-index: -1;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.topGroup .banner-button-group {
|
||||
position: absolute;
|
||||
right: 2rem;
|
||||
bottom: 2rem;
|
||||
display: flex;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.topGroup .todayCard.hide .todayCard-cover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.topGroup .banner-button {
|
||||
background: var(--anzhiyu-white-op);
|
||||
border-radius: 20px;
|
||||
color: var(--anzhiyu-white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
transform: translateZ(0);
|
||||
height: 40px;
|
||||
width: 125px;
|
||||
justify-content: center;
|
||||
}
|
||||
.topGroup .banner-button-group .banner-button .banner-button-text {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.topGroup .banner-button i,
|
||||
.topGroup .banner-button svg {
|
||||
margin-right: 8px;
|
||||
font-size: 22px;
|
||||
}
|
||||
.topGroup .todayCard::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
box-shadow: 0 -109px 133px -9px #000000 inset;
|
||||
}
|
||||
|
||||
.topGroup .todayCard.hide {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.topGroup .todayCard img {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border-radius: 12px 12px 0 0;
|
||||
}
|
||||
.topGroup .recent-post-item:nth-child(4),
|
||||
.topGroup .recent-post-item:nth-child(5),
|
||||
.topGroup .recent-post-item:nth-child(6) {
|
||||
margin-bottom: 0;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.topGroup .recent-post-item {
|
||||
display: none;
|
||||
width: 200px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
background: var(--anzhiyu-card-bg);
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
min-width: 200px;
|
||||
height: 164px !important;
|
||||
max-height: 164px;
|
||||
border: var(--style-border-always);
|
||||
transition: 0.3s;
|
||||
position: relative;
|
||||
box-shadow: var(--anzhiyu-shadow-border);
|
||||
margin-left: 0.5rem;
|
||||
margin-right: 0px;
|
||||
margin-bottom: 0.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.topGroup .recent-post-item:hover .recent-post-info .article-title {
|
||||
color: var(--anzhiyu-main);
|
||||
}
|
||||
.topGroup .recent-post-item .post_cover {
|
||||
width: 100%;
|
||||
}
|
||||
.topGroup .recent-post-item .post_cover a {
|
||||
height: 100px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
}
|
||||
.topGroup span.recent-post-top-text {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -40px;
|
||||
display: flex;
|
||||
z-index: 1;
|
||||
background: var(--anzhiyu-theme);
|
||||
color: var(--anzhiyu-white);
|
||||
padding: 2px 8px;
|
||||
font-size: 12px;
|
||||
border-radius: 12px 0 12px 0;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.topGroup .recent-post-item .post_cover img {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border-radius: 12px 12px 0 0;
|
||||
}
|
||||
.topGroup .recent-post-item .recent-post-info {
|
||||
padding: 0.3rem 0.5rem 0.3rem 0.5rem;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.topGroup .recent-post-item .recent-post-info .article-title {
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
line-height: 1.5;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
align-content: center;
|
||||
padding-top: 0.5rem;
|
||||
font-weight: bold;
|
||||
font-size: 1rem !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.topGroup .recent-post-item:hover .recent-post-top-text {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.topGroup .todayCard {
|
||||
background: #0e57d5;
|
||||
}
|
||||
|
||||
div#bannerGroup {
|
||||
height: auto;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.topGroup .recent-post-item {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.categoryGroup .categoryItem:nth-child(3) {
|
||||
display: none;
|
||||
}
|
||||
.categoryGroup {
|
||||
flex-direction: column;
|
||||
height: 95%;
|
||||
}
|
||||
.topGroup {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.topGroup .todayCard {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.swiper_container_card {
|
||||
display: flex;
|
||||
flex-direction: row !important;
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap;
|
||||
width: 100%;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.categoryItem {
|
||||
height: 48%;
|
||||
min-width: 200px;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.categoryGroup {
|
||||
display: flex !important;
|
||||
}
|
||||
#bbTimeList {
|
||||
margin: 0 1.5rem;
|
||||
max-width: 100%;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper_container_card::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.topGroup .banner-button:hover {
|
||||
background: var(--anzhiyu-theme);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
@@ -0,0 +1,42 @@
|
||||
#local-search .search-dialog .local-search__hit-item:before {
|
||||
content: none !important;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item {
|
||||
padding: 10px !important;
|
||||
border-radius: 8px;
|
||||
border: var(--style-border);
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .search-left {
|
||||
width: 35%;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .search-right {
|
||||
width: 60%;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .search-left img {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border-radius: 8px;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .search-result {
|
||||
cursor: pointer;
|
||||
}
|
||||
#local-search .tag-list {
|
||||
padding: 4px 8px;
|
||||
border-radius: 8px;
|
||||
margin-right: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
border: var(--style-border);
|
||||
cursor: pointer;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .tag-list {
|
||||
display: inline;
|
||||
}
|
||||
#local-search .search-dialog .local-search__hit-item .tag-list:hover {
|
||||
background: var(--anzhiyu-main);
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
b, strong {
|
||||
color: var(--anzhiyu-lighttext);
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
.about-reward {
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 2rem;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.reward .about-reward #con {
|
||||
width: 170px;
|
||||
}
|
||||
.reward #tube-con {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,59 @@
|
||||
div#runtime {
|
||||
width: 180px;
|
||||
margin: auto;
|
||||
color: #fff;
|
||||
padding-inline: 5px;
|
||||
border-radius: 10px;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
#workboard {
|
||||
font-size: 12px;
|
||||
}
|
||||
[data-theme="dark"] div#runtime {
|
||||
color: #28b4c8;
|
||||
box-shadow: 0 0 5px rgba(28, 69, 218, 0.71);
|
||||
animation: flashlight 1s linear infinite alternate;
|
||||
}
|
||||
#ghbdages .github-badge img {
|
||||
height: 20px;
|
||||
max-width: 150px;
|
||||
border-radius: 4px;
|
||||
pointer-events: none;
|
||||
}
|
||||
#workboard img.boardsign {
|
||||
width: 100%;
|
||||
max-width: 130px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
@-moz-keyframes flashlight {
|
||||
from {
|
||||
box-shadow: 0 0 5px #1478d2;
|
||||
}
|
||||
to {
|
||||
box-shadow: 0 0 2px #1478d2;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes flashlight {
|
||||
from {
|
||||
box-shadow: 0 0 5px #1478d2;
|
||||
}
|
||||
to {
|
||||
box-shadow: 0 0 2px #1478d2;
|
||||
}
|
||||
}
|
||||
@-o-keyframes flashlight {
|
||||
from {
|
||||
box-shadow: 0 0 5px #1478d2;
|
||||
}
|
||||
to {
|
||||
box-shadow: 0 0 2px #1478d2;
|
||||
}
|
||||
}
|
||||
@keyframes flashlight {
|
||||
from {
|
||||
box-shadow: 0 0 5px #1478d2;
|
||||
}
|
||||
to {
|
||||
box-shadow: 0 0 2px #1478d2;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
.author-content.author-content-item {
|
||||
height: 19rem;
|
||||
background-color: var(--anzhiyu-main);
|
||||
background-position: left 28%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
color: var(--anzhiyu-white);
|
||||
overflow: hidden;
|
||||
margin-top: 0;
|
||||
background-image: linear-gradient(-45deg, var(--anzhiyu-main), #0f4667, #2a6973 150%, #67044d);
|
||||
background-size: 400%;
|
||||
animation: gradient 15s ease infinite;
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
#skills-tags-group-all {
|
||||
display: flex;
|
||||
transform: rotate(0);
|
||||
transition: 0.3s;
|
||||
}
|
||||
#skills-tags-group-all .tags-group-wrapper {
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
animation: rowup 60s linear infinite;
|
||||
}
|
||||
#skills-tags-group-all .tags-group-icon-pair {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
#skills-tags-group-all .tags-group-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
font-size: 66px;
|
||||
font-weight: 700;
|
||||
box-shadow: var(--anzhiyu-shadow-blackdeep);
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
border-radius: 30px;
|
||||
}
|
||||
#skills-tags-group-all .tags-group-icon img {
|
||||
width: 60px;
|
||||
margin: 0 auto !important;
|
||||
}
|
||||
[data-theme="dark"] #skills-tags-group-all .tags-group-icon img {
|
||||
filter: none;
|
||||
}
|
||||
#skills-tags-group-all .tags-group-icon-pair .tags-group-icon:nth-child(even) {
|
||||
margin-top: 1rem;
|
||||
transform: translate(-60px);
|
||||
}
|
||||
|
||||
#skills-tags-group-all .etc {
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@keyframes rowup {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,77 @@
|
||||
#article-container .tag-Link {
|
||||
background: var(--anzhiyu-secondbg);
|
||||
border-radius: 8px !important;
|
||||
display: flex;
|
||||
border: var(--style-border);
|
||||
flex-direction: column;
|
||||
padding: 0.5rem 1rem !important;
|
||||
border-width: 1px !important;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
#article-container .tag-Link:hover {
|
||||
border: var(--style-border-hover);
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-tips {
|
||||
border-bottom: var(--style-border);
|
||||
padding-bottom: 4px;
|
||||
font-size: 12px;
|
||||
color: var(--anzhiyu-gray);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#article-container .tag-Link:hover .tag-link-tips {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom {
|
||||
display: flex;
|
||||
margin-top: 0.5rem;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom .tag-link-left {
|
||||
width: 60px;
|
||||
min-width: 60px;
|
||||
height: 60px;
|
||||
background-size: cover;
|
||||
border-radius: var(--anzhiyu-border-radius);
|
||||
background-color: var(--anzhiyu-card-bg);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
#article-container .tag-Link .tag-link-bottom .tag-link-left i {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin: auto;
|
||||
font-size: 24px;
|
||||
color: var(--anzhiyu-fontcolor);
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom .tag-link-right {
|
||||
margin-left: 1rem;
|
||||
max-width: calc(100% - 76px - 1rem);
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-title {
|
||||
font-size: 1rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-sitename {
|
||||
font-size: 0.7rem;
|
||||
color: var(--anzhiyu-gray);
|
||||
font-weight: normal;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
#article-container .tag-Link:hover .tag-link-bottom .tag-link-right .tag-link-sitename {
|
||||
color: var(--anzhiyu-white);
|
||||
}
|
||||
|
||||
#article-container .tag-Link .tag-link-bottom i {
|
||||
margin-left: auto;
|
||||
}
|
||||
@@ -0,0 +1,151 @@
|
||||
.site-card-group .site-card .info {
|
||||
margin-top: 0;
|
||||
}
|
||||
.site-card-group > a {
|
||||
width: calc(100% / 4 - 0.5rem);
|
||||
height: 150px;
|
||||
position: relative;
|
||||
display: block;
|
||||
margin: 0.5rem 0.25rem;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
border-radius: 8px;
|
||||
transition: all 0.3s ease 0s, transform cubic-bezier(0.71, 0.15, 0.16, 1.15) 0.6s;
|
||||
box-shadow: none;
|
||||
border: var(--style-border) !important;
|
||||
}
|
||||
|
||||
.site-card-group > a .wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.site-card-group > a .cover {
|
||||
width: 100%;
|
||||
-webkit-transition: -webkit-transform 0.5s ease-out;
|
||||
-moz-transition: -moz-transform 0.5s ease-out;
|
||||
-o-transition: -o-transform 0.5s ease-out;
|
||||
-ms-transition: -ms-transform 0.5s ease-out;
|
||||
transition: transform 0.5s ease-out;
|
||||
}
|
||||
|
||||
.site-card-group > a .info,
|
||||
.site-card-group > a .wrapper .cover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.site-card-group > a .info {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: box;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-moz-box-orient: vertical;
|
||||
-o-box-orient: vertical;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: center;
|
||||
-moz-box-pack: center;
|
||||
-o-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-moz-box-align: center;
|
||||
-o-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
border-radius: 3px;
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
|
||||
-moz-transition: -moz-transform 0.5s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
|
||||
-o-transition: -o-transform 0.5s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
|
||||
-ms-transition: -ms-transform 0.5s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
|
||||
transition: transform 0.5s cubic-bezier(0.6, 0.2, 0.1, 1) 0s;
|
||||
}
|
||||
|
||||
.site-card-group > a .info img {
|
||||
position: relative;
|
||||
top: 19px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
-webkit-box-shadow: 0 0 10px rgb(0 0 0 / 30%);
|
||||
box-shadow: 0 0 10px rgb(0 0 0 / 30%);
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.site-card-group > a .info span {
|
||||
padding: 20px 10% 60px 10%;
|
||||
font-size: 16px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
-webkit-box-shadow: 0 0 10px rgb(0 0 0 / 30%);
|
||||
box-shadow: 0 0 10px rgb(0 0 0 / 30%);
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
color: var(--font-color);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.site-card-group .site-card:hover {
|
||||
border-color: var(--anzhiyu-main) !important;
|
||||
background-color: var(--anzhiyu-main) !important;
|
||||
-webkit-box-shadow: var(--anzhiyu-shadow-theme) !important;
|
||||
box-shadow: var(--anzhiyu-shadow-theme) !important;
|
||||
}
|
||||
.site-card-group > a:hover .wrapper img {
|
||||
-webkit-transform: scale(1.2);
|
||||
-moz-transform: scale(1.2);
|
||||
-o-transform: scale(1.2);
|
||||
-ms-transform: scale(1.2);
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.site-card-group > a .cover {
|
||||
width: 100%;
|
||||
-webkit-transition: -webkit-transform 0.5s ease-out;
|
||||
-moz-transition: -moz-transform 0.5s ease-out;
|
||||
-o-transition: -o-transform 0.5s ease-out;
|
||||
-ms-transition: -ms-transform 0.5s ease-out;
|
||||
transition: transform 0.5s ease-out;
|
||||
}
|
||||
.site-card-group > a .wrapper img {
|
||||
height: 150px;
|
||||
pointer-events: none;
|
||||
}
|
||||
.site-card-group .site-card .wrapper img {
|
||||
-webkit-transition: -webkit-transform 0.5s ease-out !important;
|
||||
-moz-transition: -moz-transform 0.5s ease-out !important;
|
||||
-o-transition: -o-transform 0.5s ease-out !important;
|
||||
-ms-transition: -ms-transform 0.5s ease-out !important;
|
||||
transition: transform 0.5s ease-out !important;
|
||||
}
|
||||
.site-card-group > a .wrapper .fadeIn {
|
||||
-webkit-animation: coverIn 0.8s ease-out forwards;
|
||||
-moz-animation: coverIn 0.8s ease-out forwards;
|
||||
-o-animation: coverIn 0.8s ease-out forwards;
|
||||
-ms-animation: coverIn 0.8s ease-out forwards;
|
||||
animation: coverIn 0.8s ease-out forwards;
|
||||
}
|
||||
|
||||
.site-card-group > a:hover .info {
|
||||
-webkit-transform: translateY(-100%);
|
||||
-moz-transform: translateY(-100%);
|
||||
-o-transform: translateY(-100%);
|
||||
-ms-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
Reference in New Issue
Block a user