HackCU · casassg · Feb 22, 2019 · Feb 14, 2019 · Feb 14, 2019 · Feb 19, 2019
diff --git a/_layouts/reverse.html b/_layouts/reverse.html
@@ -0,0 +1,116 @@
+---
+---
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+
+    <!-- Meta Information -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+
+
+    <!-- for Google -->
+    <meta name="description" content="{{page.description}}"/>
+    <meta name="author" content="{{site.author}}"/>
+    <meta name="theme-color" content="{{site.color}}">
+    <meta name="copyright" content="{{site.author}}"/>
+    <meta name="application-name" content="{{site.title}}"/>
+
+    <!-- for Facebook -->
+    <meta property="og:title" content="{%if page.title %}{{page.title}} | {%endif%} {{site.title}}"/>
+    <meta property="og:url" content="https://pages.hackcu.org"/>
+    <meta property="og:description" content="{%if page.description %}{{page.description}}{%endif%} "/>
+
+    <!-- for Twitter -->
+    <meta name="twitter:card" content="summary_large_image"/>
+    <meta name="twitter:title" content="{%if page.title %}{{page.title}} | {%endif%} {{site.title}}"/>
+    <meta name="twitter:site" content="@hackcu">
+    <meta name="twitter:creator" content="@hackcu">
+    <meta name="twitter:description" content="{%if page.description %}{{page.description}}{%endif%}">
+
+    <title>{%if page.title %}{{page.title}} | {%endif%} {{site.title}}</title>
+
+    <!-- Favicon -->
+    <link rel="shortcut icon" href="/assets/img/favicon.ico" type="image/x-icon">
+
+    <link rel="stylesheet" href="/assets/vendor/css/font-awesome.min.css">
+
+
+    <!-- Our own CSS, yay! -->
+    <link rel="stylesheet" href="/assets/css/main.css?_={{ site.time |  date: '%s' }}">
+
+    <!-- Compiled and minified CSS -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
+
+
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
+
+</head>
+
+<body>
+
+<script src="/assets/vendor/js/jquery.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
+
+<div class="wrapper">
+        <div class="countdown center">
+            {% raw %}
+            <h1>
+                <img src="/assets/img/logo_white.png">    |   
+                <span class="margin-needed">{{hours|twodigits}} : {{minutes|twodigits}} : {{seconds|twodigits}}</span>
+            </h1>
+            {% endraw %}
+        </div>
+    <div class="container">    
+        <div class="row">
+            <div class="col s12 content">
+                {{content}}
+            </div>
+        </div>
+    </div>
+</div>
+
+
+
+<script src="/assets/js/countdown.js?_={{ site.time |  date: '%s' }}"></script>
+
+
+
+
+<!-- Compiled and minified JavaScript -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
+
+<script type="text/javascript">
+    $(".button-collapse").sideNav();
+</script>
+<!-- Make links target _blank -->
+<script>
+(function() {
+  var links = document.links;
+  for (var i = 0, linksLength = links.length; i < linksLength; i++) {
+    // can also be
+    //  links[i].hostname != 'subdomain.example.com'
+    if (links[i].hostname != window.location.hostname) {
+      links[i].target = '_blank';
+      links[i].className += ' externalLink';
+    }
+  }
+})();
+</script>
+
+<!-- Global site tag (gtag.js) - Google Analytics -->
+<script async src="https://www.googletagmanager.com/gtag/js?id=UA-128943166-1"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', 'UA-128943166-1');
+</script>
+
+
+
+</body>
+
+</html>
diff --git a/assets/css/upcoming.scss b/assets/css/upcoming.scss
@@ -0,0 +1,189 @@
+---
+---
+@charset "utf-8";
+@import "../_sass/mixins";
+
+$main-color: #fff;
+$footer-text: #fff;
+$accent-color: {{site.color}};
+$secondary-color: {{site.secondary_color}};
+
+body {
+    background-color: $accent-color;
+    color: $main-color;
+    .content {
+        margin-top: 200px;
+    }
+}
+
+.countdown{
+
+    padding: 5px;
+    margin-bottom: 10px;
+    position: fixed;
+    width: 100%;
+    background-color: $accent-color;
+    @include box-shadow(  0px 20px 40px 0px rgba($accent-color, 1.0));
+    top:0px;
+    z-index: 1000;
+
+    min-width: 305px;
+
+    h1 {
+        img {
+            vertical-align:middle;
+            height: 1.5em;
+            margin-right:30px;
+        }
+        .margin-needed {
+            margin-left: 30px;
+        }
+    } 
+
+}
+
+/* The actual timeline (the vertical ruler) */
+.timeline {
+    position: relative;
+    max-width: 1200px;
+    height: 100%;
+    margin: 0 auto;
+
+    /* The actual timeline (the vertical ruler) */
+    &::after {
+        content: '';
+        position: absolute;
+        width: 6px;
+        background-color: $secondary-color;
+        top: 0;
+        bottom: 0;
+        left: 0%;
+        margin-left: -3px;
+        @include box-shadow(inset 0px 11px 8px -5px $accent-color, inset 0px -11px 8px -5px $accent-color); 
+    }
+}
+
+/* Container around content */
+.item {
+    padding: 10px 30px;
+    position: relative;
+    background-color: inherit;
+    /* Add arrows pointing left */
+    &::before {
+        content: " ";
+        height: 0;
+        position: absolute;
+        top: 22px;
+        width: 0;
+        z-index: 1;
+        left: 20px;
+
+    }
+}
+
+/* The actual content */
+.inner-item {
+    padding: 10px 20px;
+    position: relative;
+    display: flex;
+    align-items: center;
+
+    .hours {
+        display: flex;
+        flex-direction: column;
+        min-width: 120px;
+    }
+
+    .start {
+        color: $secondary-color;
+        padding-top:5px;
+    }
+
+}
+
+.bigcard {
+    .hours {
+        padding-right: 40px;
+        min-width: 166px;
+    }
+
+    h4, h3 {
+        margin:0;
+        line-height: 1em;
+        white-space: pre-line;
+    }
+
+    h4 {
+        white-space: nowrap;
+        text-align: right;
+    }
+
+    h3 {
+        padding-top: 20px;
+        padding-bottom: 8px;
+    }
+}
+
+.smallcard{
+    width: 80%;
+
+    .hours {
+        padding-right: 30px;
+        min-width: 130px;
+    }
+
+    h5, h4 {
+        margin:0;
+        line-height: 1em;
+        white-space: pre-line;
+    }
+
+    h5 {
+        white-space: nowrap;
+        text-align: right;
+    }
+
+    h4 {
+        padding-top: 12px;
+    }
+}
+
+/* Media queries - Responsive timeline on screens less than 600px wide */
+@media screen and (max-width: 600px) {
+/* Place the timelime to the left */
+    .timeline::after {
+        left: 0px;
+    }
+
+    .inner-item {
+        flex-direction: column;
+        align-items: flex-start;
+
+        .hours {
+            flex-direction: row;
+            padding-top: 10px;
+            padding-bottom: 0px;
+        }
+
+        .end {
+            .sub {
+                vertical-align: sub;
+            }
+        }
+
+        .start {
+            padding-right: 4px;
+            vertical-align: text-bottom;
+        }
+    }
+
+    .bigcard {
+        .start {
+            margin-top: 2px;
+            padding-right: 5px;
+        }
+        h3 {
+            padding-top: 12px;
+        }
+    }
+} 
diff --git a/assets/img/logo_white.png b/assets/img/logo_white.png