copy first part of styles from asure.network

AsureNetwork · Feb 28, 2019 · 27d58f6 · 27d58f6
1 parent dcd22e0
commit 27d58f6
Show file tree

Hide file tree

Showing 6 changed files with 212 additions and 109 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -20,6 +20,7 @@
   ],
   "license": "ISC",
   "devDependencies": {
+    "bootstrap": "^4.3.1",
     "harp": "^0.29.0",
     "node-sass": "^4.9.0"
   },

diff --git a/src/_layout.ejs b/src/_layout.ejs
@@ -9,7 +9,7 @@
     <meta name="keywords" content="<%= getByKey("keywords", keywords) %>">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-    <meta name="google-site-verification" content="y44WuK2ZR66lvH1A_awHiF5xZAnuldnjUJ2cFWTlH_I" />
+    <meta name="google-site-verification" content="y44WuK2ZR66lvH1A_awHiF5xZAnuldnjUJ2cFWTlH_I"/>
 
     <meta name="msapplication-TileColor" content="#ffffff">
     <meta name="msapplication-TileImage" content="<%= fixUrl(current.path, 'content/img/ico/ms-icon-144x144.png') %>">
@@ -42,8 +42,6 @@
     <link rel="icon" type="image/png" sizes="16x16"
           href="<%= fixUrl(current.path, 'content/img/ico/favicon-16x16.png') %>">
     <link rel="manifest" href="<%= fixUrl(current.path, 'content/img/ico/manifest.json') %>">
-    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css"
-          integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&amp;subset=cyrillic"
           rel="stylesheet">
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css"
@@ -56,14 +54,14 @@
 <%- partial("/shared/_header") %>
 <%- yield %>
 
-<script src="https://code.jquery.com/jquery-3.3.1.min.js"
-        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
         crossorigin="anonymous"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"
-        integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
+<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
+        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
         crossorigin="anonymous"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"
-        integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm"
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
+        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
         crossorigin="anonymous"></script>
 <script src="<%= prefixUrl() %>js/libs/slick/slick.min.js"></script>
 <script>
@@ -219,8 +217,7 @@
                     if (refElement.position().top <= scrollPos && refElement.position().top + refElement.height() + 75 > scrollPos) {
                         $('.blc-navbar .navbar-nav a[href*="#"]:not([href="#"])').removeClass("active");
                         currLink.addClass("active");
-                    }
-                    else {
+                    } else {
                         currLink.removeClass("active");
                     }
                 });

diff --git a/src/content/css/style.scss b/src/content/css/style.scss
@@ -1,4 +1,26 @@
+/*
+ * See https://getbootstrap.com/docs/4.3/getting-started/theming/
+ */
+$enable-rounded: false;
+
+$blue:    #69acd6;
+$indigo:  #6610f2;
+$purple:  #a90cfb;
+$pink:    #e83e8c;
+$red:     #e2324b;
+$orange:  #f15c27;
+$yellow:  #d49b40;
+$green:   #99c759;
+$teal:    #58c9c4;
+$cyan:    #7ec5b7;
+
+$success: $teal;
+
+@import "../../../node_modules/bootstrap/scss/bootstrap";
+
 $link-color: #2877bd;
+$title-color: #69acd6;
+$hero-title-color: #62381b;
 
 @mixin line {
   background: inherit;
@@ -129,8 +151,101 @@ $link-color: #2877bd;
   color: #ffffff;
 }
 
-.blc-footer a, .social a {
-  text-decoration: none;
+.blc-footer {
+  background-color: #262b2f;
+  //padding-top: 80px;
+  padding-bottom: 30px;
+  color: #ababa9;
+
+  .brand {
+    font-size: 1.1rem;
+    color: #84878a;
+    font-weight: 100;
+    text-transform: uppercase;
+
+    span {
+      padding: 15px 0 15px 0;
+      display: block;
+    }
+
+    img {
+      filter: invert(1);
+      width: 64px;
+    }
+  }
+
+  .title {
+    font-size: 18px;
+    margin-bottom: 34px;
+    color: #fff;
+  }
+
+  ul li {
+    margin-bottom: 10px;
+    list-style: none;
+    font-size: 16px;
+
+    a {
+      color: #ababa9;
+      text-decoration: none;
+    }
+  }
+
+  .border-left-gray {
+    @include media-breakpoint-down(sm) {
+      border-top: 1px solid #444;
+      padding-top: 5px;
+    }
+
+    @include media-breakpoint-up(md) {
+      border-left: 1px solid #444;
+    }
+  }
+}
+
+.navbar-footer {
+  opacity: 0;
+  animation: fadein2 250ms ease-out 4s forwards;
+
+  .navbar-cookies {
+    background-color: #1f252c;
+    border-bottom: none;
+    color: #fff;
+
+    .container {
+      font-size: 1rem;
+
+      .row {
+        width: 100%;
+      }
+    }
+  }
+
+  .navbar-social {
+    background-color: #262b2f;
+    border-top: 2px solid #66abd8;
+
+    @media (max-width: 576px) {
+      .form-inline {
+        width: 100%;
+        flex-wrap: nowrap;
+      }
+    }
+
+    .fb-like {
+      padding-right: 4px;
+    }
+  }
+}
+
+#footer {
+  background-color: #192028;
+  height: 140px;
+  line-height: 25px;
+  color: #999999;
+  font-size: 1.0rem;
+  text-align: center;
+  padding: 50px 0 50px 0;
 }
 
 .btn-primary {
@@ -420,41 +535,6 @@ div.tab-content {
   }
 }
 
-.navbar-footer {
-  opacity: 0;
-  -webkit-animation: fadein2 250ms ease-out 4s forwards;
-  animation: fadein2 250ms ease-out 4s forwards;
-
-  .navbar-cookies {
-    background-color: #f7f7f7;
-    //border-top: 2px solid #e61664;
-
-    .container {
-      font-size: 0.8em;
-    }
-
-    p {
-      margin: 0;
-    }
-  }
-
-  .navbar-social {
-    background-color: #262b2f;
-    border-top: 2px solid #66abd8;
-
-    @media (max-width: 576px) {
-      .form-inline {
-        width: 100%;
-        flex-wrap: nowrap;
-      }
-    }
-
-    .fb-like {
-      padding-right: 4px;
-    }
-  }
-}
-
 .bg-dark {
   background: #241302;
   h1 {
@@ -532,29 +612,6 @@ div.tab-content {
   @include even;
 }
 
-.blc-footer {
-  background-color: #262b2f;
-  //padding-top: 80px;
-  padding-bottom: 30px;
-  color: #ababa9;
-
-  .title {
-    font-size: 18px;
-    margin-bottom: 34px;
-    color: #fff;
-  }
-
-  ul li {
-    margin-bottom: 10px;
-    list-style: none;
-    font-size: 16px;
-
-    a {
-      color: #ababa9;
-    }
-  }
-}
-
 .social {
   padding-top: 50px;
   text-align: center;
@@ -929,15 +986,6 @@ blockquote {
   }
 }
 
-#footer {
-  background-color: #192028;
-  height: 100px;
-  line-height: 100px;
-  color: #999999;
-  font-size: 14px;
-  text-align: center;
-}
-
 .hide, .hidden {
   display: none;
 }

diff --git a/src/logo/asure.black64x64.png b/src/logo/asure.black64x64.png