fixed responsive bug

bLuka · Jun 13, 2018 · beca18c · beca18c
1 parent f7876ac
commit beca18c
Show file tree

Hide file tree

Showing 8 changed files with 5,058 additions and 4 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/images/vie-native.png b/src/images/vie-native.png
diff --git a/themes/vueNative/layout/index.ejs b/themes/vueNative/layout/index.ejs
@@ -27,7 +27,7 @@
       </p>
     </div>
   </div>
-  <div style="display: flex;justify-content: space-between;">
+  <div style="display: flex;justify-content: space-between;" class="flex-column">
     <div>
       <div style="font-size: 22px">Quick hello world Example</div>
       <figure class="highlight html" style="margin-left: 0;"><table><tbody><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">template</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">"container"</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">text</span> <span class="attr">class</span>=<span class="string">"text-color-primary"</span>&gt;</span>{{message}}<span class="tag">&lt;/<span class="name">text</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">template</span>&gt;</span></span><br></pre></td></tr></tbody></table></figure>

diff --git a/themes/vueNative/source/css/index.styl b/themes/vueNative/source/css/index.styl
@@ -28,13 +28,14 @@ body
   &.top
     background-color: transparent
     box-shadow: none
+    display: none
     .logo
       display: none
 
 #hero
   padding: $space 40px 30px
   background-color: #fff
-  width: 870px;
+  max-width: 870px;
   margin: 0 auto;
   .inner
     margin: 50px;
@@ -127,14 +128,13 @@ body
     font-weight: 700
     color: #fff
 
+
 @media screen and (max-width: $width)
   body
     -webkit-text-size-adjust: none
     font-size: 14px
   .sidebar
     display: block
-  #header
-    display: none
   #mobile-bar
     display: block
   #hero
@@ -167,3 +167,7 @@ body
       &:before
         content: "—"
         color: $green
+.flex-column{
+  flex-direction:column
+  align-items:center
+}
diff --git a/themes/vueNative/source/images/kitchenSink.gif b/themes/vueNative/source/images/kitchenSink.gif
diff --git a/themes/vueNative/source/images/landing.png b/themes/vueNative/source/images/landing.png
diff --git a/themes/vueNative/source/images/to-do.gif b/themes/vueNative/source/images/to-do.gif
diff --git a/themes/vueNative/source/images/vie-native.png b/themes/vueNative/source/images/vie-native.png