Formatting, added blog & about page content, fixed title link, updated baseurl

ProProgrammer · ProProgrammer · commit 819d46f850cc · 2020-04-12T23:13:01.000+05:30
Too many changes directly committing to master. In case of errors might
end up cherrypicking changes however did a manual round of testing to
confirm expected behavior

Made some formatting changes (background color, line-height,
font-family, etc.)
Added Blog and About page content
Fixed href attribute value for anchor tag in masthead-title
Updated baseurl to "/" in _config.yml so footer and masthead-title
can use it
diff --git a/_config.yml b/_config.yml
@@ -3,7 +3,6 @@ title: Deep Sukhwani
 # tagline: The Jekyll Butler
 url: https://deeps.dev
 paginate: 1
-baseurl: ""
 permalink: pretty
 
 # Gems
diff --git a/_data/navigation.yml b/_data/navigation.yml
@@ -0,0 +1,8 @@
+# Order matters, that's how it will appear on homepage
+
+- name: Blog
+  link: /blog
+
+- name: About
+  link: /about
+
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -8,10 +8,10 @@
     <div id="spotlight">
       {% if page.title != "Home" %}
         <header class="masthead">
-          <h3 class="masthead-title">
-            <a href="{{ site.baseurl }}/" title="Home">{{ site.title }}</a>
+          <div class="masthead-title">
+            <a href="{{ site.url }}" title="Home">{{ site.title }}</a>
             <small>{{ site.tagline }}</small>
-          </h3>
+          </div>
         </header>
       {% endif %}
 
@@ -20,7 +20,7 @@ <h3 class="masthead-title">
       <div id="home-footer">
         <p>
           &copy; <time datetime="{{ site.time | date_to_xmlschema }}">{{ site.time | date: '%Y' }}</time>.
-          All rights reserved. <a href="{{ site.baseurl }}">{{ site.author.name }}</a>
+          All rights reserved. <a href="{{ site.url }}" title="Home">{{ site.author.name }}</a>
         </p>
       </div>
     </div>
diff --git a/_layouts/page.html b/_layouts/page.html
@@ -3,6 +3,5 @@
 ---
 
 <article class="page">
-  <h1 class="page-title">{{ page.title }}</h1>
   {{ content }}
 </article>
diff --git a/_sass/_base.scss b/_sass/_base.scss
@@ -11,7 +11,7 @@ body {
   font-family: var(--body-font);
   font-size: var(--body-font-size);
   line-height: var(--body-line-height);
-  letter-spacing: .04em;
+  letter-spacing: var(--body-letter-spacing);
   color: var(--body-color);
   background-color: var(--body-bg);
   -webkit-text-size-adjust: 100%;
@@ -21,6 +21,7 @@ body {
 // No `:visited` state is required by default (browsers will use `a`)
 a {
   color: var(--link-color);
+  text-decoration: none;
 
   // `:focus` is linked to `:hover` for basic accessibility
   &:hover,
@@ -102,3 +103,19 @@ mark {
     margin-top: 0;
   }
 }
+
+#home-nav {
+  opacity: .8;
+
+  a {
+    display: block;
+    text-align: center;
+    margin-top: .5em;
+  }
+}
+
+.site-nav {
+  display: inline-block;
+  font-size: 1.5rem;
+  opacity: .8;
+}
diff --git a/_sass/_variables.scss b/_sass/_variables.scss
@@ -7,7 +7,7 @@
   --gray-500: #adb5bd;
   --gray-600: #868e96;
   --gray-700: #495057;
-  --gray-800: #343a40;
+  --gray-800: #494f5c;
   --gray-900: #212529;
 
   --red: #fa5252;
@@ -26,11 +26,12 @@
   --blue-400: #4dabf7;
   --yellow-100: #fff3bf;
 
-  --body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --body-font: "trebuchet ms", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   --body-font-size: 16px;
-  --body-line-height: 1.5;
+  --body-line-height: 1.6;
   --body-color: var(--gray-700);
   --body-bg: #fff;
+  --body-letter-spacing: 0.06em;
 
   --link-color: var(--blue);
   --link-hover-color: #1c7ed6;
diff --git a/about.md b/about.md
@@ -1,29 +1,21 @@
 ---
 layout: page
-title: About
 ---
 
-<p class="message">
-  Hey there! This page is included as an example. Feel free to customize it for your own use upon downloading. Carry on!
-</p>
+![Hey it's me, Deep, at my childhood home.](/assets/profile.jpg)
+Hi, I am Deep Sukhwani
 
-In the novel, *The Strange Case of Dr. Jekyll and Mr. Hyde*, Mr. Poole is Dr. Jekyll's virtuous and loyal butler. Similarly, Poole is an upstanding and effective butler that helps you build Jekyll themes. It's made by [@mdo](https://twitter.com/mdo).
+I am a qualified Chartered Accountant from ACCA, UK. I pivoted into Software Engineering discipline after completing
+ my accounting qualification.
 
-There are currently two themes built on Poole:
+I am a Senior Software Engineer at [Springboard](https://springboard.com){:target="_blank"} working on their backend web development
+ team. I have always been fascinated by technology and especially web frameworks and web focused innovations.
+ 
+I want to use this website to share a bit about myself, my everyday learning as I go through my life as a software
+ developer and hopefully get a chance to interact with like minded people. 
 
-- [Hyde](https://hyde.getpoole.com)
-- [Lanyon](https://lanyon.getpoole.com)
+It would be redundant to share my whole career journey here. I keep [my LinkedIn profile](https://www.linkedin.com/in
+/DeepSukhwani){:target="_blank"} fairly up to date.
 
-Learn more and contribute on [GitHub](https://github.com/poole).
-
-## Setup
-
-Some fun facts about the setup of this project include:
-
-- Built for [Jekyll](https://jekyllrb.com)
-- Developed on GitHub and hosted for free on [GitHub Pages](https://pages.github.com)
-- Coded with [Atom](https://atom.io), an amazing open source code editor
-
-Have questions or suggestions? Feel free to [open an issue on GitHub](https://github.com/poole/poole/issues/new) or [ask me on Twitter](https://twitter.com/mdo).
-
-Thanks for reading!
+If you like my website, you can follow or come say Hi to me on twitter [@deepsukhwani](https://twitter.com
+/deepsukhwani){:target="_blank"} and on [LinkedIn](https://www.linkedin.com/in/DeepSukhwani){:target="_blank"}.
diff --git a/assets/profile.jpg b/assets/profile.jpg
diff --git a/blog.html b/blog.html
@@ -0,0 +1,33 @@
+---
+layout: page
+title: Posts
+---
+
+<div class="posts">
+  {% for post in paginator.posts %}
+  <article class="post">
+    <h1 class="post-title">
+      <a href="{{ post.url | relative_url }}">
+        {{ post.title }}
+      </a>
+    </h1>
+
+    <time datetime="{{ post.date | date_to_xmlschema }}" class="post-date">{{ post.date | date_to_string }}</time>
+
+    {{ post.content }}
+  </article>
+  {% endfor %}
+</div>
+
+<div class="pagination">
+  {% if paginator.next_page %}
+    <a class="pagination-item older" href="{{ paginator.next_page_path | relative_url }}">Older</a>
+  {% else %}
+    <span class="pagination-item older">Older</span>
+  {% endif %}
+  {% if paginator.previous_page %}
+    <a class="pagination-item newer" href="{{ paginator.previous_page_path | prepend: relative_url }}">Newer</a>
+  {% else %}
+    <span class="pagination-item newer">Newer</span>
+  {% endif %}
+</div>
diff --git a/index.html b/index.html
@@ -16,6 +16,13 @@ <h1 id="home-title">{{ site.author.name }}</h1>
         {% endif %}
       {% endfor %}
     {% endif %}
+  </div>
 
-</div>
+  <div id="home-nav" class="site-nav">
+    <nav>
+    	{% for item in site.data.navigation %}
+        <a href="{{ item.link }}">{{ item.name }}</a>
+	    {% endfor %}
+    </nav>
+  </div>
 </div>
