hexo
This commit is contained in:
@ -0,0 +1,23 @@
|
||||
.links-of-author {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.links-of-author a {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
border-bottom-color: $black-light;
|
||||
font-size: 13px;
|
||||
|
||||
&:before {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 3px;
|
||||
content: " ";
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 50%;
|
||||
background: rgb(random-color(0, 255) - 50%, random-color(0, 255) - 50%, random-color(0, 255) - 50%);
|
||||
}
|
||||
}
|
@ -0,0 +1,22 @@
|
||||
.site-author-image {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
padding: $site-author-image-padding;
|
||||
max-width: $site-author-image-width;
|
||||
height: $site-author-image-height;
|
||||
border: $site-author-image-border-width solid $site-author-image-border-color;
|
||||
}
|
||||
|
||||
.site-author-name {
|
||||
margin: $site-author-name-margin;
|
||||
text-align: $site-author-name-align;
|
||||
color: $site-author-name-color;
|
||||
font-weight: $site-author-name-weight;
|
||||
}
|
||||
|
||||
.site-description {
|
||||
margin-top: $site-description-margin-top;
|
||||
text-align: $site-description-align;
|
||||
font-size: $site-description-font-size;
|
||||
color: $site-description-color;
|
||||
}
|
@ -0,0 +1,25 @@
|
||||
.links-of-blogroll { font-size: 13px; }
|
||||
|
||||
.links-of-blogroll-title {
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
.links-of-blogroll-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.links-of-blogroll-item {
|
||||
padding: 2px 10px;
|
||||
|
||||
a {
|
||||
max-width: 280px;
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
@ -0,0 +1,21 @@
|
||||
.sidebar-active #sidebar-dimmer {
|
||||
opacity: .7;
|
||||
-webkit-transform: translateX(-150%);
|
||||
transform: translateX(-150%);
|
||||
transition: opacity .2s;
|
||||
}
|
||||
|
||||
#sidebar-dimmer {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 100%;
|
||||
width: 200%;
|
||||
height: 100%;
|
||||
background: #000;
|
||||
opacity: 0;
|
||||
transition: opacity .2s,transform 0s .2s;
|
||||
+mobile() {
|
||||
display: block;
|
||||
}
|
||||
}
|
@ -0,0 +1,23 @@
|
||||
.feed-link {
|
||||
margin-top: 20px;
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 0 15px;
|
||||
color: rgb(252, 100, 35);
|
||||
border: 1px solid rgb(252, 100, 35);
|
||||
border-radius: 4px;
|
||||
|
||||
i {
|
||||
color: rgb(252, 100, 35);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color:white;
|
||||
background: rgb(252, 100, 35);
|
||||
|
||||
i { color: white; }
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,29 @@
|
||||
// Sidebar Navigation
|
||||
|
||||
.sidebar-nav {
|
||||
margin: 0 0 20px;
|
||||
padding-left: 0;
|
||||
}
|
||||
.sidebar-nav li {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid transparent;
|
||||
font-size: 14px;
|
||||
color: $sidebar-nav-color;
|
||||
|
||||
&:hover { color: $sidebar-nav-hover-color; }
|
||||
}
|
||||
|
||||
.page-post-detail .sidebar-nav-toc { padding: 0 5px; }
|
||||
|
||||
.page-post-detail .sidebar-nav-overview { margin-left: 10px; }
|
||||
|
||||
.sidebar-nav .sidebar-nav-active {
|
||||
color: $sidebar-highlight;
|
||||
border-bottom-color: $sidebar-highlight;
|
||||
|
||||
&:hover { color: $sidebar-highlight; }
|
||||
}
|
||||
|
||||
.sidebar-panel { display: none; }
|
||||
.sidebar-panel-active { display: block; }
|
@ -0,0 +1,60 @@
|
||||
|
||||
.post-toc-empty {
|
||||
font-size: 14px;
|
||||
color: $grey-dim;
|
||||
}
|
||||
|
||||
.post-toc-wrap { overflow: hidden; }
|
||||
|
||||
.post-toc { overflow: auto; }
|
||||
|
||||
.post-toc ol {
|
||||
margin: 0;
|
||||
padding: 0 2px 5px 10px;
|
||||
text-align: left;
|
||||
list-style: none;
|
||||
font-size: 14px;
|
||||
|
||||
& > ol { padding-left: 0; }
|
||||
|
||||
a {
|
||||
the-transition();
|
||||
transition-property: all;
|
||||
color: $toc-link-color;
|
||||
border-bottom-color: $toc-link-border-color;
|
||||
|
||||
&:hover {
|
||||
color: $toc-link-hover-color;
|
||||
border-bottom-color: $toc-link-hover-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-toc .nav-item {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-align: justify;
|
||||
white-space: nowrap if !hexo-config('toc.wrap');
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.post-toc .nav .nav-child { display: none; }
|
||||
|
||||
.post-toc .nav .active > .nav-child { display: block; }
|
||||
|
||||
.post-toc .nav .active-current > .nav-child {
|
||||
display: block;
|
||||
& > .nav-item { display: block; }
|
||||
}
|
||||
|
||||
.post-toc .nav .active > a {
|
||||
color: $toc-link-active-color;
|
||||
border-bottom-color: $toc-link-active-border-color;
|
||||
}
|
||||
|
||||
.post-toc .nav .active-current > a {
|
||||
color: $toc-link-active-current-color;
|
||||
&:hover {
|
||||
color: $toc-link-active-current-border-color;
|
||||
}
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
.sidebar-toggle {
|
||||
position: fixed;
|
||||
right: $b2t-position-right;
|
||||
bottom: 45px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
padding: 5px;
|
||||
background: $black-deep;
|
||||
line-height: 0;
|
||||
z-index: $zindex-5;
|
||||
cursor: pointer;
|
||||
-webkit-transform: translateZ(0);
|
||||
|
||||
+tablet() {
|
||||
fixbutton() if hexo-config('sidebar.onmobile');
|
||||
hide() if not hexo-config('sidebar.onmobile');
|
||||
}
|
||||
+mobile() {
|
||||
fixbutton() if hexo-config('sidebar.onmobile');
|
||||
hide() if not hexo-config('sidebar.onmobile');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.sidebar-toggle-line {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
height: 2px;
|
||||
width: 100%;
|
||||
background: white;
|
||||
margin-top: 3px;
|
||||
|
||||
&:first-child { margin-top: 0; }
|
||||
}
|
@ -0,0 +1,52 @@
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
|
||||
width: 0;
|
||||
z-index: $zindex-4;
|
||||
box-shadow: inset 0 2px 6px black;
|
||||
background: $black-deep;
|
||||
-webkit-transform: translateZ(0); // http://stackoverflow.com/questions/17079857/position-fixed-broken-in-chrome-with-flash-behind
|
||||
|
||||
a {
|
||||
color: $grey-dark;
|
||||
border-bottom-color: $black-light;
|
||||
&:hover { color: $gainsboro; }
|
||||
}
|
||||
|
||||
+tablet() {
|
||||
hide() if not hexo-config('sidebar.onmobile');
|
||||
}
|
||||
+mobile() {
|
||||
hide() if not hexo-config('sidebar.onmobile');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.sidebar-inner {
|
||||
position: relative;
|
||||
padding: 20px 10px;
|
||||
color: $grey-dark;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-overview-wrap {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.site-overview {
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@import "sidebar-toggle";
|
||||
@import "sidebar-author";
|
||||
@import "site-state";
|
||||
@import "sidebar-feed-link";
|
||||
@import "sidebar-author-links";
|
||||
@import "sidebar-blogroll";
|
||||
@import "sidebar-nav";
|
||||
@import "sidebar-toc";
|
||||
@import "sidebar-dimmer" if hexo-config('sidebar.onmobile');
|
@ -0,0 +1,28 @@
|
||||
.site-state {
|
||||
overflow: hidden;
|
||||
line-height: 1.4;
|
||||
white-space: nowrap;
|
||||
text-align: $site-state-align;
|
||||
}
|
||||
|
||||
.site-state-item {
|
||||
display: inline-block;
|
||||
padding: 0 15px;
|
||||
border-left: 1px solid $site-state-item-border-color;
|
||||
|
||||
&:first-child { border-left: none; }
|
||||
|
||||
a { border-bottom: none; }
|
||||
}
|
||||
.site-state-item-count {
|
||||
display: block;
|
||||
text-align: center;
|
||||
color: $site-state-item-count-color;
|
||||
font-weight: $font-weight-bold;
|
||||
font-size: $site-state-item-count-font-size;
|
||||
}
|
||||
|
||||
.site-state-item-name {
|
||||
font-size: $site-state-item-name-font-size;
|
||||
color: $site-state-item-name-color;
|
||||
}
|
Reference in New Issue
Block a user