Benjamin Kornblum 7 ماه پیش
والد
کامیت
e0a70de6f2
3فایلهای تغییر یافته به همراه22 افزوده شده و 14 حذف شده
  1. 2 3
      src/components/Footer.vue
  2. 18 9
      src/components/Timeline.vue
  3. 2 2
      src/views/HomeView.vue

+ 2 - 3
src/components/Footer.vue

@@ -10,16 +10,15 @@
 
 <template>
   <footer>
-    <div class="wrapper">
+
       <Navigation/>
-    </div>
   </footer>
   <!--<div class="bg_bottom"> </div>-->
 </template>
 
 <style scoped>
 footer {
-   height: 90px;
+   min-height: 90px;
    vertical-align: middle;
    width: 100%;
    color: #fff;

+ 18 - 9
src/components/Timeline.vue

@@ -150,35 +150,44 @@ body {
 }
 
 /* Media queries - Responsive timeline on screens less than 600px wide */
-@media screen and (max-width: 600px) {
+@media screen and (max-width: 1200px) {
 /* Place the timelime to the left */
   .timeline::after {
-    left: 31px;
+    left: 45px;
   }
 
 /* Full-width containers */
   .container {
     width: 100%;
-    padding-left: 70px;
+    padding-left: 88px;
     padding-right: 25px;
   }
 
 /* Make sure that all arrows are pointing leftwards */
   .container::before {
-    left: 60px;
-    border: medium solid white;
+    left: 80px;
+    border: medium solid #aac5f5;
     border-width: 10px 10px 10px 0;
-    border-color: transparent white transparent transparent;
+    border-color: transparent #aac5f5 transparent transparent;
   }
 
 /* Make sure all circles are at the same spot */
   .left::after, .right::after {
+    left: -8px;
+  }
+
+  .left, .right{
+    top: 45px;
     left: 15px;
   }
+  .text-left{
+    text-align: left;
+  }
+}
 
-/* Make all right containers behave like the left ones */
-  .right {
-    left: 0%;
+@media screen and (max-width: 580px) {
+  h2{
+    font-size: 24px;
   }
 }
 </style>

+ 2 - 2
src/views/HomeView.vue

@@ -26,10 +26,10 @@
       <div class="component component-dark">
           <Countdown/>
       </div>
-      <!--<div class="component component-bg-top"> </div>
+      <div class="component component-bg-top"> </div>
       <div class="component"><Timeline/></div>
       <div class="component component-bg-bottom"> </div>
-      <div class="component component-dark component-padding">
+      <!--<div class="component component-dark component-padding">
         <Map q="Abendkamp%2017,%2029646%20Bispingen"/>
       </div>-->
     </div>