commit

index.html

@@ -24,12 +24,10 @@
       </div>
 
       <div class="header-top"><!--index cover image-->
-        <div class="img-container">
-          <figure>
-            <img src="https://view.moezx.cc/images/2019/10/17/vector-flying-plane-sunny-blue-sky_79451-230.jpg">
-          </figure>
-        </div>
-        <div class="video-container"></div>
+        <figure id="cover-img-container">
+          <img src="https://view.moezx.cc/images/2019/10/17/vector-flying-plane-sunny-blue-sky_79451-230.jpg">
+        </figure>
+        <div class="cover-video-container"></div>
       </div>
 
       <div class="site-content">

package-lock.json

@@ -5690,6 +5690,15 @@
       "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.10.tgz",
       "integrity": "sha512-0DTvPVU3ed8+HNXOu5Bs+o//Mbdj9VNQMUOe9oKCwh8l0GNwpTDMKCWbRjgtD291AWnkAgkqA/LOnQS8AmS1tw=="
     },
+    "parallax-js": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/parallax-js/-/parallax-js-3.1.0.tgz",
+      "integrity": "sha512-UONoPKSQykeNvFcemDPxYYDU/T89LSffoaZAwOMhDp0ABhmFPwthgn2GrfB7An9Qo+8nPZIuQeZsh2pWn1qN3A==",
+      "requires": {
+        "object-assign": "^4.1.1",
+        "raf": "^3.3.0"
+      }
+    },
     "parallel-transform": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.2.0.tgz",
@@ -6088,6 +6097,14 @@
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
       "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA=="
     },
+    "raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "requires": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",

package.json

@@ -14,6 +14,7 @@
     "file-loader": "^4.2.0",
     "material-components-web": "^3.2.0",
     "node-sass": "^4.13.0",
+    "parallax-js": "^3.1.0",
     "sass-loader": "^8.0.0",
     "webpack": "^4.41.2",
     "webpack-cli": "^3.3.10",

src/scss/layouts/index.scss

@@ -9,4 +9,13 @@
   display: flex;
   flex-flow: column nowrap;
   justify-content: space-between
- }
+ }
+
+.header-top {
+  figure {
+    width: 100%;
+    height: 657px;
+    background: tomato;
+    margin: 0;
+  }
+}