Minor responsive changes (#8)

Minor responsive changes

Author: rohitrajhans

Diff for: _includes/post.html

@@ -1,8 +1,8 @@
 <div class="posts-wrapper animated fadeInRight">
     <div class="post">
-        <h4><a id="post-post-title" href="{{ post.url | prepend: site.baseurl }}"> {{ post.title }} </a>
+        <h4><a id="post-post-title" href="{{ post.url | prepend: site.baseurl }}"> {{ post.title }} </a> <br>
           <a href= "{{site.baseurl}}/posts/chronological/" id="post-post-details"><i class="fa fa-clock-o"></i> {{ post.date | date: "%-d %b %Y" }}</a>
-          <a href= "{{site.baseurl}}/{{post.author}}/" id="post-post-details"> <i class="fa fa-user"></i> {{ post.author }}</a>
+          <a href= "{{site.baseurl}}/{{post.author}}/" id="post-post-details"> <i class="fa fa-user"></i> {{ post.author }}</a> <br>
           <a href= "{{site.baseurl}}/posts/categories/" id="post-post-details"><i class="fa fa-tags"></i> {% for tag in post.tags %}{{ tag }} {% unless forloop.last %}, {% endunless %}{% endfor %}</a>
         </h4>
         <p> {% if post.desc.size > 0 %}

Diff for: _layouts/post.html

@@ -5,8 +5,8 @@
 <div class="container">
   <div class="inner-container post-page">
     <h4 class="heading">{{ page.title }}</h4>
-    <h5><a href= "{{site.baseurl}}/posts/chronological/"><i class="fa fa-clock-o"></i> {{ page.date | date: "%-d %b %Y" }} </a> | Written by
-        <a href= "{{site.baseurl}}/{{page.author}}/"><i class="fa fa-user"></i> {{ page.author }}</a>
+    <h5><a href= "{{site.baseurl}}/posts/chronological/"><i class="fa fa-clock-o"></i> {{ page.date | date: "%-d %b %Y" }} </a> |	 Written by
+        <a href= "{{site.baseurl}}/{{page.author}}/"><i class="fa fa-user"></i> {{ page.author }}</a> <br>
         <a href= "{{site.baseurl}}/posts/categories/"><i class="fa fa-tags"></i> {% for tag in page.tags %}{{ tag }} {% unless forloop.last %}, {% endunless %}{% endfor %}</a></h5>
 
     {{ content }}

Diff for: index.html

@@ -11,7 +11,7 @@
 
   <div class="content-grid-info">
 		 <div class="post-intro">
-        <h4><a id="post-title" href="{{ post.url | prepend: site.baseurl }}"> {{ post.title }} </a>
+        <h4><a id="post-title" href="{{ post.url | prepend: site.baseurl }}"> {{ post.title }} </a> <br>
            <a href= "{{site.baseurl}}/posts/chronological/" id="post-details"><i class="fa fa-clock-o"></i> {{ post.date | date: "%-d %b %Y" }}</a>
            <a href= "{{site.baseurl}}/{{post.author}}/" id="post-details"> <i class="fa fa-user"></i> {{ post.author }}</a>
            <a href= "{{site.baseurl}}/posts/categories/" id="post-details"><i class="fa fa-tags"></i> {% for tag in post.tags %}{{ tag }} {% unless forloop.last %}, {% endunless %}{% endfor %}</a>

Diff for: posts_cat.html

@@ -11,7 +11,7 @@
     <div class="switch">
       <h3><a href="{{ site.baseurl }}/posts/chronological/">Chronological</a></h3>
       <h2>|</h2>
-      <h3><a href="{{ site.baseurl }}//posts/categories/" id="categories">Categories</a></h3>
+      <h3 id="active"><a href="{{ site.baseurl }}//posts/categories/" id="categories">Categories</a></h3>
     </div>
 
 

Diff for: posts_chro.html

@@ -8,7 +8,7 @@
   <div class="inner-container posts">
 
     <div class="switch">
-      <h3><a href="{{ site.baseurl }}/posts/chronological/" id="chronological">Chronological</a></h3>
+      <h3 id="active"><a href="{{ site.baseurl }}/posts/chronological/" id="chronological">Chronological</a></h3>
       <h2>|</h2>
       <h3><a href="{{ site.baseurl }}/posts/categories/">Categories</a></h3>
     </div>

Diff for: public/gen.css

@@ -104,23 +104,25 @@ i{
 }
 
 #post-title{
-  font-size:1.9em;
+  font-size:1.5em;
   color:#00bcd4;
   margin-right:0.7em;
   display:inline-block;
   text-decoration:none;
   text-transform: uppercase;;
   font-family: 'Lato', sans-serif;
   font-weight:400;
+  padding-bottom: 0.4em;
 }
+
 #post-title:hover{
   color: #4a5054;
 }
 #post-details{
   color:#afafaf;
   font-family: 'Roboto', sans-serif;
   font-size:0.8em;
-  margin-bottom:1em;
+  margin-bottom:1.5em;
   cursor: default;
 }
 #post-details:hover{
@@ -227,7 +229,7 @@ i{
   color:#333;
   text-align: justify;
   text-align-last: left;
-  font-size:1.5em;
+  font-size:1.4em;
   font-weight: 300;
   line-height:1.4em;
   margin-bottom:1.5em;
@@ -334,7 +336,7 @@ i{
   display:inline-block !important;
   font-family: 'Lato', sans-serif;
   font-weight: 300;
-  font-size:2em;
+  font-size:2.2em;
   color:#3bcce4;
   font-style: italic;
   margin: 0.3em 0;
@@ -368,6 +370,7 @@ i{
 }
 
 
+
 #posts-broad-headings{
   /*categories heading i.e. the date and the tags*/
     font-size:1.8em;
@@ -436,7 +439,7 @@ i{
   color:#555;
   font-size:1em;
   line-height:1.5em;
-  margin-top: 0.3em;
+  margin-top: 1em;
   margin-bottom:0.5em;
 }
 
@@ -446,9 +449,9 @@ i{
   color:#3f3f3f;
   text-align: justify;
   text-align-last: left;
-  font-size:1.3em;
+  font-size:1.1em;
   font-weight: 400;
-  line-height:1.3em;
+  line-height:1.8em;
   padding: 1.8em 1.8em 2.6em 1.8em;
 }
 
@@ -767,6 +770,12 @@ tbody tr:nth-child(odd) th {
 strong, b{
   font-weight: 500 !important;
 }
+
+
+#active a{
+  color: #156775;
+  font-weight: 800;
+}
 /*----------------------------*/
 
 @media screen and (max-width: 1130px) {
@@ -830,3 +839,54 @@ strong, b{
     padding: 1.8em 0em;
   }
 }
+
+.post-page ul
+{
+  text-align: left;
+}
+
+/*------------------------ MEDIA QUERIES --------------------*/
+
+@media all and ( max-width: 768px )
+{
+  .post-page
+  {
+    font-size: 1em;
+    text-align: left;
+  }
+  .heading
+  {
+    font-size: 1.8em;
+  }
+  #post-details
+  {
+    margin-bottom: 1.2em;
+  }
+  .switch h3 a{
+      font-size: 1.5em;
+  }
+  .switch h2{
+    padding: 0;
+  }
+  .single-author
+  {
+    padding: 0.4em 0.2em;
+  }
+  .single-author h4 a{
+    display: inline;
+    margin-right: 0.5em;
+    font: 300 26px/1.8 Lato, sans-serif;
+  }
+  .author-intro{
+    font: 300 18px/1.8 Lato, sans-serif;
+    padding: 0;
+  }
+/*  .single-author h4 a::after{
+    content: "";
+    display: block;
+  }*/
+  .about-us p{
+    font-size: 1.2em;
+    padding: 0.2em;
+  }
+}