Home Explore Help
Sign In
Yumin
/
vue-chen
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

feat: base page

WangYumin 2 years ago
parent
f83d15f838
commit
f209f6e6b8
6 changed files with 47 additions and 30 deletions
Split View Show Diff Stats
  1. 1 1
      public/index.html
  2. 5 2
      src/App.vue
  3. 5 1
      src/layout/Footer.vue
  4. 0 1
      src/views/Part1.vue
  5. 34 25
      src/views/Part2.vue
  6. 2 0
      vue.config.js

+ 1 - 1
public/index.html
View File 

@@ -3,7 +3,7 @@
 
   <head>
 
     <meta charset="utf-8">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
     <title>chen</title>

+ 5 - 2
src/App.vue
View File 

@@ -23,8 +23,9 @@ export default {
 
 }
 
 
 header {
 
-  flex: 0 0 auto;
 
-  position: absolute;
 
+  /*flex: 0 0 auto;*/
 
+  position: fixed;
 
+  top: 0;
 
 }
 
 
 .main {
 
@@ -37,6 +38,8 @@ header {
 
 
 footer {
 
   flex: 0 0 auto;
 
+  /*width: calc(100vw - 64px);*/
 
+  height: 90px;
 
 }
 
 
 /*

+ 5 - 1
src/layout/Footer.vue
View File 

@@ -31,7 +31,11 @@ export default {
 
   background-color: black;
 
   color: white;
 
   font-size: 14px;
 
-  padding: 32px;
 
+  padding: 0 32px;
 
+}
 
+
 
+.container {
 
+  margin-top: 32px;
 
 }
 
 
 a {

+ 0 - 1
src/views/Part1.vue
View File 

@@ -1,6 +1,5 @@
 
 <template>
 
   <div class="container">
 
-    p1
 
   </div>
 
 </template>

+ 34 - 25
src/views/Part2.vue
View File 

@@ -1,5 +1,5 @@
 
 <template>
 
-  <div class="container">
 
+  <div class="container" style="">
 
     <div style="padding: 72px 32px 0;">
 
       <div style="width: 50%; margin-left: auto;">
 
         <div style="padding:50% 0 0 0;position:relative;">
 
@@ -10,30 +10,32 @@
 
       <img src="../assets/p2/10.png" width="100%" style="margin-top: 64px;"/>
 
       <img src="../assets/p2/20.jpg" width="35%" style="float: right; margin-top: 48px;"/>
 
 
-      <div class="grid">
 
-        <div class="row">
 
-          <img src="../assets/p2/11.jpg"/>
 
-          <span></span>
 
-        </div>
 
-        <div class="row">
 
-          <span></span>
 
-          <img src="../assets/p2/12.jpg"/>
 
-        </div>
 
-        <div class="row">
 
-          <img src="../assets/p2/13.jpg"/>
 
-          <span></span>
 
-        </div>
 
-        <div class="row">
 
-          <span></span>
 
-          <img src="../assets/p2/14.jpg"/>
 
-        </div>
 
-        <div class="row">
 
-          <img src="../assets/p2/15.jpg"/>
 
-          <span></span>
 
-        </div>
 
-        <div class="row">
 
-          <span></span>
 
-          <img src="../assets/p2/16.jpg"/>
 
+      <div>
 
+        <div class="grid">
 
+          <div class="row">
 
+            <img src="../assets/p2/11.jpg"/>
 
+            <span></span>
 
+          </div>
 
+          <div class="row">
 
+            <span></span>
 
+            <img src="../assets/p2/12.jpg"/>
 
+          </div>
 
+          <div class="row">
 
+            <img src="../assets/p2/13.jpg"/>
 
+            <span></span>
 
+          </div>
 
+          <div class="row">
 
+            <span></span>
 
+            <img src="../assets/p2/14.jpg"/>
 
+          </div>
 
+          <div class="row">
 
+            <img src="../assets/p2/15.jpg"/>
 
+            <span></span>
 
+          </div>
 
+          <div class="row">
 
+            <span></span>
 
+            <img src="../assets/p2/16.jpg"/>
 
+          </div>
 
         </div>
 
       </div>
 
     </div>
 
@@ -61,6 +63,13 @@ export default {
 
   background-attachment: fixed;
 
 }
 
 
+.container::after {
 
+  float: none;
 
+  display: block;
 
+  content: "";
 
+  clear: both;
 
+}
 
+
 
 .grid {
 
   width: 50%;
 
   margin-top: 48px;

+ 2 - 0
vue.config.js
View File 

@@ -1,5 +1,7 @@
 
 module.exports = {
 
   devServer: {
 
+    allowedHosts: [],
 
+    disableHostCheck: true,
 
     port: 8000
 
   },
 
   css: {