updates

7 years ago · bc9cb96d9d
7 changed files with 3511 additions and 2 deletions
--- a/css/app.css
+++ b/css/app.css
--- a/img/mockup.jpg
+++ b/img/mockup.jpg
--- a/index.html
+++ b/index.html
@ -24,12 +24,42 @@
        <meta name="msapplication-TileColor" content="#ffffff">
        <meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
        <meta name="theme-color" content="#ffffff">
+        <link href="https://fonts.googleapis.com/css?family=Raleway:200,400,700" rel="stylesheet">
        <link rel="stylesheet" href="css/app.css" type="text/css" />

    </head>
    <body>
        <div id="app">
            <section class="section1"></section>
+            <section class="section2">
+                <div class="container">
+                    <div>
+                        <p>Heimdall has been designed to make your life easier.  At its very core it's a way to organise 
+                            all the sites and application you use on a daily basis and present them in an informative and 
+                            pleasing way.</p>
+
+
+                    </div>
+                </div>
+            </section>
+            <img class="section4" src="img/mockup.jpg" alt="Heimdall on various devices" />
+            <section class="section3">
+                <div class="container">
+                    <div class="video-container">
+                        <iframe width="900" height="563" src="https://www.youtube.com/embed/GXnnMAxPzMc?showinfo=0&autohide=1" frameborder="0" allow="encrypted-media" allowfullscreen></iframe>
+                    </div>
+                </div>
+            </section>
+            
+            <!--<section class="section2">
+                <div class="container">
+                    <div class="row">
+                        <div class="col-md-4">Something here</div>
+                        <div class="col-md-4">Something here</div>
+                        <div class="col-md-4">Something here</div>
+                    </div>
+                </div>
+            </section>-->
            
        </div>
        <!--<script src="//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
--- a/package-lock.json
+++ b/package-lock.json
@ -1200,6 +1200,11 @@
        "hoek": "2.16.3"
      }
    },
+    "bootstrap-4-grid": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/bootstrap-4-grid/-/bootstrap-4-grid-2.3.0.tgz",
+      "integrity": "sha1-asoQlwPrBSVFqIpS9lGLQpu+zZU="
+    },
    "brace-expansion": {
      "version": "1.1.11",
      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
--- a/package.json
+++ b/package.json
@ -4,6 +4,7 @@
  "description": "Website for the app",
  "main": "webpack.mix.js",
  "dependencies": {
+    "bootstrap-4-grid": "^2.3.0",
    "cross-env": "^5.1.3",
    "laravel-mix": "^2.0.0"
  },
--- a/sass/_app.scss
+++ b/sass/_app.scss
@ -1,8 +1,35 @@
+body {
+    font-family: 'Raleway', sans-serif;
+    font-weight: 400;
+    line-height: 1.5;
+}
 .section1 {
-    background: #7d8080;
+    background: #4a5c67;
    height: 100vh;
    background-image: url("../img/heimdall-logo.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 25%;
 }
+.section2 {
+    background: #c7cfd4;
+    padding: 80px 40px 1px;
+}
+.section3 {
+    background: #e8e8e8;
+    padding: 100px 40px 30px;
+}
+.section4 {
+    max-width: 100%;
+    height: auto;
+    display: block;
+}
+.video-container {
+    position: relative;
+    overflow: hidden;
+    text-align: center;
+    iframe {
+        position: relative;
+        top: -50px;
+    }
+}
--- a/sass/app.scss
+++ b/sass/app.scss
@ -1,3 +1,4 @@

@import "normalise";
+@import "node_modules/bootstrap-4-grid/scss/grid";
@import "app";