diff --git a/CHANGELOG.md b/CHANGELOG.md
index cd787c63..57f92128 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 1.4.3
+### Bug fixes
+- Tweak style.
+
## 1.4.2
### Bug fixes
diff --git a/src/render.js b/src/render.js
index 13d1fd1c..f0168e8b 100644
--- a/src/render.js
+++ b/src/render.js
@@ -30,7 +30,7 @@ renderer.heading = function (text, level) {
toc.push({ level, slug: `${route}#${encodeURIComponent(slug)}`, title: text })
- return `${text}`
+ return `${text}`
}
// highlight code
renderer.code = function (code, lang = '') {
diff --git a/src/themes/basic/_coverpage.css b/src/themes/basic/_coverpage.css
index e8df5fe1..6503cb91 100644
--- a/src/themes/basic/_coverpage.css
+++ b/src/themes/basic/_coverpage.css
@@ -20,7 +20,7 @@ section.cover {
.cover-main {
flex: 1;
text-align: center;
- margin: 0 16px;
+ margin: -20px 16px 0;
z-index: 1;
}
@@ -46,6 +46,10 @@ section.cover {
font-weight: 300;
color: inherit;
+ a {
+ display: block;
+ }
+
small {
position: absolute;
bottom: -.4375rem;
diff --git a/src/themes/basic/_layout.css b/src/themes/basic/_layout.css
index 4fd34c7b..010b7826 100644
--- a/src/themes/basic/_layout.css
+++ b/src/themes/basic/_layout.css
@@ -31,6 +31,7 @@ body {
letter-spacing: 0;
margin: 0;
overflow-x: hidden;
+ color: $color-text;
}
img {
@@ -159,14 +160,18 @@ nav {
/* main */
main {
- size: 100% 100%;
+ size: 100vw 100%;
position: relative;
}
.anchor {
text-decoration: none;
transition: all .3s;
- display: block;
+ display: inline-block;
+
+ span {
+ color: $color-text;
+ }
&:hover {
text-decoration: underline;
@@ -313,6 +318,11 @@ body.close {
top: 30px;
}
+ main {
+ height: auto;
+ overflow-x: hidden;
+ }
+
.sidebar {
left: -$sidebar-width;
transition: transform 250ms ease-out;
@@ -320,7 +330,8 @@ body.close {
.content {
left: 0;
- min-width: 100vw;
+ max-width: 100vw;
+ position: static;
transition: transform 250ms ease;
}
@@ -330,6 +341,7 @@ body.close {
.sidebar-toggle {
width: auto;
+ background-color: transparent;
}
body.close {
@@ -339,6 +351,8 @@ body.close {
.sidebar-toggle {
width: calc($sidebar-width - 16px);
+ background-color: rgba($color-bg, .8);
+ transition: 1s background-color;
}
.content {
@@ -346,7 +360,7 @@ body.close {
}
nav, .github-corner {
- transform: translateX($sidebar-width);
+ display: none;
}
}
diff --git a/src/themes/buble.css b/src/themes/buble.css
index d4b99c59..5aec3ce0 100644
--- a/src/themes/buble.css
+++ b/src/themes/buble.css
@@ -2,14 +2,12 @@
$color-primary: #0074D9;
$color-bg: #fff;
+$color-text: #34495e;
$sidebar-width: 16em;
@import "basic/layout";
@import "basic/coverpage";
-body {
- color: #34495e;
-}
/* sidebar */
.sidebar {
color: #364149;
diff --git a/src/themes/pure.css b/src/themes/pure.css
index a9f73bf7..070c0702 100644
--- a/src/themes/pure.css
+++ b/src/themes/pure.css
@@ -1,4 +1,5 @@
$color-primary: #000;
$color-bg: #fff;
+$color-text: #000;
$sidebar-width: 300px;
@import "basic/layout";
diff --git a/src/themes/vue.css b/src/themes/vue.css
index 5eaaaee2..a21ac514 100644
--- a/src/themes/vue.css
+++ b/src/themes/vue.css
@@ -2,6 +2,7 @@
$color-primary: #42b983;
$color-bg: #fff;
+$color-text: #34495e;
$sidebar-width: 300px;
@import "basic/layout";
@@ -9,7 +10,6 @@ $sidebar-width: 300px;
body {
background-color: $color-bg;
- color: #34495e;
}
/* sidebar */
diff --git a/src/tpl.js b/src/tpl.js
index d9cd691c..6a35f681 100644
--- a/src/tpl.js
+++ b/src/tpl.js
@@ -1,4 +1,4 @@
-
+import { isMobile } from './util'
/**
* Render github corner
* @param {Object} data
@@ -23,13 +23,13 @@ export function corner (data) {
* Render main content
*/
export function main (tpl) {
- return `
- ${tpl}
-
-
+ const aside = `${tpl}`
+
+ return (isMobile() ? `${aside}` : `${aside}`) +
+ `
- `
+ `
}
/**