diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html
index 77d3273..3cf26aa 100644
--- a/layouts/partials/sidebar.html
+++ b/layouts/partials/sidebar.html
@@ -1,7 +1,9 @@
-
-
- {{ .Site.Title }}
-
+
{{ range .Site.Menus.main }}
diff --git a/static/styles.css b/static/styles.css
index 4ed4e27..9612430 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -8,11 +8,6 @@ body {
line-height: 1.8rem;
}
-a {
- color: #ccf;
- text-decoration: none;
-}
-
nav {
padding: 1em;
width: 15em;
@@ -20,43 +15,18 @@ nav {
text-align: center;
}
-nav a {
- color: #fff;
-}
-
nav ul {
text-align: left;
list-style: none;
padding: 0;
}
-nav ul li, article a {
- text-decoration: underline;
-}
-
main {
padding: 1em 1em 0em 1em;
max-width: 50em;
font-size: 1.2rem;
}
-h1, h2, h3, h4, h5, h6 {
- margin: 0 0 1em 0;
-}
-
-.article {
- padding-bottom: 1em;
-}
-
-.article a {
- display: block;
- margin: 0 0 0.75em 0;
-}
-
-.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
- margin: 0 0 0.25em 0;
-}
-
[rel="me"] img {
width: 15em;
height: 15em;
@@ -64,6 +34,55 @@ h1, h2, h3, h4, h5, h6 {
border-radius: 15em;
}
+@media only screen
+ and (min-device-width: 375px)
+ and (max-device-width: 812px)
+ and (-webkit-min-device-pixel-ratio: 3)
+ and (orientation: portrait) {
+ body {
+ flex-direction: column;
+ }
+
+ nav {
+ width: inherit;
+ text-align: left;
+ }
+
+ [rel="me"] img {
+ display: none;
+ }
+}
+
+a {
+ color: #ccf;
+ text-decoration: none;
+}
+
+nav a {
+ color: #fff;
+}
+
+nav ul li, article a {
+ text-decoration: underline;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ margin: 0 0 1em 0;
+}
+
+.article {
+ padding-bottom: 1rem;
+}
+
+.article a {
+ display: block;
+ margin: 0 0 0.75rem 0;
+}
+
+.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
+ margin: 0 0 0.25rem 0;
+}
+
.highlight pre {
background-color: #0a0316;
tab-size: 4;