{% capture padding %}
{% unless page.layout == 'home' %}px-1{% endunless %}
{% endcapture %}
-
+
{% capture _content %}
- {% if layout.refactor or page.layout == 'page' %}
- {% include refactor-content.html content=content lang=lang %}
- {% else %}
- {{ content }}
- {% endif %}
- {% endcapture %}
+ {% if layout.refactor or page.layout == 'page' %}
+ {% include refactor-content.html content=content lang=lang %}
+ {% else %}
+ {{ content }}
+ {% endif %}
+ {% endcapture %}
{% if page.layout == 'page' or page.collection == 'tabs' %}
{% assign tab_key = page.title | downcase %}
@@ -55,14 +55,16 @@ layout: default
-
+
+
+
+ {% if has_tail %}
{% for _include in layout.tail_includes %}
{% assign _include_path = _include | append: '.html' %}
{% include {{ _include_path }} lang=lang %}
{% endfor %}
-
+ {% endif %}
+
+ {% include_cached footer.html lang=lang %}
-{% endif %}
+
diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss
index 2a67dd1..046071a 100644
--- a/_sass/addon/commons.scss
+++ b/_sass/addon/commons.scss
@@ -175,17 +175,11 @@ kbd {
footer {
font-size: 0.8rem;
background-color: var(--main-bg);
+ height: $footer-height;
+ border-top: 1px solid var(--main-border-color);
@extend %text-color;
- div.d-flex {
- height: $footer-height;
- line-height: 1.2rem;
- padding-bottom: 1rem;
- border-top: 1px solid var(--main-border-color);
- flex-wrap: wrap;
- }
-
a {
@extend %text-highlight;
@@ -195,7 +189,7 @@ footer {
}
p {
- width: 100%;
+ line-height: 1.75;
text-align: center;
margin-bottom: 0;
}
@@ -1081,6 +1075,7 @@ $btn-mb: 0.5rem;
#core-wrapper {
line-height: 1.75;
+ min-height: calc(100vh - $topbar-height - $footer-height);
.categories,
#tags,
@@ -1108,7 +1103,6 @@ $btn-mb: 0.5rem;
#main-wrapper {
position: relative;
- min-height: calc(100vh - $footer-height-mobile);
@include pl-pr(0);
}
@@ -1122,19 +1116,17 @@ $btn-mb: 0.5rem;
/* --- button back-to-top --- */
#back-to-top {
- $size: 3rem;
-
display: none;
z-index: 1;
cursor: pointer;
position: fixed;
right: 1rem;
- bottom: 2rem;
+ bottom: calc($footer-height-large - $back2top-size / 2);
background: var(--button-bg);
color: var(--btn-backtotop-color);
padding: 0;
- width: $size;
- height: $size;
+ width: $back2top-size;
+ height: $back2top-size;
border-radius: 50%;
border: 1px solid var(--btn-backtotop-border-color);
transition: transform 0.2s ease-out;
@@ -1146,7 +1138,7 @@ $btn-mb: 0.5rem;
}
i {
- line-height: $size;
+ line-height: $back2top-size;
position: relative;
bottom: 2px;
}
@@ -1212,14 +1204,12 @@ $btn-mb: 0.5rem;
*/
@media all and (max-width: 576px) {
- #main-wrapper {
- min-height: calc(100vh - #{$footer-height-mobile});
- }
-
#core-wrapper {
+ min-height: calc(100vh - $topbar-height - $footer-height-large);
+
.post-content {
> blockquote[class^='prompt-'] {
- @include ml-mr(-1.25rem);
+ @include ml-mr(-1rem);
border-radius: 0;
max-width: none;
@@ -1260,21 +1250,11 @@ $btn-mb: 0.5rem;
}
}
- html,
- body {
- overflow-x: hidden;
- }
-
footer {
@include slide;
- height: $footer-height-mobile;
-
- div.d-flex {
- padding: 1.5rem 0;
- line-height: 1.65;
- flex-wrap: wrap;
- }
+ height: $footer-height-large;
+ padding: 1.5rem 0;
}
[#{$sidebar-display}] {
@@ -1282,8 +1262,7 @@ $btn-mb: 0.5rem;
transform: translateX(0);
}
- #main-wrapper,
- footer {
+ #main-wrapper {
transform: translateX(#{$sidebar-width});
}
@@ -1304,8 +1283,7 @@ $btn-mb: 0.5rem;
}
#topbar,
- #main,
- footer > .container {
+ #main {
max-width: 100%;
}
@@ -1352,13 +1330,6 @@ $btn-mb: 0.5rem;
}
} /* max-width: 849px */
-/* Phone & Pad */
-@media all and (min-width: 577px) and (max-width: 1199px) {
- footer .d-flex > div {
- width: 312px;
- }
-}
-
/* Sidebar is visible */
@media all and (min-width: 850px) {
/* Solved jumping scrollbar */
@@ -1366,26 +1337,8 @@ $btn-mb: 0.5rem;
overflow-y: scroll;
}
- #main-wrapper,
- footer {
- margin-left: $sidebar-width;
- }
-
#main-wrapper {
- min-height: calc(100vh - $footer-height);
- }
-
- footer {
- p {
- width: auto;
- &:last-child {
- &::before {
- content: '-';
- margin: 0 0.75rem;
- opacity: 0.8;
- }
- }
- }
+ margin-left: $sidebar-width;
}
#sidebar {
@@ -1419,8 +1372,8 @@ $btn-mb: 0.5rem;
/* button 'back-to-Top' position */
#back-to-top {
- bottom: 5.5rem;
right: 5%;
+ bottom: calc($footer-height - $back2top-size / 2);
}
#topbar-title {
@@ -1465,10 +1418,6 @@ $btn-mb: 0.5rem;
/* --- desktop mode, both sidebar and panel are visible --- */
@media all and (min-width: 1200px) {
- #back-to-top {
- bottom: 6.5rem;
- }
-
#search-wrapper {
margin-right: 4rem;
}
@@ -1497,12 +1446,6 @@ $btn-mb: 0.5rem;
.post-content {
font-size: 1.03rem;
}
-
- footer {
- div.d-felx {
- width: 85%;
- }
- }
}
@media all and (min-width: 1400px) {
@@ -1514,8 +1457,7 @@ $btn-mb: 0.5rem;
@media all and (min-width: 1650px) {
$icon-gap: 1rem;
- #main-wrapper,
- footer {
+ #main-wrapper {
margin-left: $sidebar-width-large;
}
@@ -1529,8 +1471,7 @@ $btn-mb: 0.5rem;
);
}
- #main,
- footer > .container {
+ #main {
max-width: $main-content-max-width;
padding-left: 1.75rem !important;
padding-right: 1.75rem !important;
diff --git a/_sass/addon/syntax.scss b/_sass/addon/syntax.scss
index 5a58e3f..cc03f16 100644
--- a/_sass/addon/syntax.scss
+++ b/_sass/addon/syntax.scss
@@ -150,7 +150,7 @@ div[class^='language-'] {
box-shadow: var(--language-border-color) 0 0 0 1px;
.post-content > & {
- @include ml-mr(-1.25rem);
+ @include ml-mr(-1rem);
border-radius: 0;
}
diff --git a/_sass/addon/variables.scss b/_sass/addon/variables.scss
index 3d32428..5a99986 100644
--- a/_sass/addon/variables.scss
+++ b/_sass/addon/variables.scss
@@ -12,20 +12,21 @@ $sidebar-width-large: 300px !default; /* screen width: >= 1650px */
$topbar-height: 3rem !default;
$search-max-width: 210px !default;
$footer-height: 5rem !default;
-$footer-height-mobile: 6rem !default; /* screen width: < 850px */
+$footer-height-large: 6rem !default; /* screen width: < 850px */
$main-content-max-width: 1250px !default;
$bottom-min-height: 35rem !default;
-$base-radius: 0.5rem;
+$base-radius: 0.5rem !default;
+$back2top-size: 2.75rem !default;
/* syntax highlight */
$code-font-size: 0.85rem !default;
-$code-header-height: 2.25rem;
-$code-dot-size: 0.75rem;
-$code-dot-gap: 0.5rem;
-$code-icon-width: 1.75rem;
+$code-header-height: 2.25rem !default;
+$code-dot-size: 0.75rem !default;
+$code-dot-gap: 0.5rem !default;
+$code-icon-width: 1.75rem !default;
/* fonts */
-$font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif;
-$font-family-heading: Lato, 'Microsoft Yahei', sans-serif;
+$font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif !default;
+$font-family-heading: Lato, 'Microsoft Yahei', sans-serif !default;
diff --git a/_sass/layout/home.scss b/_sass/layout/home.scss
index bca2ca4..3e8b7fa 100644
--- a/_sass/layout/home.scss
+++ b/_sass/layout/home.scss
@@ -199,10 +199,3 @@
}
} /* .pagination */
}
-
-/* Panel is visible */
-@media all and (min-width: 1200px) {
- #post-list {
- padding-right: 0.5rem;
- }
-}