🎨 Merge branch 'develop'
This commit is contained in:
45
assets/css/_common/components/back-to-top.scss
Normal file
45
assets/css/_common/components/back-to-top.scss
Normal file
@@ -0,0 +1,45 @@
|
||||
@if $back2top_enable {
|
||||
.back-to-top {
|
||||
font-size: $b2t-font-size;
|
||||
|
||||
@if not $back2top_scrollpercent {
|
||||
span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@if $back2top_sidebar {
|
||||
margin: 20px - $sidebar-offset -10px -20px;
|
||||
opacity: 0;
|
||||
transition: opacity $transition-ease;
|
||||
|
||||
&.back-to-top-on {
|
||||
cursor: pointer;
|
||||
opacity: $b2t-opacity;
|
||||
|
||||
&:hover {
|
||||
opacity: $b2t-opacity-hover;
|
||||
}
|
||||
}
|
||||
} @else {
|
||||
bottom: $b2t-position-bottom;
|
||||
box-sizing: border-box;
|
||||
color: $b2t-color;
|
||||
padding: 0 6px;
|
||||
transition: bottom $transition-ease;
|
||||
@include sidebar-toggle();
|
||||
|
||||
@if not $back2top_scrollpercent {
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $sidebar-highlight;
|
||||
}
|
||||
|
||||
&.back-to-top-on {
|
||||
bottom: $b2t-position-bottom-on;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
20
assets/css/_common/components/index.scss
Normal file
20
assets/css/_common/components/index.scss
Normal file
@@ -0,0 +1,20 @@
|
||||
.noscript-warning {
|
||||
background-color: lighten($red, 20%);
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: $zindex-5;
|
||||
}
|
||||
|
||||
@import 'back-to-top';
|
||||
@import 'reading-progress';
|
||||
|
||||
@import 'post';
|
||||
@import 'pages';
|
||||
@import 'third-party';
|
||||
21
assets/css/_common/components/pages/breadcrumb.scss
Normal file
21
assets/css/_common/components/pages/breadcrumb.scss
Normal file
@@ -0,0 +1,21 @@
|
||||
ul.breadcrumb {
|
||||
font-size: $font-size-smallest;
|
||||
list-style: none;
|
||||
margin: 1em 0;
|
||||
padding: 0 2em;
|
||||
text-align: center;
|
||||
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
li:not(:first-child)::before {
|
||||
content: '/\00a0';
|
||||
font-weight: normal;
|
||||
padding: .5em;
|
||||
}
|
||||
|
||||
li:last-child {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
39
assets/css/_common/components/pages/categories.scss
Normal file
39
assets/css/_common/components/pages/categories.scss
Normal file
@@ -0,0 +1,39 @@
|
||||
.category-all-page {
|
||||
|
||||
min-height: 700px;
|
||||
|
||||
.category-all-title {
|
||||
font-size: 1.35em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.category-all {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.category-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.category-list-item {
|
||||
margin: 5px 10px;
|
||||
}
|
||||
|
||||
.category-list-count {
|
||||
color: $grey;
|
||||
|
||||
&::before {
|
||||
content: ' (';
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: ') ';
|
||||
}
|
||||
}
|
||||
|
||||
.category-list-child {
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
5
assets/css/_common/components/pages/index.scss
Normal file
5
assets/css/_common/components/pages/index.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
// Page specific styles
|
||||
@import 'categories';
|
||||
@import 'schedule';
|
||||
@import 'breadcrumb';
|
||||
@import 'tag-cloud';
|
||||
102
assets/css/_common/components/pages/schedule.scss
Normal file
102
assets/css/_common/components/pages/schedule.scss
Normal file
@@ -0,0 +1,102 @@
|
||||
@keyframes dot-flash {
|
||||
from {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0;
|
||||
transform: scale(.8);
|
||||
}
|
||||
}
|
||||
|
||||
.event-list {
|
||||
hr {
|
||||
background: $black-deep;
|
||||
margin: 20px 0 45px;
|
||||
|
||||
&::after {
|
||||
background: $black-deep;
|
||||
color: white;
|
||||
content: 'NOW';
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.event {
|
||||
--event-background: #{$black-deep};
|
||||
--event-foreground: #{$grey};
|
||||
--event-title: white;
|
||||
background: var(--event-background);
|
||||
padding: 15px;
|
||||
|
||||
.event-summary {
|
||||
border-bottom: 0;
|
||||
color: var(--event-title);
|
||||
margin: 0;
|
||||
padding: 0 0 0 35px;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
animation: dot-flash 1s alternate infinite ease-in-out;
|
||||
background: var(--event-title);
|
||||
left: 0;
|
||||
margin-top: -6px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@include round-icon(12px);
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-of-type(odd) .event-summary::before {
|
||||
animation-delay: .5s;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.event-relative-time {
|
||||
color: var(--event-foreground);
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.event-details {
|
||||
color: var(--event-foreground);
|
||||
display: block;
|
||||
line-height: 18px;
|
||||
padding: 6px 0 6px 35px;
|
||||
|
||||
&::before {
|
||||
color: var(--event-foreground);
|
||||
display: inline-block;
|
||||
margin-right: 9px;
|
||||
width: 14px;
|
||||
@include font-family-icons();
|
||||
}
|
||||
|
||||
&.event-location::before {
|
||||
content: '\f041';
|
||||
}
|
||||
|
||||
&.event-duration::before {
|
||||
content: '\f017';
|
||||
}
|
||||
|
||||
&.event-description::before {
|
||||
content: '\f024';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.event-past {
|
||||
--event-background: #{$whitesmoke};
|
||||
--event-foreground: #{$grey-dark};
|
||||
--event-title: #{$black-deep};
|
||||
}
|
||||
}
|
||||
43
assets/css/_common/components/pages/tag-cloud.scss
Normal file
43
assets/css/_common/components/pages/tag-cloud.scss
Normal file
@@ -0,0 +1,43 @@
|
||||
.tag-cloud {
|
||||
text-align: center;
|
||||
min-height: 700px;
|
||||
|
||||
.tag-cloud-title {
|
||||
text-align: center;
|
||||
font-size: 1.35em;
|
||||
|
||||
.tag-list-count {
|
||||
font-size: 0.56em;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-cloud-tags {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@for $tag-cloud from 0 through 10 {
|
||||
$tag-cloud-color : mix($tag-cloud-end, $tag-cloud-start, $tag-cloud * 10);
|
||||
.tag-cloud-#{$tag-cloud} {
|
||||
border-bottom-color: $tag-cloud-color;
|
||||
color: $tag-cloud-color;
|
||||
font-size: #{0.85+($tag-cloud * 0.05)}em
|
||||
}
|
||||
}
|
||||
|
||||
@if $darkmode {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@for $tag-cloud from 0 through 10 {
|
||||
$tag-cloud-color : mix($tag-cloud-end-dark, $tag-cloud-start-dark, $tag-cloud * 10);
|
||||
.tag-cloud-#{$tag-cloud} {
|
||||
border-bottom-color: $tag-cloud-color;
|
||||
color: $tag-cloud-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
53
assets/css/_common/components/post/index.scss
Normal file
53
assets/css/_common/components/post/index.scss
Normal file
@@ -0,0 +1,53 @@
|
||||
.rtl {
|
||||
&.post-body {
|
||||
p, a, h1, h2, h3, h4, h5, h6, li, ul, ol {
|
||||
direction: rtl;
|
||||
font-family: UKIJ Ekran;
|
||||
}
|
||||
}
|
||||
|
||||
&.post-title {
|
||||
font-family: UKIJ Ekran;
|
||||
}
|
||||
}
|
||||
|
||||
.post-button {
|
||||
margin-top: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.use-motion {
|
||||
@if $motion_trans_post_block {
|
||||
.post-block, .pagination, .comments, .post-comments {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@if $motion_trans_post_header {
|
||||
.post-header {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@if $motion_trans_post_body {
|
||||
.post-body {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@if $motion_trans_coll_header {
|
||||
.collection-header {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@import 'post-collapse';
|
||||
@import 'post-body';
|
||||
@import 'post-gallery';
|
||||
@import 'post-header';
|
||||
@import 'post-nav';
|
||||
@import 'post-footer';
|
||||
@import 'post-widgets';
|
||||
@import 'post-reward';
|
||||
@import 'post-followme';
|
||||
79
assets/css/_common/components/post/post-body.scss
Normal file
79
assets/css/_common/components/post/post-body.scss
Normal file
@@ -0,0 +1,79 @@
|
||||
.post-body {
|
||||
font-family: $font-family-posts;
|
||||
@include word-wrap();
|
||||
|
||||
@include desktop-large() {
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
|
||||
@include desktop() {
|
||||
text-align: unquote($text_align_desktop);
|
||||
}
|
||||
|
||||
@include tablet-mobile() {
|
||||
text-align: unquote($text_align_mobile);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
// Supported plugins: hexo-renderer-markdown-it hexo-renderer-marked
|
||||
.header-anchor, .headerlink {
|
||||
border-bottom-style: none;
|
||||
color: inherit;
|
||||
float: right;
|
||||
font-size: $font-size-small;
|
||||
margin-left: 10px;
|
||||
opacity: 0;
|
||||
|
||||
&::before {
|
||||
@include font-family-icons('\f0c1');
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.header-anchor, .headerlink {
|
||||
opacity: .5;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.exturl .fa {
|
||||
font-size: $font-size-small;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
// For fancybox and pandoc
|
||||
.image-caption, img + figcaption, .fancybox + figcaption {
|
||||
color: $grey-dark;
|
||||
font-size: $font-size-small;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
margin: -15px auto 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
iframe, img, video, embed {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
height: 0;
|
||||
margin-bottom: 20px;
|
||||
overflow: hidden;
|
||||
padding-top: 75%;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
iframe, object, embed {
|
||||
height: 100%;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
109
assets/css/_common/components/post/post-collapse.scss
Normal file
109
assets/css/_common/components/post/post-collapse.scss
Normal file
@@ -0,0 +1,109 @@
|
||||
.posts-collapse .post-content {
|
||||
margin-bottom: $posts-collapse-margin;
|
||||
margin-left: $posts-collapse-margin;
|
||||
position: relative;
|
||||
|
||||
@include mobile() {
|
||||
margin-left: $posts-collapse-margin-mobile;
|
||||
margin-right: $posts-collapse-margin-mobile;
|
||||
}
|
||||
|
||||
.collection-title {
|
||||
font-size: $font-size-large;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background: $grey-dark;
|
||||
border: 1px solid white;
|
||||
margin-left: -6px;
|
||||
margin-top: -4px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@include round-icon(10px);
|
||||
}
|
||||
}
|
||||
|
||||
.collection-year {
|
||||
font-size: $font-size-largest;
|
||||
font-weight: bold;
|
||||
margin: 60px 0;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background: $grey;
|
||||
margin-left: -4px;
|
||||
margin-top: -4px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@include round-icon(8px);
|
||||
}
|
||||
}
|
||||
|
||||
.collection-header {
|
||||
display: block;
|
||||
margin-left: 20px;
|
||||
|
||||
small {
|
||||
color: $grey;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.post-header {
|
||||
border-bottom: 1px dashed $grey-light;
|
||||
// 2px is equal to half the width of .posts-collapse::before
|
||||
margin: 30px 2px 0;
|
||||
padding-left: 15px;
|
||||
position: relative;
|
||||
transition: border $transition-ease;
|
||||
|
||||
&::before {
|
||||
background: $grey;
|
||||
border: 1px solid white;
|
||||
left: -6px;
|
||||
position: absolute;
|
||||
top: $font-size-smallest;
|
||||
transition: background $transition-ease;
|
||||
@include round-icon(6px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-bottom-color: $grey-dim;
|
||||
|
||||
&::before {
|
||||
background: $black-deep;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-meta-container {
|
||||
display: inline;
|
||||
font-size: $font-size-smallest;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.post-title {
|
||||
display: inline;
|
||||
|
||||
a {
|
||||
border-bottom: 0;
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.fa-external-link-alt {
|
||||
font-size: $font-size-small;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&::before {
|
||||
background: $whitesmoke;
|
||||
content: ' ';
|
||||
height: 100%;
|
||||
margin-left: -2px;
|
||||
position: absolute;
|
||||
// To do: 1.25em is inaccurate when .collection-title has line breaks on mobile
|
||||
top: 1.25em;
|
||||
width: 4px;
|
||||
}
|
||||
}
|
||||
41
assets/css/_common/components/post/post-followme.scss
Normal file
41
assets/css/_common/components/post/post-followme.scss
Normal file
@@ -0,0 +1,41 @@
|
||||
@if $follow_me {
|
||||
.followme {
|
||||
color: $grey;
|
||||
/* padding: 1em 1.5em; */
|
||||
text-align: center;
|
||||
@include post-card();
|
||||
border-left: none;
|
||||
border-bottom: #46b404 solid 5px;
|
||||
|
||||
.social-list {
|
||||
@include flex-wrap();
|
||||
|
||||
.social-item {
|
||||
margin: .5em 2em;
|
||||
|
||||
a:hover {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@include tablet-mobile() {
|
||||
margin: .5em .75em;
|
||||
}
|
||||
}
|
||||
|
||||
.social-link {
|
||||
border: 0;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
|
||||
.icon {
|
||||
font-size: 1.75em;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
90
assets/css/_common/components/post/post-footer.scss
Normal file
90
assets/css/_common/components/post/post-footer.scss
Normal file
@@ -0,0 +1,90 @@
|
||||
// Flexbox layout makes it possible to reorder the child
|
||||
// elements of .post-footer through the `order` CSS property
|
||||
// Fix issue #16
|
||||
// To do: use `gap` instead of `margin`
|
||||
// See https://caniuse.com/flexbox-gap
|
||||
.post-footer {
|
||||
@include flex-column();
|
||||
|
||||
hr{
|
||||
text-align:center;
|
||||
line-height:0px;
|
||||
height: 0px;
|
||||
background-image: none;
|
||||
border-bottom: .125em dashed #999;
|
||||
margin: 24px 0 12px 0;
|
||||
|
||||
&:after{
|
||||
content: $post_end_line_tip;
|
||||
font-size: .9em;
|
||||
font-weight: bold;
|
||||
background: #fff;
|
||||
padding: 0 5px;
|
||||
z-index:2;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.post-eof {
|
||||
background: $grey-light;
|
||||
height: 1px;
|
||||
margin: $post-eof-margin-top auto $post-eof-margin-bottom;
|
||||
width: 8%;
|
||||
|
||||
.post-block:last-of-type & {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@if $creative_commons_post {
|
||||
|
||||
.post-copyright {
|
||||
border-left: 3px solid #ff2a2a;
|
||||
background: var(--card-bg-color);
|
||||
|
||||
img {
|
||||
margin: 8px;
|
||||
opacity: .8;
|
||||
filter: blur(.08em);
|
||||
-webkit-transform: rotate(320deg);
|
||||
-moz-transform: rotate(320deg);
|
||||
-ms-transform: rotate(320deg);
|
||||
-o-transform: rotate(320deg);
|
||||
transform: rotate(320deg);
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: .5em 1em;
|
||||
@include post-card();
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.post-tags {
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
font-size: $font-size-smaller;
|
||||
|
||||
&:before {
|
||||
@if $post_end_tag_icon {
|
||||
content: "🔖";
|
||||
font-size: 1.25em;
|
||||
}
|
||||
@else {
|
||||
content: "#";
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
33
assets/css/_common/components/post/post-gallery.scss
Normal file
33
assets/css/_common/components/post/post-gallery.scss
Normal file
@@ -0,0 +1,33 @@
|
||||
.post-gallery {
|
||||
display: flex;
|
||||
min-height: 200px;
|
||||
|
||||
.post-gallery-image {
|
||||
flex: 1;
|
||||
|
||||
&:not(:first-child) {
|
||||
clip-path: polygon(40px 0, 100% 0, 100% 100%, 0 100%);
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
// Override darkmode image opacity.
|
||||
opacity: 1;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.posts-expand .post-gallery {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.posts-collapse .post-gallery {
|
||||
margin: 15px 0;
|
||||
}
|
||||
121
assets/css/_common/components/post/post-header.scss
Normal file
121
assets/css/_common/components/post/post-header.scss
Normal file
@@ -0,0 +1,121 @@
|
||||
.posts-expand .post-header {
|
||||
font-size: $font-size-large;
|
||||
margin-bottom: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.posts-expand .post-title {
|
||||
font-size: $font-size-largest;
|
||||
font-weight: normal;
|
||||
margin: initial;
|
||||
@include word-wrap();
|
||||
|
||||
@if $post_edit_enable {
|
||||
.post-edit-link {
|
||||
border-bottom: 0;
|
||||
color: $grey;
|
||||
float: right;
|
||||
font-size: $font-size-larger;
|
||||
margin-left: -1.2em;
|
||||
transition: color $transition-ease-in;
|
||||
|
||||
@include mobile-small() {
|
||||
margin-left: initial;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $sidebar-highlight;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.posts-expand .post-title-link {
|
||||
border-bottom: 0;
|
||||
color: var(--link-color);
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background: var(--link-color);
|
||||
bottom: 0;
|
||||
content: '';
|
||||
height: 2px;
|
||||
// Fix issue #75
|
||||
left: 0;
|
||||
position: absolute;
|
||||
transform: scaleX(0);
|
||||
transition: transform $transition-ease;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&:hover::before {
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
.fa-external-link-alt {
|
||||
font-size: $font-size-small;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.post-sticky-flag {
|
||||
display: inline-block;
|
||||
// Fix issue #80 #140
|
||||
margin-right: 8px;
|
||||
transform: rotate(30deg);
|
||||
}
|
||||
|
||||
.posts-expand .post-meta-container {
|
||||
color: $grey-dark;
|
||||
font-family: $font-family-posts;
|
||||
font-size: $font-size-smallest;
|
||||
margin-top: 3px;
|
||||
|
||||
.post-description {
|
||||
font-size: $font-size-small;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
time {
|
||||
border-bottom: 1px dashed $grey-dark;
|
||||
}
|
||||
}
|
||||
|
||||
// Flexbox layout makes it possible to reorder the child
|
||||
// elements of .post-meta through the `order` CSS property
|
||||
.post-meta {
|
||||
@include flex-wrap();
|
||||
}
|
||||
|
||||
// .post-meta-item exists in .post-meta and footer
|
||||
:not(.post-meta-break) + .post-meta-item::before {
|
||||
content: '|';
|
||||
margin: 0 .5em;
|
||||
}
|
||||
|
||||
/* Make post meta dislay in oneline
|
||||
.post-meta-item-icon {
|
||||
margin-right: 3px;
|
||||
} */
|
||||
|
||||
.post-meta-item-text {
|
||||
@if not $post_meta_item_text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include tablet-mobile() {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.post-meta-break {
|
||||
flex-basis: 100%;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
@if $busuanzi_enable and $busuanzi_post_views {
|
||||
#busuanzi_container_page_pv {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
41
assets/css/_common/components/post/post-nav.scss
Normal file
41
assets/css/_common/components/post/post-nav.scss
Normal file
@@ -0,0 +1,41 @@
|
||||
.post-nav {
|
||||
border-top: 1px solid $gainsboro;
|
||||
display: flex;
|
||||
gap: 30px;
|
||||
justify-content: space-between;
|
||||
margin-top: 1em;
|
||||
padding: 10px 5px 0;
|
||||
}
|
||||
|
||||
.post-nav-item {
|
||||
flex: 1;
|
||||
|
||||
a {
|
||||
border-bottom: 0;
|
||||
display: block;
|
||||
font-size: $font-size-small;
|
||||
line-height: 1.6;
|
||||
|
||||
&:active {
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
font-size: $font-size-smallest;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
.fa {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
text-align: right;
|
||||
|
||||
.fa {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
65
assets/css/_common/components/post/post-reward.scss
Normal file
65
assets/css/_common/components/post/post-reward.scss
Normal file
@@ -0,0 +1,65 @@
|
||||
.reward-container {
|
||||
margin: $post-card-margin;
|
||||
/* padding: 1em 0; */
|
||||
text-align: center;
|
||||
|
||||
div>i {
|
||||
font-size: 1.85em;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
button {
|
||||
@include button($sidebar-highlight);
|
||||
border: 2px solid $sidebar-highlight;
|
||||
border-radius: 2px;
|
||||
outline: 0;
|
||||
transition: all $transition-ease;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
}
|
||||
|
||||
.post-reward {
|
||||
display: none;
|
||||
padding-top: 20px;
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.post-reward-item {
|
||||
display: inline-block;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@if $reward_settings_animation {
|
||||
|
||||
&:hover span {
|
||||
animation: next-roll .1s infinite linear;
|
||||
// The animation may affect :hover of img in dark mode
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
margin: .8em 1.2em;
|
||||
max-width: 100%;
|
||||
width: 180px;
|
||||
border: #eee 1px solid;
|
||||
box-shadow:rgba(0,0,0,0.2) 0 1px 5px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes next-roll {
|
||||
from {
|
||||
transform: rotateZ(30deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotateZ(-30deg);
|
||||
}
|
||||
}
|
||||
20
assets/css/_common/components/post/post-widgets.scss
Normal file
20
assets/css/_common/components/post/post-widgets.scss
Normal file
@@ -0,0 +1,20 @@
|
||||
.post-widgets {
|
||||
border-top: 1px solid $gainsboro;
|
||||
margin-top: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.wpac-rating-container {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-top: 10px;
|
||||
padding-top: 6px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.social-like {
|
||||
display: flex;
|
||||
font-size: $font-size-small;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
27
assets/css/_common/components/reading-progress.scss
Normal file
27
assets/css/_common/components/reading-progress.scss
Normal file
@@ -0,0 +1,27 @@
|
||||
@if $reading_progress_enable {
|
||||
.reading-progress-bar {
|
||||
--progress: 0;
|
||||
background: $reading_progress_color;
|
||||
height: $reading_progress_height;
|
||||
position: fixed;
|
||||
z-index: $zindex-5;
|
||||
|
||||
@if $reading_progress_reversed {
|
||||
width: calc(100% - var(--progress));
|
||||
} @else {
|
||||
width: var(--progress);
|
||||
}
|
||||
|
||||
@if $reading_progress_start == 'right' {
|
||||
right: 0;
|
||||
} @else {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@if $reading_progress_position == 'bottom' {
|
||||
bottom: 0;
|
||||
} @else {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
39
assets/css/_common/components/third-party/disqusjs.scss
vendored
Normal file
39
assets/css/_common/components/third-party/disqusjs.scss
vendored
Normal file
@@ -0,0 +1,39 @@
|
||||
@if $disqusjs_enable and $darkmode {
|
||||
@media (prefers-color-scheme:dark) {
|
||||
html #dsqjs a {
|
||||
color: var(--link-color)
|
||||
}
|
||||
|
||||
html #dsqjs a:focus,html #dsqjs a:hover {
|
||||
color: var(--link-hover-color)
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-nav,html #dsqjs footer {
|
||||
border-color: var(--card-bg-color)
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-load-more,html #dsqjs .dsqjs-load-more:hover,html #dsqjs .dsqjs-nav-tab,html #dsqjs .dsqjs-no-comment,html #dsqjs .dsqjs-post-content {
|
||||
color: var(--text-color)
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-order-label {
|
||||
background-color: #3e4b5e
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-order-radio:checked+.dsqjs-order-label {
|
||||
background-color: var(--content-bg-color)
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-tab-active>span:after {
|
||||
background-color: #2e9fff!important
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-footer,html #dsqjs .dsqjs-meta {
|
||||
color: var(--text-color)
|
||||
}
|
||||
|
||||
html #dsqjs .dsqjs-post-body blockquote {
|
||||
border-color: var(--content-bg-color)
|
||||
}
|
||||
}
|
||||
}
|
||||
9
assets/css/_common/components/third-party/gitalk.scss
vendored
Normal file
9
assets/css/_common/components/third-party/gitalk.scss
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
@if $gitalk_enable {
|
||||
.gt-header a, .gt-comments a, .gt-popup a {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.gt-container .gt-popup .gt-action.is--active::before {
|
||||
top: .7em;
|
||||
}
|
||||
}
|
||||
7
assets/css/_common/components/third-party/gitter.scss
vendored
Normal file
7
assets/css/_common/components/third-party/gitter.scss
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
@if $gitter_enable {
|
||||
.gitter-open-chat-button {
|
||||
$alignment : sidebar-toggle-alignment(false);
|
||||
#{$alignment[0]}: auto !important;
|
||||
#{$alignment[1]}: 10px !important;
|
||||
}
|
||||
}
|
||||
20
assets/css/_common/components/third-party/index.scss
vendored
Normal file
20
assets/css/_common/components/third-party/index.scss
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
@import 'disqusjs';
|
||||
@import 'gitalk';
|
||||
@import 'utterances';
|
||||
@import 'search';
|
||||
@import 'related-posts';
|
||||
@import 'math';
|
||||
@import 'gitter';
|
||||
@import 'livere';
|
||||
@import 'waline';
|
||||
|
||||
.use-motion .animated {
|
||||
// Fix issue #48 #55
|
||||
animation-fill-mode: none;
|
||||
// Fix issue #46 .animated in .sidebar
|
||||
visibility: inherit;
|
||||
}
|
||||
|
||||
.use-motion .sidebar .animated {
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
5
assets/css/_common/components/third-party/livere.scss
vendored
Normal file
5
assets/css/_common/components/third-party/livere.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
@if $livere_enable {
|
||||
#livereAdWrapper, #taboola-livere {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
9
assets/css/_common/components/third-party/math.scss
vendored
Normal file
9
assets/css/_common/components/third-party/math.scss
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
@if $math_mathjax_enable {
|
||||
mjx-container[jax='CHTML'][display='true'], .has-jax {
|
||||
overflow: auto hidden;
|
||||
}
|
||||
|
||||
mjx-container[display='true'] + br {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
23
assets/css/_common/components/third-party/related-posts.scss
vendored
Normal file
23
assets/css/_common/components/third-party/related-posts.scss
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
@if $related_posts_enable {
|
||||
.popular-posts-header {
|
||||
border-bottom: 1px solid $gainsboro;
|
||||
font-size: $font-size-large;
|
||||
margin-bottom: 10px;
|
||||
margin-top: $post-eof-margin-bottom;
|
||||
}
|
||||
|
||||
.popular-posts {
|
||||
padding: 0;
|
||||
|
||||
.popular-posts-item {
|
||||
margin-left: 2em;
|
||||
|
||||
.popular-posts-title {
|
||||
font-size: $font-size-small;
|
||||
font-weight: normal;
|
||||
line-height: $line-height-base * 1.2;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
179
assets/css/_common/components/third-party/search.scss
vendored
Normal file
179
assets/css/_common/components/third-party/search.scss
vendored
Normal file
@@ -0,0 +1,179 @@
|
||||
@if $local_search_enable or $algolia_search_enable {
|
||||
.search-active {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.search-pop-overlay {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
display: flex;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
transition: visibility .4s, background .4s;
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
z-index: $zindex-4;
|
||||
|
||||
.search-active & {
|
||||
background: rgba(0, 0, 0, .3);
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
.search-popup {
|
||||
background: var(--card-bg-color);
|
||||
border-radius: 5px;
|
||||
height: 80%;
|
||||
margin: auto;
|
||||
transform: scale(0);
|
||||
transition: transform .4s;
|
||||
width: 700px;
|
||||
|
||||
.search-active & {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
@include mobile() {
|
||||
border-radius: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-icon, .popup-btn-close {
|
||||
color: $grey-dark;
|
||||
font-size: 18px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.popup-btn-close {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover .fa {
|
||||
color: $black-deep;
|
||||
}
|
||||
}
|
||||
|
||||
.search-header {
|
||||
background: $gainsboro;
|
||||
@if $darkmode {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: $grey-dim;
|
||||
}
|
||||
}
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
input.search-input {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
width: 100%;
|
||||
|
||||
&::-webkit-search-cancel-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-container {
|
||||
height: calc(100% - 55px);
|
||||
overflow: auto;
|
||||
padding: 5px 25px;
|
||||
|
||||
hr {
|
||||
margin: 5px 0 10px;
|
||||
|
||||
&:first-child {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-list {
|
||||
margin: 0 5px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a.search-result-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p.search-result {
|
||||
border-bottom: 1px dashed $grey-light;
|
||||
padding: 5px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if $algolia_search_enable {
|
||||
.search-input-container {
|
||||
flex-grow: 1;
|
||||
|
||||
form {
|
||||
padding: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.search-stats {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
img {
|
||||
height: 1em;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.algolia-pagination {
|
||||
// Override default style of ul
|
||||
margin: 40px 0;
|
||||
opacity: 1;
|
||||
padding: 0;
|
||||
|
||||
.pagination-item {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.current .page-number {
|
||||
@extend %page-number-current;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.disabled-item {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if $local_search_enable {
|
||||
.search-popup {
|
||||
.search-input-container {
|
||||
flex-grow: 1;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.no-result {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.search-result-list {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-result-icon {
|
||||
color: $grey-light;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
mark.search-keyword {
|
||||
background: transparent;
|
||||
border-bottom: 1px dashed $red;
|
||||
color: $red;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
5
assets/css/_common/components/third-party/utterances.scss
vendored
Normal file
5
assets/css/_common/components/third-party/utterances.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
@if $utterances_enable {
|
||||
.utterances {
|
||||
max-width: unset;
|
||||
}
|
||||
}
|
||||
5
assets/css/_common/components/third-party/waline.scss
vendored
Normal file
5
assets/css/_common/components/third-party/waline.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
@if $waline_enable {
|
||||
.wl-actions>button:nth-child(3) {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
@@ -20,6 +20,18 @@
|
||||
text-align: center;
|
||||
@include flex-column();
|
||||
@include main-container();
|
||||
|
||||
@if $footer_vendors_enable {
|
||||
.vendors-list {
|
||||
a {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.use-motion {
|
||||
@@ -66,16 +78,13 @@
|
||||
}
|
||||
|
||||
.with-love {
|
||||
color: $cfg_footer_icon_color;
|
||||
display: inline-block;
|
||||
margin: 0 5px;
|
||||
|
||||
@if $cfg_footer_icon_animated {
|
||||
animation: icon-animate 1.33s ease-in-out infinite;
|
||||
}
|
||||
}
|
||||
|
||||
@if $cfg_footer_beian_enable {
|
||||
.beian img {
|
||||
display: inline-block;
|
||||
margin: 0 3px;
|
||||
@@ -83,15 +92,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
@if $cfg_busuanzi_enable {
|
||||
.busuanzi-count {
|
||||
@if $cfg_busuanzi_visitors {
|
||||
#busuanzi_container_site_uv {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@if $cfg_busuanzi_views {
|
||||
#busuanzi_container_site_pv {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1,17 +1,26 @@
|
||||
@if $cfg_bookmark_enable {
|
||||
@if $bookmark_enable {
|
||||
.book-mark-link {
|
||||
border-bottom: 0;
|
||||
position: fixed;
|
||||
top: -10px;
|
||||
|
||||
transition: top .3s;
|
||||
@include sidebar-toggle-position(true);
|
||||
-moz-transition:top .3s;
|
||||
-webkit-transition:top .3s;
|
||||
-o-transition:top .3s;
|
||||
|
||||
@if not $github_banner_enable {
|
||||
@include sidebar-toggle-position(true);
|
||||
} @else {
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
@include tablet-mobile() {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&::before {
|
||||
color: convert($cfg_bookmark_color);
|
||||
color: $bookmark_color;
|
||||
font-size: 32px;
|
||||
line-height: 1;
|
||||
@include font-family-icons('\f02e');
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
@if $cfg_github_banner_enable {
|
||||
@if $github_banner_enable {
|
||||
@keyframes octocat-wave {
|
||||
0%, 100% {
|
||||
transform: rotate(0);
|
||||
@@ -28,7 +28,7 @@
|
||||
}
|
||||
|
||||
@include tablet-mobile() {
|
||||
@if $cfg_local_search_enable or $cfg_algolia_search_enable {
|
||||
@if $local_search_enable or $algolia_search_enable {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
}
|
||||
*/
|
||||
|
||||
@if $cfg_mobile_layout_economy {
|
||||
@if $mobile_layout_economy {
|
||||
@include mobile-small() {
|
||||
// For Pisces & Gemini schemes only wider width (remove main blocks in Gemini).
|
||||
.main-inner {
|
||||
@@ -56,7 +56,6 @@
|
||||
margin-bottom: 10px !important;
|
||||
padding: 10px !important;
|
||||
|
||||
@if $cfg_note_icons {
|
||||
&:not(.no-icon) {
|
||||
padding-left: 35px !important;
|
||||
}
|
||||
|
||||
@@ -13,6 +13,9 @@
|
||||
}
|
||||
|
||||
.cc-license {
|
||||
|
||||
margin-top: 6px;
|
||||
|
||||
.cc-opacity {
|
||||
border-bottom: 0;
|
||||
opacity: .7;
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
.links-of-author {
|
||||
.links-of-author, .links-of-social {
|
||||
a {
|
||||
font-size: $font-size-smaller;
|
||||
}
|
||||
|
||||
@if not $cfg_social_icons_only {
|
||||
@if not $social_icons_only {
|
||||
.fa, .fab, .far, .fas {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
@@ -3,11 +3,11 @@
|
||||
max-width: $site-author-image-width;
|
||||
padding: 2px;
|
||||
|
||||
@if $cfg_avatar_rounded {
|
||||
@if $avatar_rounded {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@if $cfg_avatar_rotated {
|
||||
@if $avatar_rotated {
|
||||
transition: transform 1s ease-out;
|
||||
|
||||
&:hover {
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
@if $cfg_toc_enable {
|
||||
.post-toc {
|
||||
font-size: $font-size-small;
|
||||
padding: 0 8px;
|
||||
|
||||
ol {
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0 2px 5px 10px;
|
||||
text-align: left;
|
||||
|
||||
> ol {
|
||||
> li {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
@@ -22,14 +22,14 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
@if not $cfg_toc_wrap {
|
||||
@if not $toc_wrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.nav {
|
||||
.nav-child {
|
||||
display: if($cfg_toc_expand_all, block, none);
|
||||
display: if($toc_expand_all, block, none);
|
||||
}
|
||||
|
||||
.active > .nav-child {
|
||||
|
||||
@@ -12,10 +12,8 @@
|
||||
|
||||
@media (any-hover: hover) {
|
||||
body:not(.sidebar-active) .sidebar-toggle:hover {
|
||||
@include toggle-arrow($cfg_sidebar_position);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-active .sidebar-toggle {
|
||||
@include toggle-close($cfg_sidebar_position);
|
||||
}
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
@if $cfg_site_state {
|
||||
.site-state {
|
||||
@include flex-wrap();
|
||||
line-height: 1.4;
|
||||
@@ -8,6 +7,11 @@
|
||||
// Fix issue #103
|
||||
// The click area of the link becomes smaller
|
||||
padding: 0 15px;
|
||||
border-left: 1px solid #eee;
|
||||
|
||||
&:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
a {
|
||||
border-bottom: 0;
|
||||
@@ -15,6 +19,8 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.site-state-item-count {
|
||||
display: block;
|
||||
font-size: $site-state-item-count-font-size;
|
||||
|
||||
@@ -18,7 +18,6 @@ body {
|
||||
position: relative;
|
||||
transition: padding $transition-ease;
|
||||
|
||||
@if $cfg_bd_scrollbar_overlay {
|
||||
overflow-x: hidden;
|
||||
@supports (overflow-x: clip) {
|
||||
overflow-x: clip;
|
||||
@@ -26,7 +25,6 @@ body {
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
@if $cfg_bd_scrollbar_stable {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,3 +37,119 @@
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.post-comments {
|
||||
@if $scheme !='Gemini' {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
.comment-head {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.comment-headline {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-weight: 700;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
@if $two_comments_enable {
|
||||
.comment-switch {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin: 2px auto;
|
||||
padding: 4px 16px;
|
||||
width: max-content;
|
||||
border-radius: 8px;
|
||||
background: #eee;
|
||||
|
||||
.first-comment {
|
||||
color: $first_comment_color;
|
||||
|
||||
@if $two_comments_actived==$first_comment_name {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.second-comment {
|
||||
color: $second_comment_color;
|
||||
|
||||
@if $two_comments_actived==$second_comment_name {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
$switch_btn_bg_color: $first_comment_color;
|
||||
|
||||
.switch-btn {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: -4px 8px 0;
|
||||
width: 42px;
|
||||
height: 22px;
|
||||
border-radius: 34px;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
-webkit-transition: .4s;
|
||||
-moz-transition: .4s;
|
||||
-o-transition: .4s;
|
||||
-ms-transition: .4s;
|
||||
transition: .4s;
|
||||
|
||||
@if $two_comments_actived==$second_comment_name {
|
||||
$switch_btn_bg_color: $second_comment_color;
|
||||
}
|
||||
|
||||
background-color: $switch_btn_bg_color;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
left: 4px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 50%;
|
||||
content: '';
|
||||
background-color: #fff;
|
||||
-webkit-transition: .4s;
|
||||
-moz-transition: .4s;
|
||||
-o-transition: .4s;
|
||||
-ms-transition: .4s;
|
||||
transition: .4s
|
||||
}
|
||||
|
||||
&.move:before {
|
||||
-webkit-transform: translateX(20px);
|
||||
-moz-transform: translateX(20px);
|
||||
-o-transform: translateX(20px);
|
||||
-ms-transform: translateX(20px);
|
||||
transform: translateX(20px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if $two_comments_enable {
|
||||
$first_comment_display: none;
|
||||
$second_comment_display: none;
|
||||
|
||||
@if $two_comments_actived==$first_comment_name {
|
||||
$first_comment_display: block;
|
||||
}
|
||||
|
||||
@if $two_comments_actived==$second_comment_name {
|
||||
$second_comment_display: block;
|
||||
}
|
||||
|
||||
.comment-wrap>div:nth-child(1) {
|
||||
display: $first_comment_display;
|
||||
}
|
||||
|
||||
.comment-wrap>div:nth-child(2) {
|
||||
display: $second_comment_display;
|
||||
}
|
||||
}
|
||||
}
|
||||
4
assets/css/_common/scaffolding/fontawesome/animation.scss
vendored
Normal file
4
assets/css/_common/scaffolding/fontawesome/animation.scss
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
.fa-spin {
|
||||
-webkit-animation: fa-spin .8s infinite linear;
|
||||
animation: fa-spin .8s infinite linear;
|
||||
}
|
||||
1
assets/css/_common/scaffolding/fontawesome/index.scss
vendored
Normal file
1
assets/css/_common/scaffolding/fontawesome/index.scss
vendored
Normal file
@@ -0,0 +1 @@
|
||||
@import 'animation';
|
||||
@@ -11,13 +11,11 @@
|
||||
position: absolute;
|
||||
transition: opacity $transition-ease;
|
||||
|
||||
@if $cfg_codeblock_copy_btn_style == 'flat' {
|
||||
background: white;
|
||||
border: 0;
|
||||
font-size: $font-size-smaller;
|
||||
right: 0;
|
||||
top: 0;
|
||||
} @else if $cfg_codeblock_copy_btn_style == 'mac' {
|
||||
color: var(--highlight-foreground);
|
||||
font-size: 14px;
|
||||
right: 0;
|
||||
@@ -33,7 +31,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
@if $cfg_codeblock_copy_btn_style == 'mac' {
|
||||
figure.highlight {
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4);
|
||||
|
||||
@@ -1,13 +1,8 @@
|
||||
// Use `@use` to fix issue #67
|
||||
// TODO Not understand how to import dymatic variable
|
||||
// @import '(theme.highlight.enable && theme.highlight.light.file) ? theme.highlight.light.file : null';
|
||||
// @import '(theme.prism.enable && theme.prism.light) ? theme.prism.light : null';
|
||||
// @import '(theme.prism.enable && theme.prism.number) ? theme.prism.number : null';
|
||||
|
||||
// @media (prefers-color-scheme: dark) {
|
||||
// @import '(theme.darkmode && theme.highlight.enable && theme.highlight.dark.file) ? theme.highlight.dark.file : null';
|
||||
// @import '(theme.darkmode && theme.prism.enable && theme.prism.dark) ? theme.prism.dark : null';
|
||||
// }
|
||||
|
||||
// @import 'theme.codeblock.copy_button.enable ? "copy-code" : null';
|
||||
|
||||
@@ -43,6 +38,7 @@
|
||||
|
||||
pre, code {
|
||||
font-family: $code-font-family;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
code {
|
||||
@@ -61,6 +57,7 @@ kbd {
|
||||
font-family: inherit;
|
||||
padding: .1em .3em;
|
||||
white-space: nowrap;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
// `highlight.line_number: false` and `highlight.wrap: false`
|
||||
|
||||
@@ -10,3 +10,4 @@
|
||||
@import 'tags';
|
||||
@import 'pagination';
|
||||
@import 'comments';
|
||||
@import 'fontawesome';
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
@if $cfg_mermaid_enable {
|
||||
@if $mermaid_enable {
|
||||
.mermaid {
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
//@use 'sass:map';
|
||||
|
||||
@if $cfg_note_style != 'disabled' {
|
||||
@if $note_style != 'disabled' {
|
||||
.post-body .note {
|
||||
$note-icons : $cfg_note_icons;
|
||||
$note-style : $cfg_note_style;
|
||||
$note-icons : $note_icons;
|
||||
$note-style : $note_style;
|
||||
|
||||
border-radius: $note-border-radius;
|
||||
margin-bottom: 20px;
|
||||
@@ -68,7 +68,6 @@
|
||||
&.#{$type} {
|
||||
@if $note-style == 'flat' {
|
||||
background: map-get($note-bg, $type);
|
||||
@if $cfg_darkmode {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: mix(map-get($note-bg, $type), $body-bg-color-dark, 10%);
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
@if $cfg_pdf_enable {
|
||||
@if $pdf_enable {
|
||||
.pdfobject-container {
|
||||
iframe, embed {
|
||||
height: convert($cfg_pdf_height);
|
||||
height: $pdf_height;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -42,7 +42,6 @@
|
||||
border-radius: $tbr;
|
||||
}
|
||||
|
||||
@if $cfg_tabs_trans_tabs {
|
||||
transition: all $transition-ease-out;
|
||||
}
|
||||
|
||||
@@ -57,7 +56,6 @@
|
||||
width: (18em / 14);
|
||||
}
|
||||
|
||||
@if $cfg_tabs_trans_labels {
|
||||
transition: all $transition-ease-out;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,9 +18,7 @@
|
||||
}
|
||||
|
||||
.toggle.toggle-arrow {
|
||||
@include toggle-arrow($cfg_sidebar_position);
|
||||
}
|
||||
|
||||
.toggle.toggle-close {
|
||||
@include toggle-close($cfg_sidebar_position);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user