From 9aa4a5efaa9ea6723a2831793e1559995e43bb7d Mon Sep 17 00:00:00 2001
From: nodejh <jianghangscu@gmail.com>
Date: Fri, 24 Mar 2017 21:34:34 +0800
Subject: [PATCH] update: responsive toc

---
 static/css/style.css | 40 ++++++++++++++++++++++++++++++++++++++--
 1 file changed, 38 insertions(+), 2 deletions(-)

diff --git a/static/css/style.css b/static/css/style.css
index bf4ab06..a9f0005 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -199,6 +199,30 @@ nav.main-nav a.cta {
     color: #fff;
     margin-left: 12px;
 }
+@media (max-width: 700px) {
+  nav.main-nav {
+      padding: 20px 10px 0 0;
+      background: #fff;
+      background: rgba(255, 255, 255, .90);
+      margin: 0 auto;
+      text-align: right;
+      z-index: 100;
+  }
+  nav.main-nav a {
+      top: 8px;
+      right: 6px;
+      padding: 8px 8px;
+      color: #5badf0;
+      font-size: 13px;
+      line-height: 1.35;
+      border-radius: 3px;
+  }
+}
+@media (max-width: 324px) {
+    nav.main-nav a.cta {
+      display: none;
+    }
+}
 
 #wrapper {
     max-width: 600px;
@@ -262,6 +286,10 @@ li {
 #post-body, p {
     line-height: 1.7;
 }
+#post-body p > a {
+  word-break: break-word;
+  white-space: pre-wrap;
+}
 
 b, strong {
     font-weight: 500;
@@ -859,6 +887,7 @@ a.symbol:hover {
     color: #BCD4DA;
 }
 
+
 /**
  * Table of content
  */
@@ -882,12 +911,19 @@ a.symbol:hover {
 }
 #TableOfContents {
   margin: 1em 0 0 0;
+  overflow-x: scroll;
+  word-wrap: normal;
+  word-break: break-all;
+  white-space: nowrap;
 }
 #TableOfContents ul {
-  list-style-type:none; margin: 0; padding: 0 .5em;
+  list-style-type:none;
+  margin: 0;
+  padding: 0 .5em;
 }
 #TableOfContents ul li {
-  list-style-type:none; line-height: 1.7em;
+  list-style-type: none;
+  line-height: 1.7em;
 }
 #TableOfContents > ul {
   padding: 0;