Merge pull request #54 from exec-io/feature/redesign

Feature/redesign

Author: Rhiana Heath

app/assets/images/locked-icon.svg renamed to app/assets/images/icons/locked-icon.svg

@@ -20,6 +20,7 @@
 //= require trix
 
 // Components
+//= require components/header
 //= require components/secret-item
 //= require components/two-factor-fields
 //= require components/new-secret-form

app/assets/images/unlocked-icon.svg renamed to app/assets/images/icons/unlocked-icon.svg

@@ -0,0 +1,25 @@
+$(function() {
+  // Add smooth scrolling to all header links
+  $('.main-nav__links a[href^="/home#"], .footer-links a[href^="/home#"]').on('click', function(event) {
+    smoothScrolling(event);
+  });
+});
+
+function smoothScrolling(event) {
+  var link = event.target;
+
+  if (link.hash !== "") {
+    var hash    = link.hash;
+    var target  = $(hash).length > 0;
+
+    // Scroll a little higher to account for the sticky header
+    var headerHeight = 50;
+    var yValue = $(hash).offset().top - headerHeight;
+
+    if (target) {
+      $('html, body').animate({
+        scrollTop: yValue
+      }, 800);
+    }
+  }
+}

app/assets/javascripts/application.js

@@ -0,0 +1,35 @@
+@import "base/variables";
+@import "base/tools";
+@import "pickadate/default";
+@import "pickadate/default.date";
+@import "bootstrap-sprockets";
+@import "bootstrap";
+@import "base/normalize";
+@import "base/body";
+@import "base/typography";
+
+
+@import "objects/alerts";
+@import "objects/buttons";
+
+@import "trix";
+
+// Layouts
+@import "layouts/dashboard";
+@import "layouts/devise";
+@import "layouts/home";
+@import "layouts/secrets";
+@import "layouts/topsekrit";
+
+// Components
+@import "components/footer";
+@import "components/header";
+@import "components/banner";
+@import "components/panels";
+
+@import "components/two-factor-fields";
+@import "components/email-preview";
+@import "components/steps";
+
+// Helpers
+@import "base/helpers";

app/assets/javascripts/components/header.js

@@ -0,0 +1,45 @@
+html, body {
+  width: 100%;
+  background-color: white;
+  font-weight: normal;
+}
+
+body {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+input, textarea, button,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+  font-size: 16px;
+  font-family: $font-family;
+  line-height: 1.1;
+  color: $text-default-color;
+}
+
+iframe {
+  border: 0;
+}
+
+.container-fluid {
+  padding-left: 0;
+  padding-right: 0;
+  padding-bottom: 90px;
+}
+.row {
+  margin-left: 0;
+  margin-right: 0;
+}

app/assets/stylesheets/application.sass

@@ -0,0 +1,7 @@
+.top-buffer {
+  margin-top: 30px;
+}
+
+.hidden {
+  display: none;
+}