From e90189db8d60bb03341f75e4f4d3d44b282b7193 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Thu, 19 Jan 2017 15:09:03 +0800
Subject: [PATCH] site: improve style of component demo toc

---
 site/theme/static/common.less     |  5 ++---
 site/theme/static/demo.less       | 10 +---------
 site/theme/static/responsive.less |  7 ++-----
 site/theme/static/toc.less        | 10 +++-------
 4 files changed, 8 insertions(+), 24 deletions(-)

diff --git a/site/theme/static/common.less b/site/theme/static/common.less
index dc18c268c0..b408270125 100644
--- a/site/theme/static/common.less
+++ b/site/theme/static/common.less
@@ -25,8 +25,7 @@ a {
 
 .main-wrapper {
   background: #fff;
-  width: 92%;
-  margin: 0 auto;
+  margin: 0 48px;
   border-radius: @border-radius-base;
   padding: 24px 0 0;
   margin-bottom: 24px;
@@ -34,7 +33,7 @@ a {
 }
 
 div.main-container {
-  padding: 0 6% 120px 4%;
+  padding: 0 130px 120px 40px;
   margin-left: -1px;
   background: #fff;
   min-height: 500px;
diff --git a/site/theme/static/demo.less b/site/theme/static/demo.less
index 31aa1ac99c..297683afa7 100644
--- a/site/theme/static/demo.less
+++ b/site/theme/static/demo.less
@@ -32,17 +32,9 @@
   transition: all 0.2s ease;
 }
 
-.code-box:hover {
-  box-shadow: 0 2px 7px rgba(0, 0, 0, .2);
-  border-color: transparent;
-  position: relative;
-  z-index: 10;
-  background: #fff;
-}
-
 .code-box:target {
   border: 1px solid fade(@primary-color, 70%);
-  box-shadow: 0 0 4px fade(@primary-color, 50%);
+  z-index: 10;
 }
 
 .code-box {
diff --git a/site/theme/static/responsive.less b/site/theme/static/responsive.less
index 4c32c1acee..af7562dc91 100644
--- a/site/theme/static/responsive.less
+++ b/site/theme/static/responsive.less
@@ -166,6 +166,8 @@
   }
 
   .main-container {
+    padding-left: 30px;
+    padding-right: 30px;
     margin-left: 0;
     > .markdown > * {
       width: 100%!important;
@@ -177,11 +179,6 @@
     border-radius: 0;
   }
 
-  .main-container {
-    padding-left: 30px;
-    padding-right: 30px;
-  }
-
   footer {
     text-align: center;
   }
diff --git a/site/theme/static/toc.less b/site/theme/static/toc.less
index 4dd4711338..3e5973da15 100644
--- a/site/theme/static/toc.less
+++ b/site/theme/static/toc.less
@@ -1,8 +1,7 @@
 .toc {
   font-size: 14px;
   margin: 24px 0;
-  background: #fbfbfb;
-  border-left: 2px solid #eee;
+  border-left: 1px solid #e9e9e9;
   list-style: none;
 }
 
@@ -23,8 +22,6 @@
 
 .toc a {
   padding-left: 16px;
-  border-left: 2px solid #eee;
-  margin-left: -2px;
   display: block;
   transition: all 0.3s ease;
   white-space: nowrap;
@@ -49,15 +46,14 @@
 
 .demos-anchor {
   color: #aaa;
-  background: #fff;
   font-size: 12px;
-  margin-top: 0;
+  margin-top: -4px;
   a {
     padding-left: 8px;
     display: block;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    max-width: 90px;
+    max-width: 110px;
   }
 }