更新
This commit is contained in:
parent
0ff08cbbc0
commit
2d1ecf1e0c
@ -46,7 +46,7 @@
|
|||||||
</a>
|
</a>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
||||||
<h6><?php $this->title() ?></h6>
|
<?php $this->title() ?>
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
@ -64,7 +64,7 @@
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
||||||
<h6><?php $this->title() ?></h6>
|
<?php $this->title() ?>
|
||||||
</a>
|
</a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
<ul class="items">
|
<ul class="items">
|
||||||
@ -92,7 +92,7 @@
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
||||||
<h6><?php $this->title() ?></h6>
|
<?php $this->title() ?>
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
||||||
</div>
|
</div>
|
||||||
@ -116,7 +116,7 @@
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
<a href="<?php $this->permalink() ?>" class="title" title="<?php $this->title() ?>">
|
||||||
<h6><?php $this->title() ?></h6>
|
<?php $this->title() ?>
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
<a class="abstract" href="<?php $this->permalink() ?>" title="文章摘要"><?php _getAbstract($this) ?></a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
|
File diff suppressed because one or more lines are too long
@ -469,19 +469,108 @@
|
|||||||
}
|
}
|
||||||
&__slideout {
|
&__slideout {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 55px;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 70%;
|
width: 80%;
|
||||||
z-index: 990;
|
z-index: 990;
|
||||||
background: var(--background);
|
background: var(--classD);
|
||||||
transform: translate3d(-100%, 0, 0);
|
transform: translate3d(-100%, 0, 0);
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
transition: transform 0.35s, visibility 0.35s;
|
transition: transform 0.35s, visibility 0.35s;
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 135px 15px 15px;
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
&.active {
|
&.active {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
transform: translate3d(0, 0, 0);
|
transform: translate3d(0, 0, 0);
|
||||||
}
|
}
|
||||||
|
&-image {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 150px;
|
||||||
|
object-fit: cover;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
&-author {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
background: var(--background);
|
||||||
|
border-radius: var(--radius-wrap);
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 15px;
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
.avatar {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin-right: 10px;
|
||||||
|
border-radius: var(--radius-inner);
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
.link {
|
||||||
|
display: block;
|
||||||
|
line-height: 25px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: var(--main);
|
||||||
|
}
|
||||||
|
.motto {
|
||||||
|
line-height: 25px;
|
||||||
|
font-size: 12px;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
color: var(--routine);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-menu {
|
||||||
|
background: var(--background);
|
||||||
|
padding: 10px 15px;
|
||||||
|
border-radius: var(--radius-wrap);
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
.link {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 0;
|
||||||
|
color: var(--main);
|
||||||
|
transition: color 0.15s;
|
||||||
|
a {
|
||||||
|
transition: color 0.15s;
|
||||||
|
color: var(--routine);
|
||||||
|
}
|
||||||
|
.icon {
|
||||||
|
width: 13px;
|
||||||
|
height: 13px;
|
||||||
|
fill: var(--minor);
|
||||||
|
transition: transform 0.15s, fill 0.15s;
|
||||||
|
}
|
||||||
|
&.in {
|
||||||
|
color: var(--theme);
|
||||||
|
a {
|
||||||
|
color: var(--theme);
|
||||||
|
}
|
||||||
|
.icon {
|
||||||
|
fill: var(--theme);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.slides {
|
||||||
|
display: none;
|
||||||
|
border-left: 1px solid var(--classC);
|
||||||
|
padding-left: 15px;
|
||||||
|
.link {
|
||||||
|
color: var(--routine);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -960,10 +1049,24 @@
|
|||||||
&:last-child {
|
&:last-child {
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
.information .title {
|
.information {
|
||||||
display: flex;
|
.title {
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
/*! autoprefixer: off */
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
/* autoprefixer: on */
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
word-break: break-all;
|
||||||
|
color: var(--main);
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 24px;
|
||||||
|
transition: color 0.35s;
|
||||||
|
&:hover {
|
||||||
|
color: var(--theme);
|
||||||
|
}
|
||||||
.badge {
|
.badge {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
@ -974,22 +1077,10 @@
|
|||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding: 0 8px;
|
padding: 0 8px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
vertical-align: 2px;
|
||||||
h6 {
|
|
||||||
color: var(--main);
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
font-size: 18px;
|
|
||||||
line-height: 24px;
|
|
||||||
transition: color 0.35s;
|
|
||||||
font-weight: normal;
|
|
||||||
&:hover {
|
|
||||||
color: var(--theme);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
.abstract {
|
||||||
.information .abstract {
|
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
-webkit-line-clamp: 2;
|
-webkit-line-clamp: 2;
|
||||||
/*! autoprefixer: off */
|
/*! autoprefixer: off */
|
||||||
@ -1000,9 +1091,9 @@
|
|||||||
color: var(--minor);
|
color: var(--minor);
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
font-size: 13px;
|
|
||||||
opacity: 0.85;
|
opacity: 0.85;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.line {
|
.line {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
@ -1027,7 +1118,7 @@
|
|||||||
li {
|
li {
|
||||||
&::after {
|
&::after {
|
||||||
content: '/';
|
content: '/';
|
||||||
color: #e1e1e1;
|
color: var(--seat);
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
}
|
}
|
||||||
&:last-child::after {
|
&:last-child::after {
|
||||||
@ -1550,10 +1641,18 @@
|
|||||||
}
|
}
|
||||||
pre[class*='language-'] {
|
pre[class*='language-'] {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 30px 15px 12px;
|
|
||||||
margin: 0 0 15px;
|
margin: 0 0 15px;
|
||||||
|
padding: 30px 0 0;
|
||||||
border-radius: var(--radius-inner);
|
border-radius: var(--radius-inner);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
overflow: hidden !important;
|
||||||
|
code[class*='language-'] {
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
padding: 0 15px 12px;
|
||||||
|
border-radius: var(--radius-inner);
|
||||||
|
}
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -1562,6 +1661,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
background: #2d2d2d;
|
background: #2d2d2d;
|
||||||
|
border-radius: var(--radius-inner) var(--radius-inner) 0 0;
|
||||||
}
|
}
|
||||||
&::before {
|
&::before {
|
||||||
content: '';
|
content: '';
|
||||||
@ -2298,9 +2398,8 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 10px;
|
bottom: 10px;
|
||||||
left: 50%;
|
left: 10px;
|
||||||
transform: translate(-50%);
|
|
||||||
li {
|
li {
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
|
File diff suppressed because one or more lines are too long
@ -141,57 +141,76 @@ html {
|
|||||||
height: 180px;
|
height: 180px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.joe_index__banner-recommend {
|
.joe_index {
|
||||||
|
&__banner {
|
||||||
|
&-recommend {
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
.item {
|
.item {
|
||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.joe_index__hot-list {
|
}
|
||||||
|
&__hot {
|
||||||
|
&-list {
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
grid-template-columns: repeat(4, 200px);
|
grid-template-columns: repeat(4, 200px);
|
||||||
&::-webkit-scrollbar {
|
&::-webkit-scrollbar {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.joe_index__ad-link .image {
|
}
|
||||||
|
&__ad {
|
||||||
|
&-link {
|
||||||
|
.image {
|
||||||
height: 120px;
|
height: 120px;
|
||||||
}
|
}
|
||||||
.joe_index__title-notice {
|
}
|
||||||
|
}
|
||||||
|
&__title {
|
||||||
|
&-notice {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.joe_index__title-title .item {
|
&-title {
|
||||||
margin-right: 15px;
|
.item {
|
||||||
|
display: none;
|
||||||
|
&:nth-child(1),
|
||||||
|
&:nth-child(2) {
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
.joe_list__item {
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_list {
|
||||||
|
&__item {
|
||||||
.information {
|
.information {
|
||||||
.title {
|
.title {
|
||||||
h6 {
|
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
.abstract {
|
.abstract {
|
||||||
max-height: 46px;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.none {
|
.meta {
|
||||||
.information {
|
.last {
|
||||||
height: 130px;
|
display: none !important;
|
||||||
}
|
|
||||||
}
|
|
||||||
&.multiple {
|
|
||||||
.thumbnail {
|
|
||||||
grid-template-rows: 80px;
|
|
||||||
gap: 10px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.single {
|
&.single {
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
height: 150px;
|
height: 150px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
time {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.default {
|
&.default {
|
||||||
padding-bottom: 47px;
|
.information {
|
||||||
|
.title {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
width: 120px;
|
width: 120px;
|
||||||
min-width: 120px;
|
min-width: 120px;
|
||||||
@ -202,18 +221,42 @@ html {
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.information {
|
|
||||||
.title {
|
.title {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
.abstract {
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
.meta {
|
.meta {
|
||||||
position: absolute;
|
.items {
|
||||||
bottom: 15px;
|
width: 100%;
|
||||||
left: 0;
|
li {
|
||||||
right: 0;
|
display: none;
|
||||||
|
&:nth-child(1) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
&:nth-child(2) {
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
&::after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.multiple {
|
||||||
|
.thumbnail {
|
||||||
|
grid-template-rows: 70px;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.none {
|
||||||
|
.information {
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
.abstract {
|
||||||
|
display: -webkit-box;
|
||||||
|
font-size: 13px;
|
||||||
|
max-height: 45px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -226,17 +269,6 @@ html {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.joe_detail {
|
|
||||||
&__friends {
|
|
||||||
grid-template-columns: repeat(1, 1fr);
|
|
||||||
}
|
|
||||||
&__article {
|
|
||||||
font-size: 14px;
|
|
||||||
&-player {
|
|
||||||
height: 230px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.joe_video {
|
.joe_video {
|
||||||
&__list-item {
|
&__list-item {
|
||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
@ -261,6 +293,101 @@ html {
|
|||||||
&__list-item .thumb {
|
&__list-item .thumb {
|
||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
|
&__play-player {
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_detail {
|
||||||
|
&__title {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
&__count {
|
||||||
|
&-information {
|
||||||
|
width: 100%;
|
||||||
|
.avatar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.meta {
|
||||||
|
width: 100%;
|
||||||
|
height: unset;
|
||||||
|
.author {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
justify-content: center;
|
||||||
|
span:nth-child(2),
|
||||||
|
span:nth-child(3) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-created {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
&::after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&__friends {
|
||||||
|
grid-template-columns: repeat(1, 1fr);
|
||||||
|
}
|
||||||
|
&__article {
|
||||||
|
font-size: 14px;
|
||||||
|
&-player {
|
||||||
|
height: 220px;
|
||||||
|
}
|
||||||
|
pre[class*='language-'] {
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_comment {
|
||||||
|
position: relative;
|
||||||
|
&__title {
|
||||||
|
font-size: 20px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
&__respond-type {
|
||||||
|
position: absolute;
|
||||||
|
top: 15px;
|
||||||
|
right: 15px;
|
||||||
|
}
|
||||||
|
&__respond-form {
|
||||||
|
.head {
|
||||||
|
display: block;
|
||||||
|
border-bottom: none;
|
||||||
|
.list {
|
||||||
|
border-bottom: 1px solid var(--classB);
|
||||||
|
&:nth-child(2) {
|
||||||
|
&::before,
|
||||||
|
&::after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.body .text{
|
||||||
|
height: 140px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.comment-list__item-contain .term .avatar {
|
||||||
|
width: 34px;
|
||||||
|
height: 34px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.comment-list__item-contain .term .content .user .agent {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.comment-list__item-children {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
.comment-list__item .joe_comment__respond {
|
||||||
|
margin-left: 0;
|
||||||
|
&-type {
|
||||||
|
position: static;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -357,4 +484,58 @@ html .noaside {
|
|||||||
grid-template-rows: 130px;
|
grid-template-rows: 130px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.joe_wallpaper {
|
||||||
|
&__list {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_detail {
|
||||||
|
&__friends {
|
||||||
|
grid-template-columns: repeat(1, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_video {
|
||||||
|
&__list-item {
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
.item .thumb {
|
||||||
|
height: 140px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&__source-list {
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_index {
|
||||||
|
&__banner {
|
||||||
|
&-recommend {
|
||||||
|
gap: 10px;
|
||||||
|
.item {
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&__ad {
|
||||||
|
&-link {
|
||||||
|
.image {
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.joe_list {
|
||||||
|
&__item {
|
||||||
|
&.single {
|
||||||
|
.thumbnail {
|
||||||
|
height: 150px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.multiple {
|
||||||
|
.thumbnail {
|
||||||
|
grid-template-rows: 70px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -357,13 +357,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
if ($('.joe_header__slideout').hasClass('active')) {
|
if ($('.joe_header__slideout').hasClass('active')) {
|
||||||
$('body').css('overflow', '')
|
$('body').css('overflow', '')
|
||||||
$('.joe_mask').removeClass('active')
|
$('.joe_mask').removeClass('active')
|
||||||
$('.joe_header__above-slide').removeClass("active")
|
$('.joe_header__above-slide').removeClass('active')
|
||||||
$('.joe_header__slideout').removeClass("active")
|
$('.joe_header__slideout').removeClass('active')
|
||||||
} else {
|
} else {
|
||||||
$('body').css('overflow', 'hidden')
|
$('body').css('overflow', 'hidden')
|
||||||
$('.joe_mask').addClass('active')
|
$('.joe_mask').addClass('active')
|
||||||
$('.joe_header__above-slide').addClass("active")
|
$('.joe_header__above-slide').addClass('active')
|
||||||
$('.joe_header__slideout').addClass("active")
|
$('.joe_header__slideout').addClass('active')
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -397,4 +397,17 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
$('.joe_header__above-slide').removeClass('active')
|
$('.joe_header__above-slide').removeClass('active')
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 移动端侧边栏 */
|
||||||
|
{
|
||||||
|
$('.joe_header__slideout-menu .panel').on('click', function () {
|
||||||
|
const panelBox = $(this).parent().parent()
|
||||||
|
console.log(panelBox);
|
||||||
|
/* 清除全部内容 */
|
||||||
|
panelBox.find('.panel').not($(this)).removeClass('in')
|
||||||
|
panelBox.find('.panel-body').not($(this).siblings('.panel-body')).stop().hide('fast')
|
||||||
|
/* 激活当前的内容 */
|
||||||
|
$(this).toggleClass('in').siblings('.panel-body').stop().toggle('fast')
|
||||||
|
})
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
@ -36,8 +36,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
</a>
|
</a>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="${_.permalink}" class="title" title="${_.title}">
|
<a href="${_.permalink}" class="title" title="${_.title}">
|
||||||
<span class="badge" style="display: ${_.type === 'sticky' ? 'block' : 'none'}">置顶</span>
|
<span class="badge" style="display: ${_.type === 'sticky' ? 'inline-block' : 'none'}">置顶</span>${_.title}
|
||||||
<h6>${_.title}</h6>
|
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
@ -63,8 +62,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="${_.permalink}" class="title" title="${_.title}">
|
<a href="${_.permalink}" class="title" title="${_.title}">
|
||||||
<span class="badge" style="display: ${_.type === 'sticky' ? 'block' : 'none'}">置顶</span>
|
<span class="badge" style="display: ${_.type === 'sticky' ? 'inline-block' : 'none'}">置顶</span>${_.title}
|
||||||
<h6>${_.title}</h6>
|
|
||||||
</a>
|
</a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
<ul class="items">
|
<ul class="items">
|
||||||
@ -100,8 +98,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="${_.permalink}" class="title" title="${_.title}">
|
<a href="${_.permalink}" class="title" title="${_.title}">
|
||||||
<span class="badge" style="display: ${_.type === 'sticky' ? 'block' : 'none'}">置顶</span>
|
<span class="badge" style="display: ${_.type === 'sticky' ? 'inline-block' : 'none'}">置顶</span>${_.title}
|
||||||
<h6>${_.title}</h6>
|
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
||||||
</div>
|
</div>
|
||||||
@ -136,8 +133,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="information">
|
<div class="information">
|
||||||
<a href="${_.permalink}" class="title" title="${_.title}">
|
<a href="${_.permalink}" class="title" title="${_.title}">
|
||||||
<span class="badge" style="display: ${_.type === 'sticky' ? 'block' : 'none'}">置顶</span>
|
<span class="badge" style="display: ${_.type === 'sticky' ? 'inline-block' : 'none'}">置顶</span>${_.title}
|
||||||
<h6>${_.title}</h6>
|
|
||||||
</a>
|
</a>
|
||||||
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
<a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
|
||||||
<div class="meta">
|
<div class="meta">
|
||||||
|
@ -564,6 +564,17 @@ function themeConfig($form)
|
|||||||
$JWallpaper_Background_WAP->setAttribute('class', 'joe_content joe_image');
|
$JWallpaper_Background_WAP->setAttribute('class', 'joe_content joe_image');
|
||||||
$form->addInput($JWallpaper_Background_WAP);
|
$form->addInput($JWallpaper_Background_WAP);
|
||||||
|
|
||||||
|
$JAside_Wap_Image = new Typecho_Widget_Helper_Form_Element_Textarea(
|
||||||
|
'JAside_Wap_Image',
|
||||||
|
NULL,
|
||||||
|
"https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/wap_aside_image.jpg",
|
||||||
|
'移动端侧边栏背景',
|
||||||
|
'介绍:用于修改移动端侧边栏背景图片 <br/>
|
||||||
|
格式:图片地址 或 Base64地址'
|
||||||
|
);
|
||||||
|
$JAside_Wap_Image->setAttribute('class', 'joe_content joe_image');
|
||||||
|
$form->addInput($JAside_Wap_Image);
|
||||||
|
|
||||||
$JIndex_Carousel = new Typecho_Widget_Helper_Form_Element_Textarea(
|
$JIndex_Carousel = new Typecho_Widget_Helper_Form_Element_Textarea(
|
||||||
'JIndex_Carousel',
|
'JIndex_Carousel',
|
||||||
NULL,
|
NULL,
|
||||||
|
@ -127,9 +127,9 @@
|
|||||||
<div class="joe_index__title">
|
<div class="joe_index__title">
|
||||||
<ul class="joe_index__title-title">
|
<ul class="joe_index__title-title">
|
||||||
<li class="item" data-type="created">最新文章</li>
|
<li class="item" data-type="created">最新文章</li>
|
||||||
|
<li class="item" data-type="views">热门文章</li>
|
||||||
<li class="item" data-type="commentsNum">评论最多</li>
|
<li class="item" data-type="commentsNum">评论最多</li>
|
||||||
<li class="item" data-type="agree">点赞最多</li>
|
<li class="item" data-type="agree">点赞最多</li>
|
||||||
<li class="item" data-type="views">浏览最多</li>
|
|
||||||
<li class="line"></li>
|
<li class="line"></li>
|
||||||
</ul>
|
</ul>
|
||||||
<?php
|
<?php
|
||||||
|
@ -163,23 +163,23 @@
|
|||||||
<div class="joe_header__below">
|
<div class="joe_header__below">
|
||||||
<div class="joe_container">
|
<div class="joe_container">
|
||||||
<nav class="joe_header__below-class">
|
<nav class="joe_header__below-class">
|
||||||
<?php $this->widget('Widget_Metas_Category_List')->to($item); ?>
|
<?php $this->widget('Widget_Metas_Category_List')->to($category); ?>
|
||||||
<?php while ($item->next()) : ?>
|
<?php while ($category->next()) : ?>
|
||||||
<?php if ($item->levels === 0) : ?>
|
<?php if ($category->levels === 0) : ?>
|
||||||
<?php $children = $item->getAllChildren($item->mid); ?>
|
<?php $children = $category->getAllChildren($category->mid); ?>
|
||||||
<?php if (empty($children)) : ?>
|
<?php if (empty($children)) : ?>
|
||||||
<a class="item <?php echo $this->is('category', $item->slug) ? 'active' : '' ?>" href="<?php $item->permalink(); ?>" title="<?php $item->name(); ?>"><?php $item->name(); ?></a>
|
<a class="item <?php echo $this->is('category', $category->slug) ? 'active' : '' ?>" href="<?php $category->permalink(); ?>" title="<?php $category->name(); ?>"><?php $category->name(); ?></a>
|
||||||
<?php else : ?>
|
<?php else : ?>
|
||||||
<div class="joe_dropdown" trigger="hover">
|
<div class="joe_dropdown" trigger="hover">
|
||||||
<div class="joe_dropdown__link">
|
<div class="joe_dropdown__link">
|
||||||
<a class="item <?php echo $this->is('category', $item->slug) ? 'active' : '' ?>" href="<?php $item->permalink(); ?>" title="<?php $item->name(); ?>"><?php $item->name(); ?></a>
|
<a class="item <?php echo $this->is('category', $category->slug) ? 'active' : '' ?>" href="<?php $category->permalink(); ?>" title="<?php $category->name(); ?>"><?php $category->name(); ?></a>
|
||||||
<svg class="joe_dropdown__link-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
<svg class="joe_dropdown__link-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
||||||
<path d="M561.873 725.165c-11.262 11.262-26.545 21.72-41.025 18.502-14.479 2.413-28.154-8.849-39.415-18.502L133.129 375.252c-17.697-17.696-17.697-46.655 0-64.352s46.655-17.696 64.351 0l324.173 333.021 324.977-333.02c17.696-17.697 46.655-17.697 64.351 0s17.697 46.655 0 64.351L561.873 725.165z" p-id="3535" fill="var(--minor)"></path>
|
<path d="M561.873 725.165c-11.262 11.262-26.545 21.72-41.025 18.502-14.479 2.413-28.154-8.849-39.415-18.502L133.129 375.252c-17.697-17.696-17.697-46.655 0-64.352s46.655-17.696 64.351 0l324.173 333.021 324.977-333.02c17.696-17.697 46.655-17.697 64.351 0s17.697 46.655 0 64.351L561.873 725.165z" p-id="3535" fill="var(--minor)"></path>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
<nav class="joe_dropdown__menu">
|
<nav class="joe_dropdown__menu">
|
||||||
<?php foreach ($children as $mid) : ?>
|
<?php foreach ($children as $mid) : ?>
|
||||||
<?php $child = $item->getCategory($mid); ?>
|
<?php $child = $category->getCategory($mid); ?>
|
||||||
<a class="<?php echo $this->is('category', $child['slug']) ? 'active' : '' ?>" href="<?php echo $child['permalink'] ?>" title="<?php echo $child['name']; ?>"><?php echo $child['name']; ?></a>
|
<a class="<?php echo $this->is('category', $child['slug']) ? 'active' : '' ?>" href="<?php echo $child['permalink'] ?>" title="<?php echo $child['name']; ?>"><?php echo $child['name']; ?></a>
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</nav>
|
</nav>
|
||||||
@ -259,7 +259,93 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="joe_header__slideout">
|
<div class="joe_header__slideout">
|
||||||
<img src="" alt="">
|
<img class="joe_header__slideout-image lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="<?php $this->options->JAside_Wap_Image() ?>" onerror="javascript: this.src='data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';" alt="<?php $this->author->screenName(); ?>" />
|
||||||
|
<div class="joe_header__slideout-author">
|
||||||
|
<img class="avatar lazyload" src="<?php _getAvatarLazyload(); ?>" data-src="<?php _getAvatarByMail($this->author->mail) ?>" onerror="javascript: this.src = '<?php _getAvatarLazyload(); ?>'" alt="<?php $this->author->screenName(); ?>" />
|
||||||
|
<div class="info">
|
||||||
|
<a class="link" href="<?php $this->options->JAside_Author_Link() ?>" target="_blank" rel="noopener noreferrer nofollow"><?php $this->author->screenName(); ?></a>
|
||||||
|
<p class="motto"><?php _getAsideAuthorMotto() ?></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ul class="joe_header__slideout-menu panel-box">
|
||||||
|
<li>
|
||||||
|
<a class="link" href="<?php $this->options->siteUrl(); ?>" title="首页">
|
||||||
|
<span>首页</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<!-- 栏目 -->
|
||||||
|
<li>
|
||||||
|
<a class="link panel" href="#" rel="nofollow">
|
||||||
|
<span>栏目</span>
|
||||||
|
<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
||||||
|
<path d="M624.86499999 512.247l-292.15499999-292.159c-12.28-12.27-12.28-32.186 0-44.457 12.27-12.28 32.186-12.28 44.457 0l314.388 314.388c12.28 12.27 12.28 32.186 0 44.457l-314.388 314.387c-6.136 6.14-14.183 9.211-22.228 9.211s-16.092-3.071-22.228-9.211c-12.28-12.27-12.28-32.186 0-44.457l292.155-292.16z" p-id="1742"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
<ul class="slides panel-body panel-box">
|
||||||
|
<?php while ($category->next()) : ?>
|
||||||
|
<?php if ($category->levels === 0) : ?>
|
||||||
|
<?php $children = $category->getAllChildren($category->mid); ?>
|
||||||
|
<?php if (empty($children)) : ?>
|
||||||
|
<li>
|
||||||
|
<a class="link" href="<?php $category->permalink(); ?>" title="<?php $category->name(); ?>"><?php $category->name(); ?></a>
|
||||||
|
</li>
|
||||||
|
<?php else : ?>
|
||||||
|
<li>
|
||||||
|
<div class="link panel">
|
||||||
|
<a href="<?php $category->permalink(); ?>" title="<?php $category->name(); ?>"><?php $category->name(); ?></a>
|
||||||
|
<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
||||||
|
<path d="M624.86499999 512.247l-292.15499999-292.159c-12.28-12.27-12.28-32.186 0-44.457 12.27-12.28 32.186-12.28 44.457 0l314.388 314.388c12.28 12.27 12.28 32.186 0 44.457l-314.388 314.387c-6.136 6.14-14.183 9.211-22.228 9.211s-16.092-3.071-22.228-9.211c-12.28-12.27-12.28-32.186 0-44.457l292.155-292.16z" p-id="1742"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<ul class="slides panel-body">
|
||||||
|
<?php foreach ($children as $mid) : ?>
|
||||||
|
<?php $child = $category->getCategory($mid); ?>
|
||||||
|
<li>
|
||||||
|
<a class="link" href="<?php echo $child['permalink'] ?>" title="<?php echo $child['name']; ?>"><?php echo $child['name']; ?></a>
|
||||||
|
</li>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endwhile; ?>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<!-- 页面 -->
|
||||||
|
<li>
|
||||||
|
<a class="link panel" href="#" rel="nofollow">
|
||||||
|
<span>页面</span>
|
||||||
|
<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
||||||
|
<path d="M624.86499999 512.247l-292.15499999-292.159c-12.28-12.27-12.28-32.186 0-44.457 12.27-12.28 32.186-12.28 44.457 0l314.388 314.388c12.28 12.27 12.28 32.186 0 44.457l-314.388 314.387c-6.136 6.14-14.183 9.211-22.228 9.211s-16.092-3.071-22.228-9.211c-12.28-12.27-12.28-32.186 0-44.457l292.155-292.16z" p-id="1742"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
<ul class="slides panel-body">
|
||||||
|
<?php foreach ($pages->stack as $item) : ?>
|
||||||
|
<li>
|
||||||
|
<a class="link" href="<?php echo $item['permalink'] ?>" title="<?php echo $item['title'] ?>"><?php echo $item['title'] ?></a>
|
||||||
|
</li>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<!-- 推荐 -->
|
||||||
|
<?php if (sizeof($custom) > 0) : ?>
|
||||||
|
<li>
|
||||||
|
<a class="link panel" href="#" rel="nofollow">
|
||||||
|
<span>推荐</span>
|
||||||
|
<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="13" height="13">
|
||||||
|
<path d="M624.86499999 512.247l-292.15499999-292.159c-12.28-12.27-12.28-32.186 0-44.457 12.27-12.28 32.186-12.28 44.457 0l314.388 314.388c12.28 12.27 12.28 32.186 0 44.457l-314.388 314.387c-6.136 6.14-14.183 9.211-22.228 9.211s-16.092-3.071-22.228-9.211c-12.28-12.27-12.28-32.186 0-44.457l292.155-292.16z" p-id="1742"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
<ul class="slides panel-body">
|
||||||
|
<?php foreach ($custom as $item) : ?>
|
||||||
|
<li>
|
||||||
|
<a class="link" href="<?php echo $item['url'] ?>" target="_blank" rel="noopener noreferrer nofollow"><?php echo $item['title'] ?></a>
|
||||||
|
</li>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<?php endif; ?>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user