improve navbar and eventpage styling

content/assets/stylesheets/includes/eventpage.scss

@@ -0,0 +1,13 @@
+.google-maps {
+  position: relative;
+  height: 400px;
+  overflow: hidden;
+
+  iframe {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100% !important;
+    height: 400px;
+  }
+}

content/assets/stylesheets/includes/general.scss

@@ -1,7 +1,3 @@
-html, body {
-  height: 100%;
-  width: 100%;
-}
 .fa-ul {
   list-style: none !important;
 
@@ -10,10 +6,17 @@ html, body {
   }
 }
 
+.has-text-justified {
+  text-align: justify;
+}
+
 
 #navbar {
   align-items: flex-end;
 
+  #inline-logo {
+    min-width: 38.703px;
+  }
   #logo-link {
     #logo {
       padding-top: 10px;

content/assets/stylesheets/main.scss

@@ -16,4 +16,5 @@ $family-sans-serif: 'Open Sans', sans-serif;
 @import "includes/tiles";
 @import "includes/blogpost";
 @import "includes/general";
+@import "includes/eventpage";
 @import "includes/404";

layouts/eventpost.erb

@@ -5,42 +5,52 @@
 <meta property="og:url" content="<%= url_for(item) %>" />
 <% end %>
 
-<section class="hero is-medium is-info">
+<section class="hero is-medium is-info is-bold">
   <div class="hero-head">
-    <%= render '/partials/_navbar.*', white: true %>
+    <%= render '/partials/_navbar.*', zeus_logo_color: :white %>
   </div>
   <div class="hero-body">
     <div class="container">
-      <h1 class="title">
+      <p class="title is-1">
+        <b>
         <%= item[:title] %>
-      </h1>
-      <h2 class="subtitle">
+        </b>
+      </p>
+      <p class="subtitle is-3">
+        <%= item[:description] %>
+      </p>
+      <p class="subtitle is-3">
         <ul class="fa-ul">
           <li><%= fa 'clock-o', li: true %><%= item[:time] %></li>
           <li><%= fa 'globe', li: true %><%= item[:location] %></li>
         </ul>
-      </h2>
+      </p>
     </div>
   </div>
 </section>
 
 <section class="section">
   <div class="columns">
-    <!--
-    <div id="event-info" class="column">
-      <div class="box">
-        <ul class="fa-ul">
-          <li><%= fa 'clock-o', li: true %><%= item[:time] %></li>
-          <li><%= fa 'globe', li: true %><%= item[:location] %></li>
-        </ul>
-      </div>
-    </div>
-    -->
     <div class="column is-8 is-offset-2">
-
-      <div class="content">
+      <div class="content has-text-justified">
         <%= yield %>
       </div>
     </div>
   </div>
+  <div class="columns">
+    <div class="column is-4 is-offset-1">
+      <div class="content has-text-right">
+        <blockquote>
+        Nadat u het auditorium (A3) verlaten hebt, ga links door de glazen deur. Vervolgens hebt u recht voor u opnieuw een glazen deur, ga ook door deze deur. Vervolgens wandelt u helemaal tot het einde van de gang. U komt dan aan de ingang uit van het pc-lokaal Zuse in S9
+        </blockquote>
+      </div>
+    </div>
+    <div class="google-maps column is-5 is-offset-1">
+      <iframe
+        frameborder="0" style="border:0"
+        src="https://www.google.com/maps/embed/v1/place?key=AIzaSyBDTmw7LtDG28o9QjCnNucAJv2zTZpLjJU
+          &q=Zeus+WPI,Ghent+Belgium" allowfullscreen>
+      </iframe>
+    </div>
+  </div>
 </section>

layouts/partials/_navbar.erb

@@ -2,12 +2,15 @@
   <div class="columns">
     <div class="column is-narrow is-hidden-mobile">
       <a id="logo-link" href="/">
-        <img id="logo" src="/assets/images/zeuslogo<%= '_white' if @white %>.svg" alt="" />
+        <img id="logo" src="<%= zeus_logo_url color: @zeus_logo_color %>" alt="" />
       </a>
     </div>
     <div class="column">
       <nav class="nav">
           <div class="nav-left">
+            <a class="is-hidden-tablet nav-item" href="/">
+              <img id="inline-logo" src="<%= zeus_logo_url color: @zeus_logo_color %>" alt="" />
+            </a>
             <% nav_items do |item, active| %>
             <a class="nav-item is-tab <%= 'is-active' if active %>" href="<%= relative_path_to(item) %>">
               <%= item[:title] %>

lib/helpers/assets.rb

@@ -6,4 +6,8 @@ module AssetHelper
       css: "<link rel='stylesheet' type='text/css' href='/assets/stylesheets/#{identifier}.css'>"
     }[type]
   end
+
+  def zeus_logo_url(color: :black)
+    "/assets/images/zeuslogo#{'_white' if color == :white}.svg"
+  end
 end