upgrading v2.5

badoubadou · Mar 21, 2019 · 1dc7b46 · 1dc7b46
1 parent 17d586a
commit 1dc7b46
Show file tree

Hide file tree

Showing 14 changed files with 4,177 additions and 5,228 deletions.
diff --git a/.gitignore b/.gitignore
@@ -29,7 +29,5 @@ generate_pending
 .vscode
 
 # Generated files
-static/manifest*.json
-static/sw.js
-static/workbox-sw*.js
+sw.*
 
diff --git a/CHANGES.md b/CHANGES.md
@@ -0,0 +1,20 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+## Example
+
+> **[ MAJOR.MINOR.PATCH ]** - DD - MONTH - YEAR
+
+- What has changed in this version
+- Summaries only
+- Any breaking changes
+
+> **[ 1.1.0 ]**
+
+- 21 - March - 2019
+  - Nuxt updated to v2.5
+  - Added postcss-nested
+
+> **[ 1.0.0 ]**
+  - stable release
diff --git a/assets/config.js b/assets/config.js
@@ -12,11 +12,12 @@ const Config = {
   wpDomain: 'https://[api.wordpress_site.com]/wp-json',
   client: 'https://[api.wordpress_site.com]',
   url: '[http://your-url.com]',
+  loadDbName: 'starter_wp',
   api: {
     homePage: '/wp/v2/pages/[page_id]',
     // this url will hit an endpoint for contact form 7 plugin
     postFormContact: '/contact-form-7/v1/contact-forms/{form_id}/feedback'
   }
 }
 
-export default Config
+module.exports = Config
diff --git a/assets/css/animations.scss b/assets/css/animations.scss
@@ -1,6 +1,6 @@
 .fade-enter-active,
 .fade-leave-active {
-  transition: all .8s ease-in-out;
+  transition: all 0.8s ease-in-out;
 }
 
 .fade-enter,
@@ -15,7 +15,7 @@
 }
 
 .rotate {
-  transition: opacity .6s ease-in-out;
+  transition: opacity 0.6s ease-in-out;
   position: absolute;
   height: 36px;
   width: 36px;
@@ -43,7 +43,7 @@
 /* ---------------------------------- */
 
 .color-cycle:hover .char {
-  animation: color-cycle 1s cubic-bezier(.5, 0, .5, 1) infinite alternate;
+  animation: color-cycle 1s cubic-bezier(0.5, 0, 0.5, 1) infinite alternate;
   animation-delay: calc(0.03s * var(--char-index));
   animation-duration: calc(0.04s * calc(var(--char-total)));
 }
@@ -68,7 +68,7 @@
 .pop-out-color {
   .char {
     color: #000;
-    animation-timing-function: cubic-bezier(.5, 0, .5, 1), linear;
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1), linear;
     animation-iteration-count: infinite;
     animation-duration: calc(0.08s * calc(var(--char-total)));
     animation-delay: calc(0.08s * var(--char-index));
@@ -111,29 +111,33 @@
 /* ---------------------------------- */
 
 .page-enter-active {
-  animation: acrossIn .40s ease-out both;
+  animation: acrossIn 0.4s ease-out both;
 }
 
 .page-leave-active {
   display: block;
-  animation: acrossOut .80s ease-in both;
+  animation: acrossOut 0.4s ease-in both;
 }
 
 @keyframes acrossIn {
   0% {
-    transform: translate3d(0, 100%, 0);
+    opacity: 0;
+    // transform: translate3d(0, 100%, 0);
   }
   100% {
-    transform: translate3d(0, 0, 0);
+    opacity: 1;
+    // transform: translate3d(0, 0, 0);
   }
 }
 
 @keyframes acrossOut {
   0% {
-    transform: translate3d(0, 0, 0);
+    opacity: 1;
+    // transform: translate3d(0, 0, 0);
   }
   100% {
-    transform: translate3d(0, -100%, 0);
+    opacity: 0;
+    // transform: translate3d(0, -100%, 0);
   }
 }
 

diff --git a/components/Sliders/TheCarousel.vue b/components/Sliders/TheCarousel.vue
@@ -1,16 +1,21 @@
 <template>
   <div class="carousel" v-if="data != null && data.length > 0">
-
-    <div @mouseover="hovering = true" @mouseleave="hovering = false" ref="Carousel" v-swiper:blogSwiper="swiperOption" >
+    <div
+      @mouseover="hovering = true"
+      @mouseleave="hovering = false"
+      ref="Carousel"
+      v-swiper:blogSwiper="swiperOption"
+    >
       <div class="app-carousel swiper-wrapper">
-        <div 
+        <div
           class="swiper-slide"
           v-if="item.acf.hero && item.acf.product"
           v-for="item in data"
           :key="item.id"
           @click="$router.push(item.slug)"
         >
-          <lazy-image class='image'
+          <LazyImage
+            class="image"
             :hover="true"
             :image="item.acf.hero.desktop_bg"
             type="'case_study'"
@@ -23,9 +28,8 @@
               <h4 class="subtitle">{{item.acf.category}}</h4>
               <button role="navigation" class="subtitle subtitle--show">Show Case Study</button>
             </div>
-          </lazy-image>
+          </LazyImage>
         </div>
-
       </div>
       <!-- slider arrows -->
       <div class="prev">Prev</div>
@@ -36,14 +40,14 @@
 
 <script>
   export default {
-    name: 'TheCarousel',
+    name: "TheCarousel",
     props: {
       data: {
         type: Array
       },
       location: {
         type: String,
-        default: ''
+        default: ""
       }
     },
     data () {
@@ -64,53 +68,57 @@
         nudgedVal: 0,
         swiperOption: {
           initialSlide: 1,
-          slidesPerView: 'auto',
+          slidesPerView: "auto",
           centeredSlides: true,
           spaceBetween: 32,
           breakpoints: {
             640: {
-              slidesPerView: 'auto',
+              slidesPerView: "auto",
               spaceBetween: 32
             },
             320: {
-              slidesPerView: 'auto',
+              slidesPerView: "auto",
               spaceBetween: 16
             }
           },
           autoplay: false,
           loop: false,
           paginationHide: false,
-          pagination: '.swiper-pagination'
+          pagination: ".swiper-pagination"
         }
-      }
+      };
     },
     mounted () {
-      document.querySelector('.prev').addEventListener(
-        'click',
-        event => {
-          event.preventDefault()
-          try {
-            this.$refs.Carousel.swiper.slidePrev()
-          } catch (e) {}
-        },
-        false
-      )
+      let prev = document.querySelector(".prev");
+      prev &&
+        prev.addEventListener(
+          "click",
+          event => {
+            event.preventDefault();
+            try {
+              this.$refs.Carousel.swiper.slidePrev();
+            } catch (e) {}
+          },
+          false
+        );
 
-      document.querySelector('.next').addEventListener(
-        'click',
-        event => {
-          event.preventDefault()
-          try {
-            this.$refs.Carousel.swiper.slideNext()
-          } catch (e) {}
-        },
-        false
-      )
+      let next = document.querySelector(".next");
+      next &&
+        next.addEventListener(
+          "click",
+          event => {
+            event.preventDefault();
+            try {
+              this.$refs.Carousel.swiper.slideNext();
+            } catch (e) {}
+          },
+          false
+        );
     },
     components: {
-      LazyImage: () => import('@/components/UI/LazyImage')
+      LazyImage: () => import("@/components/UI/LazyImage")
     }
-  }
+  };
 </script>
 
 <style lang="scss" scoped>

diff --git a/components/UI/CookieBox.vue b/components/UI/CookieBox.vue
@@ -1,38 +1,46 @@
 <template>
   <div v-show="!hide" class="cookies" :class="{'active': show}">
     <div class="container">
-      <p>This site uses cookies. <nuxt-link to="/privacy-policy">Find out more.</nuxt-link> <span role="accept-cookie" @click="setCookie()" class="privacy-link" to="/privacy-policy">OK, Close</span></p>
+      <p>This site uses cookies.
+        <nuxt-link to="/privacy-policy">Find out more.</nuxt-link>
+        <span
+          role="accept-cookie"
+          @click="setCookie()"
+          class="privacy-link"
+          to="/privacy-policy"
+        >OK, Close</span>
+      </p>
     </div>
   </div>
 </template>
 
 <script>
   export default {
-    name: 'CookieBox',
+    name: "CookieBox",
     data () {
       return {
         hide: true,
         show: false
-      }
+      };
     },
     mounted () {
-      if (this.$localStorage.get('NuniCookie') != null) {
-        this.hide = true
-        this.show = false
+      if (this.$localStorage.get("NuniCookie") != null) {
+        this.hide = true;
+        this.show = false;
       } else {
         setTimeout(() => {
-          this.hide = false
-          this.show = true
-        }, 4000)
+          this.hide = false;
+          this.show = true;
+        }, 4000);
       }
     },
     methods: {
       setCookie () {
-        this.hide = true
-        this.$localStorage.set('NuniCookie', true)
+        this.hide = true;
+        this.$localStorage.set("NuniCookie", true);
       }
     }
-  }
+  };
 </script>
 
 <style lang="scss" scoped>