Tweaks in header and adds footer

mmarcon · Apr 4, 2016 · b4e6b04 · b4e6b04
1 parent 16812ac
commit b4e6b04
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 19 deletions.
diff --git a/assets/custom.css b/assets/custom.css
@@ -77,6 +77,10 @@ li.project h4 {
     min-height: 50vh;
 }
 
+.jumbotron.landing {
+    background: #fff;
+}
+
 .jumbotron.project .container h1, .jumbotron.project .container p {
     color: #fff;
 }
@@ -86,6 +90,29 @@ li.project h4 {
     border-radius: 0;
 }
 
+.navbar-default {
+    background-color: #fff;
+}
+
 .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
-    background-color: #eee;
+    background-color: #fff;
+}
+
+footer {
+    margin-top: 50px;
+    border-top: 1px solid #eee;
+}
+
+footer ul {
+    padding: 15px 0;
+}
+
+footer .copyright {
+    padding: 15px;
+}
+
+footer li {
+    display: inline-block;
+    margin-right: 15px;
+
 }
diff --git a/layouts/index.html b/layouts/index.html
@@ -3,24 +3,30 @@
 <%- include partials/head.html %>
 <body>
     <%- include partials/nav.html %>
-    <main class="container">
-        <h1><%= title %></h1>
-        <h2><small><%= subtitle %></small></h2>
-
-        <h3>Projects</h3>
-        <ul class="projects row">
-        <% collections.projects.forEach(p => { %>
-            <li class="project col-sm-4"> 
-                <a href="<%= p.path %>" class="wrapper" style="background-image:url(/assets/images/projects/<%= p.thumb %>)">
-                    <div class="inner">
-                        <h4><%= p.title %></h4>
-                        <p><%= p.subtitle %></p>
-                    </div>
-                </a>
-            </li>
-        <% }) %>
-        </ul>
+    <main>
+        <header class="jumbotron landing">
+                <div class="container">
+                    <h1><%= title %></h1>
+                    <p><%= subtitle %></p>
+                </div>
+        </header>
+        <div class="container">
+            <h3>Projects</h3>
+            <ul class="projects row">
+            <% collections.projects.forEach(p => { %>
+                <li class="project col-sm-4"> 
+                    <a href="<%= p.path %>" class="wrapper" style="background-image:url(/assets/images/projects/<%= p.thumb %>)">
+                        <div class="inner">
+                            <h4><%= p.title %></h4>
+                            <p><%= p.subtitle %></p>
+                        </div>
+                    </a>
+                </li>
+            <% }) %>
+            </ul>
+        </div>
     </main>
+    <%- include partials/footer.html %>
     <%- include partials/end_body.html %>
 </body>
 </html>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
@@ -0,0 +1,12 @@
+<footer>
+    <div class="container">
+        <div class="row">
+        <ul class="col-md-10">
+            <li><a href="https://github.com/mmarcon">Github</a></li>
+            <li><a href="https://twitter.com/mmarcon">Twitter</a></li>
+            <li><a href="https://linkedin.com/in/massimilianomarcon">LinkedIn</a></li>
+        </ul>
+        <p class="col-md-2 copyright"><small>&copy; 2016 Massimiliano Marcon</small></p>
+        </div>
+    </div>
+</footer>
diff --git a/layouts/project.html b/layouts/project.html
@@ -16,6 +16,7 @@ <h4 class="date"><%= `${MONTHS[date.getMonth()]} ${date.getFullYear()}` %></h4>
             <%- contents %>
         </div>
     </main>
+    <%- include partials/footer.html %>
     <%- include partials/end_body.html %>
 </body>
 </html>
diff --git a/src/index.md b/src/index.md
@@ -1,7 +1,7 @@
 ---
 layout: index.html
 title: Massimiliano Marcon
-subtitle: Product-focused engineer, creative coder, makes maps and clouds 
+subtitle: Product-focused engineer, creative coder, makes maps and clouds.
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut leo mattis, varius purus quis, vulputate mi. Nulla orci nunc, vehicula id lorem at, euismod pharetra arcu. Vestibulum bibendum elit nulla, quis laoreet arcu dapibus sed. Maecenas fermentum vel nibh venenatis convallis. Morbi eget purus non nulla consectetur pulvinar vitae sed est. Nulla fringilla, urna at egestas congue, nibh arcu hendrerit nisl, et pharetra nibh mi at quam. Morbi et tellus dolor. Duis ultricies odio vitae est placerat sollicitudin. Vestibulum dignissim viverra urna in facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer faucibus viverra accumsan. Cras interdum felis at varius facilisis. Cras pellentesque leo in turpis sagittis, sed consectetur enim condimentum. Aenean non tempus arcu, nec venenatis nunc. In consequat velit eget mauris aliquam luctus ut vitae justo.