This commit is contained in:
2019-05-30 18:52:14 +08:00
commit aa360a22bf
341 changed files with 30369 additions and 0 deletions

View File

@ -0,0 +1,278 @@
@import "../Pisces/_layout";
@import "../Pisces/_brand";
@import "../Pisces/_menu";
@import "../Pisces/_sub-menu";
@import "../Pisces/_sidebar";
// =================================================
// Rewrite _layout.styl
// =================================================
// Sidebar padding used as main desktop content padding for sidebar padding and post blocks padding too.
// In `source/css/_variables/Pisces.styl` there are variable for main offset:
// $sidebar-offset = 12px;
// This value alse can be changed in main NexT config as `sidebar: offset: 12` option.
// In `source/css/_variables/base.styl` there are variables for other resolutions:
// $content-tablet-padding = 10px;
// $content-mobile-padding = 8px;
// P.S. If u want to change this paddings u may set this variables into `source/css/_variables/custom.styl`.
// So, it will 12px in Desktop, 10px in Tablets and 8px in Mobiles for all possible paddings.
// =================================================
// Read values from NexT config and set they as local variables to use as string variables (in any CSS section).
use_seo = hexo-config('seo');
// =================================================
// Desktop layout styles.
// =================================================
// Post blocks.
.content-wrap {
padding: initial;
background: initial;
box-shadow: initial;
border-radius: initial;
}
// Post & Comments blocks.
.post-block {
padding: $content-desktop-padding;
background: white;
box-shadow: $box-shadow-inner;
border-radius: $border-radius-inner;
}
// When blocks are siblings (homepage).
#posts > article + article {
.post-block {
margin-top: $sidebar-offset;
// Rewrite shadows & borders because all blocks have offsets.
box-shadow: $box-shadow;
border-radius: $border-radius;
}
}
// Comments blocks.
.comments {
padding: $content-desktop-padding;
margin: auto;
margin-top: $sidebar-offset;
background: white;
box-shadow: $box-shadow;
border-radius: $border-radius;
}
// Top main padding from header to posts (default 40px).
.posts-expand {
padding-top: initial;
}
// Post navigation items.
.post-nav-divider {
width: 4%;
}
.post-nav-item {
width: 48%;
}
// Post delimiters.
.post-eof {
hide();
}
// Pagination.
.pagination {
.prev, .next, .page-number {
margin-bottom: initial;
top: initial;
}
margin: $sidebar-offset 0 0;
border-top: initial;
background: white;
box-shadow: $box-shadow;
border-radius: $border-radius;
padding: 10px 0 10px;
}
// Footer alignment.
.main {
padding-bottom: initial;
}
.footer {
bottom: auto;
}
// Sub-menu(s).
.sub-menu {
border-bottom: initial !important;
box-shadow: $box-shadow-inner;
// Adapt submenu(s) with post-blocks.
&+ #content > #posts {
.post-block {
box-shadow: $box-shadow;
margin-top: $sidebar-offset;
+tablet() {
margin-top: $content-tablet-padding;
}
+mobile() {
margin-top: $content-mobile-padding;
}
}
}
}
// =================================================
// Headers.
// =================================================
// No need anymore?
.post-header {
h1, h2 {
margin: initial;
}
}
.posts-expand .post-title-link {
line-height: inherit;
}
.posts-expand .post-title {
font-size: 1.7em;
}
.post-body {
h1 {
font-size: 1.6em;
border-bottom: 1px solid $body-bg-color;
code {
font-size: 1em;
}
}
h2 {
font-size: 1.45em;
border-bottom: 1px solid $body-bg-color;
code {
font-size: 1em;
}
}
h3 {
font-size: 1.3em;
code {
font-size: 1em;
}
if use_seo {
border-bottom: 1px solid $body-bg-color;
} else {
border-bottom: 1px dotted $body-bg-color;
}
}
h4 {
font-size: 1.2em;
code {
font-size: 1em;
}
if use_seo {
border-bottom: 1px dotted $body-bg-color;
}
}
h5 {
font-size: 1.07em;
code {
font-size: 1em;
}
}
h6 {
font-size: 1.03em;
code {
font-size: 1em;
}
}
}
// =================================================
// > 768px & < 991px
// =================================================
+tablet() {
// Posts in blocks.
.content-wrap {
padding: $content-tablet-padding;
}
.posts-expand {
margin: initial;
// Components inside Posts.
.post-button {
margin-top: ($content-tablet-padding * 2);
}
}
.post-block {
// Inside posts blocks content padding (default 40px).
padding: ($content-tablet-padding * 2);
// Rewrite shadows & borders because all blocks have offsets.
box-shadow: $box-shadow;
border-radius: $border-radius;
}
// Only if blocks are siblings need bottom margin (homepage).
#posts > article + article {
.post-block {
margin-top: $content-tablet-padding;
}
}
.comments {
margin-top: $content-tablet-padding;
padding: $content-tablet-padding ($content-tablet-padding * 2);
//padding: initial;
//padding-top: $content-tablet-padding;
}
.pagination {
margin: $content-tablet-padding 0 0;
}
}
// =================================================
// < 767px
// =================================================
+mobile() {
// Posts in blocks.
.content-wrap {
padding: $content-mobile-padding;
}
.posts-expand {
margin: initial;
// Components inside Posts.
.post-button {
margin: $sidebar-offset 0px;
}
img {
padding: initial !important;
}
}
.post-block {
// Inside posts blocks content padding (default 40px).
padding: $sidebar-offset;
min-height: auto;
// Rewrite shadows & borders because all blocks have offsets.
box-shadow: $box-shadow;
border-radius: $border-radius;
}
// Only if blocks are siblings need bottom margin (homepage).
#posts > article + article {
.post-block {
margin-top: $content-mobile-padding;
}
}
.comments {
margin-top: $content-mobile-padding;
padding: 0 $sidebar-offset;
}
.pagination {
margin: $content-mobile-padding 0 0;
}
}

View File

@ -0,0 +1,9 @@
// Tags
// --------------------------------------------------
a { border-bottom-color: $grey-light; }
hr {
margin: 20px 0;
height: 2px;
}

View File

@ -0,0 +1,65 @@
// Header
// --------------------------------------------------
.header { background: $whitesmoke; }
.header-inner {
clearfix();
padding: 20px 0;
display: flex;
align-items: center;
justify-content: center;
+mobile() {
show();
width: auto;
padding: 10px;
}
}
.site-meta {
float: left;
margin-left: -20px;
line-height: normal;
+mobile() {
margin-left: 10px;
}
.brand {
padding: 2px 1px;
background: none;
+mobile() { display: block; }
}
.logo { display: none; }
.site-title {
font-size: 22px;
font-weight: bolder;
+mobile() { line-height: 34px; }
}
}
.logo-line-before,
.logo-line-after {
show();
overflow: hidden;
margin: 0 auto;
width: 75%;
+mobile() { display: none; }
i {
position: relative;
show();
height: 2px;
background: $black-deep;
+mobile() { height: 3px; }
}
}
.use-motion {
.logo-line-before i { left: -100%; }
.logo-line-after i { right: -100%; }
}

View File

@ -0,0 +1 @@
.site-subtitle { display: none; }

View File

@ -0,0 +1,83 @@
// Menu
// --------------------------------------------------
.site-brand-wrapper {
flex-shrink: 0;
}
.site-nav-toggle {
position: static;
float: right;
}
.site-nav {
flex-grow: 1;
+mobile() {
transform: translateY(10px);
}
}
.menu-item-active a {
background: #e1e1e1;
}
.menu {
//float: right;
margin: 0;
+mobile() {
margin: 10px 0;
padding: 0;
}
br { display: none; }
.menu-item {
margin: 0;
+mobile() {
show();
margin-top: 5px;
}
.badge {
display: inline-block;
padding: 1px 4px;
margin-left: 5px;
font-weight: 700;
line-height: 1;
color: $black-light;
text-align: center;
white-space: nowrap;
background-color: #fff;
border-radius: 10px;
text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
+mobile() {
float: right;
margin: 0.35em 0 0 0;
}
}
a, span.exturl {
padding: 0 10px;
border: none;
border-radius: 2px;
transition-property: background;
+mobile() {
text-align: left;
}
&:hover {
@extend .menu-item-active a;
}
disable-touch-hover();
}
}
a::before {
hide();
+mobile() { display: block; }
}
+mobile() { float: none; }
}

View File

@ -0,0 +1,66 @@
// Post Expanded
// --------------------------------------------------
.posts-expand {
padding-top: 0;
.post-title,
.post-meta {
text-align: $site-meta-text-align;
+mobile() { text-align: center; }
}
.post-eof { display: none; }
.post { margin-top: 120px; }
.post:first-child { margin-top: 0; }
.post-meta {
margin-top: 5px;
margin-bottom: 20px;
}
.post-title {
position: relative;
font-size: $font-size-headings-base;
font-weight: 400;
+mobile() { font-size: $font-size-headings-small; }
+desktop-large() { font-size: $font-size-headings-large; }
}
.post-title:hover:before { background: $black-deep; }
.post-body {
+mobile() { font-size: $font-size-base; }
}
.post-body img { margin: 0; }
.post-tags {
text-align: left;
a {
padding: 1px 5px;
background: $whitesmoke;
border-bottom: none;
}
a:hover { background: $grey-light; }
}
.post-nav { margin-top: 40px; }
}
.post-button {
margin-top: 20px;
text-align: left;
a {
padding: 0;
font-size: $font-size-base;
//color: $grey-dim;
background: none;
border: none;
border-bottom: 2px solid $grey-dim;
transition-property: border;
+mobile() { font-size: $font-size-small; }
+desktop-large() { font-size: $font-size-large; }
&:hover { border-bottom-color: $black-deep; }
}
}

View File

@ -0,0 +1,5 @@
// Search
// --------------------------------------------------
.site-search form {
hide();
}

View File

@ -0,0 +1,86 @@
//
// Mist scheme
// =================================================
@import "_base";
@import "outline/outline";
@import "_header";
@import "_logo";
@import "_menu";
@import "_search.styl";
@import "_posts-expanded";
@import "sidebar/sidebar-blogroll";
// Components
// --------------------------------------------------
.btn {
padding: 0 10px;
border-width: 2px;
border-radius: 0;
}
.headband { display: none; }
// Search
// --------------------------------------------------
.site-search {
position: relative;
float: right;
margin-top: 5px;
padding-top: 3px;
+mobile() {
float: none;
padding: 0 10px;
}
}
// Page - Container
// --------------------------------------------------
.container .main-inner {
+mobile() { width: auto; }
}
// Page - Post details
// --------------------------------------------------
.page-post-detail {
.post-title,
.post-meta { text-align: center; }
.post-title:before { display: none; }
.post-meta { margin-bottom: 60px; }
}
// Pagination
// --------------------------------------------------
.pagination {
margin: 120px 0 0;
text-align: left;
+mobile() {
margin: 80px 10px 0;
text-align: center;
}
}
// Footer
// --------------------------------------------------
.footer {
margin-top: 80px;
padding: 10px 0;
background: $whitesmoke;
color: $grey-dim;
}
.footer-inner {
margin: 0 auto;
text-align: left;
+mobile() {
width: auto;
text-align: center;
}
}
// Helpers
// --------------------------------------------------

View File

@ -0,0 +1 @@
.main-inner { margin-top: 80px; }

View File

@ -0,0 +1 @@
.links-of-blogroll-inline .links-of-blogroll-item { display: inline-block; }

View File

@ -0,0 +1,9 @@
.header-inner, .container .main-inner, .footer-inner {
+mobile() { width: auto; }
}
// embed tag
embed {
show();
margin: 0px auto 25px auto;
}

View File

@ -0,0 +1,25 @@
.custom-logo {
.site-meta-headline {
text-align: center;
}
.brand {
background: none;
}
.site-title {
margin: 10px auto 0;
font-size: 24px;
color: $black-deep;
a {
border: none;
}
}
}
.custom-logo-image {
margin: 0 auto;
padding: 5px;
max-width: 150px;
background: white;
}

View File

@ -0,0 +1,78 @@
.site-nav {
+mobile() {
position: absolute;
left: 0;
top: 52px;
margin: 0;
width: 100%;
padding: 0;
background: white;
border-bottom: 1px solid $gray-lighter;
z-index: $zindex-3;
}
}
.menu {
+mobile() { text-align: left; }
}
.menu-item-active a {
border-bottom-color: $menu-link-hover-border !important;
color: $black-deep;
+mobile() {
border-bottom: 1px dotted $gray-lighter !important;
}
}
.menu .menu-item {
+mobile() {
show();
margin: 0 10px;
vertical-align: top;
}
.badge {
display: inline-block;
padding: 1px 4px;
margin-left: 5px;
font-weight: 700;
line-height: 1;
text-align: center;
white-space: nowrap;
background-color: $gainsboro;
+mobile() {
float: right;
margin: 0.35em 0 0 0;
}
}
br {
+mobile() { display: none; }
}
a, span.exturl {
+mobile() {
padding: 5px 10px;
}
&:hover {
@extend .menu-item-active a;
}
// To prevent hover on external links with touch devices after click.
@media (hover:none) {
&:hover {
border-bottom-color: transparent !important;
}
}
}
.fa {
+tablet() {
width: 100%;
}
+desktop() {
width: 100%;
}
}
}

View File

@ -0,0 +1,5 @@
// Search
// --------------------------------------------------
.site-search form {
hide();
}

View File

@ -0,0 +1,5 @@
@import "_layout.styl";
@import "_logo.styl";
@import "_menu.styl";
@import "_search.styl";
@import "sidebar/sidebar-blogroll";

View File

@ -0,0 +1 @@
.links-of-blogroll-inline .links-of-blogroll-item { display: inline-block; }

View File

@ -0,0 +1,38 @@
.site-brand-wrapper {
position: relative;
}
.site-meta {
padding: 20px 0;
color: white;
background: $black-deep;
+tablet-mobile() {
box-shadow: 0 0 16px rgba(0, 0, 0, 0.5);
}
}
.brand {
padding: 0;
background: none;
&:hover {
color: white;
}
}
.site-subtitle {
margin: 10px 10px 0;
font-weight: initial;
}
.custom-logo-image {
margin-top: 20px;
+tablet-mobile() {
hide();
}
}
.site-search form {
hide();
}

View File

@ -0,0 +1,105 @@
.header {
position: relative;
margin: 0 auto;
width: $content-desktop;
+desktop-large() {
width: $content-desktop-large;
}
+desktop-largest() {
width: $content-desktop-largest;
}
+tablet-mobile() {
width: auto;
}
}
.header-inner {
position: absolute;
top: 0;
overflow: hidden;
padding: 0;
width: $sidebar-desktop;
background: white;
box-shadow: $box-shadow-inner;
border-radius: $border-radius-inner;
+desktop-large() {
.container & { width: $sidebar-desktop; }
}
+tablet-mobile() {
position: relative;
width: auto;
border-radius: initial;
}
}
.main {
clearfix();
}
.container .main-inner {
+tablet-mobile() {
width: auto;
}
}
.content-wrap {
float: right;
box-sizing: border-box;
padding: $content-desktop-padding;
width: $content-wrap;
background: white;
min-height: 700px;
box-shadow: $box-shadow-inner;
border-radius: $border-radius-inner;
+tablet() {
width: 100%;
padding: 20px;
border-radius: initial;
}
+mobile() {
width: 100%;
padding: 20px;
min-height: auto;
border-radius: initial;
}
}
.sidebar {
position: static;
float: left;
margin-left: -100%;
width: $sidebar-desktop;
background: $body-bg-color;
box-shadow: none;
+tablet-mobile() {
hide();
}
}
.sidebar-toggle { display: none; }
.footer-inner {
padding-left: 260px;
+tablet-mobile() {
width: auto;
padding-left: 0 !important;
padding-right: 0 !important;
}
}
.sidebar-position-right {
.header-inner { right: 0; }
.content-wrap { float: left; }
.sidebar { float: right; }
.footer-inner {
padding-left: 0;
padding-right: 260px;
}
}

View File

@ -0,0 +1,87 @@
.site-nav {
border-top: none;
+tablet() {
display: none !important;
}
}
.site-nav-on {
+tablet() {
display: block !important;
}
}
.menu-item-active a {
background: #f9f9f9;
border-bottom-color: white;
badges = hexo-config('menu_settings.badges');
if not badges {
&:after {
content: " ";
position: absolute;
top: 50%;
margin-top: -3px;
right: 15px;
width: 6px;
height: 6px;
background-color: $grey;
circle();
}
}
}
.menu .menu-item {
show();
margin: 0;
a, span.exturl {
position: relative;
box-sizing: border-box;
padding: 5px 20px;
text-align: left;
line-height: inherit;
transition-property: background-color;
the-transition();
&:hover {
@extend .menu-item-active a;
}
disable-touch-hover();
}
.badge {
display: inline-block;
padding: 2px 5px;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: middle;
background-color: $grey-light;
border-radius: 10px;
float: right;
margin: 0.35em 0 0 0;
text-shadow: 1px 1px 0px rgba(0,0,0,0.1);
}
br { display: none; }
}
.btn-bar {
background-color: white;
}
.site-nav-toggle {
left: 20px;
top: 50%;
transform: translateY(-50%);
+tablet() {
show();
}
}

View File

@ -0,0 +1,121 @@
.use-motion .sidebar .motion-element { opacity: 1; }
.sidebar {
right: auto;
bottom: auto;
// Do NOT delete this line
// or Affix (position: fixed) will not work in Google Chrome.
-webkit-transform: none;
a, span.exturl {
color: $black-light;
&:hover {
color: $black-deep;
border-bottom-color: $black-deep;
}
}
}
.sidebar-inner {
//padding: 20px 10px 0;
box-sizing: border-box;
width: $sidebar-desktop;
color: $text-color;
background: white;
box-shadow: $box-shadow;
border-radius: $border-radius;
if (hexo-config('motion.enable') and hexo-config('motion.transition.sidebar')) { opacity: 0; }
&.affix {
position: fixed;
top: $sidebar-offset;
}
&.affix-bottom {
position: absolute;
}
}
.site-overview {
//margin: 0 2px;
text-align: left;
}
.site-author {
clearfix();
}
.site-state-item {
padding: 0 10px;
}
.feed-link, .chat {
border-top: 1px dotted $grey-light;
border-bottom: 1px dotted $grey-light;
text-align: center;
a {
show();
color: $orange;
border: none !important;
&:hover {
background: none;
color: darken($orange, 20%);
i { color: darken($orange, 20%); }
}
}
}
.links-of-author {
//clearfix();
display: flex;
flex-wrap: wrap;
justify-content: center;
span.exturl {
font-size: 13px;
}
}
.links-of-author-item {
sidebar-inline-links-item();
a:before, span.exturl:before { display: none; }
a, span.exturl {
border-bottom: none;
text-decoration: underline;
}
a, span.exturl {
show();
text-decoration: none;
&:hover {
border-radius: 4px;
background: $gainsboro;
}
}
.fa {
margin-right: 2px;
font-size: 16px;
}
.fa-globe { font-size: 15px; }
}
.links-of-blogroll {
text-align: center;
padding: 3px 0 0;
}
.links-of-blogroll-item { padding: 0; }
.links-of-blogroll-inline {
clearfix();
.links-of-blogroll-item {
sidebar-inline-links-item();
display: inline-block;
if !hexo-config('social_icons.icons_only') { width: unset; }
}
}

View File

@ -0,0 +1,38 @@
.sub-menu {
margin: 0;
padding: 6px 0;
background: #fff !important;
border-bottom: 1px solid $table-border-color;
}
.sub-menu .menu-item {
display: inline-block !important;
& a, span.exturl {
padding: initial !important;
margin: 5px 10px;
}
& a:hover, span.exturl:hover {
background: initial !important;
color: $sidebar-highlight;
}
}
.sub-menu .menu-item-active a {
background: #fff !important;
color: $sidebar-highlight;
border-bottom-color: $sidebar-highlight;
&:hover {
background: #fff !important;
border-bottom-color: $sidebar-highlight;
}
badges = hexo-config('menu_settings.badges');
if not badges {
&:after {
content: initial;
}
}
}

View File

@ -0,0 +1,5 @@
@import "_layout";
@import "_brand";
@import "_menu";
@import "_sub-menu";
@import "_sidebar";