pin reqs, css fix optimize

requirements.txt

@@ -23,5 +23,7 @@ Unidecode==1.3.6
 python-slugify
 
 webassets==2.0
+pelican-webassets==2.0.0
 libsass==0.21.0
 livereload==2.6.3
+cssmin==0.2.0

themes/solarized/static/css/main.css

@@ -51,7 +51,6 @@ article ul {
 .amp {color:#666; font-size:1.05em;font-family:"Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua",serif; font-style:italic;}
 .dquo {margin-left:-.38em;}
 
-
 @media screen and (min-width: 700px) {
   .parent-panel { padding-left:20%;width:100%; }
   .right-panel { position:relative;float:left;width:100%; }
@@ -59,7 +58,7 @@ article ul {
   .right-panel-content {
     border-left: 2px dashed #b58900;
     min-height: 96vh;
-      max-width: 60%;
+    max-width: 80%;
     padding-left: 0.75rem;
   }
   .left-panel {
@@ -70,6 +69,13 @@ article ul {
       margin-left:-101%;
       text-align:right;
   }
+  a {
+    padding: 4px;
+  }
+  
+  h2 a{
+    padding: 0;
+  }
 }
 @media screen and (max-width: 700px) {
   .parent-panel {
@@ -106,10 +112,13 @@ article ul {
     -webkit-order: 2;
     order: 2;
   }
+  .right-panel-content {
+    max-width: 100%;
+  }
 
   .left-panel li {
-    display: inline;
+    display: inline-block;
-    padding: 0.5rem;
+    padding: 0.75rem;
     white-space: nowrap;
   }
 
@@ -119,7 +128,17 @@ article ul {
   .social {
     display: none;
   }
+}
 
+@media screen and (max-width: 600px) {
+  .right-panel-content {
+    max-width: 80%;
+  }
+}
+@media screen and (min-width: 1200px) {
+  .right-panel-content {
+    max-width: 1000px;
+  }
 }
 
 .right-panel-content img {
@@ -136,7 +155,7 @@ article ul {
 }
 
 hr {
-  border: 2px dotted #b58900;;
+  border: 2px dotted #b58900;
   border-style: none none dashed;
 }
 
@@ -150,10 +169,10 @@ hr.end {
 
 .indent {
   font-size: 0.6rem;
-  margin-left: 5.1rem;
+  margin-left: 4.1rem;
 }
 
-h3.entry-title{
+header.entry-title{
   border-bottom: 1px dotted #b58900;
   padding-bottom: 0.25rem;
 }
@@ -173,3 +192,15 @@ ul ul {
 	list-style-type: circle;
 	padding-left: 2rem;
 }
+
+.entry-list-flex-container {
+    display: flex;
+    flex-wrap: wrap;
+    width: 100%;
+}
+
+.entry-list-flex-child.date {
+  flex-basis: fit-content;
+  margin-right:1rem;
+} 
+

themes/solarized/templates/base.html

@@ -6,6 +6,7 @@
         <meta charset="utf-8" />
         <meta name="generator" content="Pelican" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta name="description" content="Tyrel Souza's Blog about Tech, Programming, Automation, and Personal Things" />
 
         {% if FEED_ALL_ATOM %} <link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" /> {% endif %}
         {% if FEED_ALL_RSS %} <link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" /> {% endif %}

themes/solarized/templates/index.html

@@ -10,20 +10,33 @@
 {% for article in articles_page.object_list %}
   <li>
     <article class="hentry">
-      <header>
+      <header class="entry-title">
-        <h3 class="entry-title">
+        <div class="entry-list-flex-container">
+
+          <div class="entry-list-flex-child date">
+            <span class="small">
+              <time class="published" datetime="{{ article.date.isoformat() }}">
+                {{ article.date.isoformat().split("T")[0] }}
+              </time>
+            </span>
+          </div>
+
+          <div class="entry-list-flex-child">
+            <h2>
               <div>
-          <span class="small"><time class="published" datetime="{{ article.date.isoformat() }}"> {{ article.date.isoformat().split("T")[0] }} </time></span>
                 <span class="article-list-title"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></span>
               </div>
-          <span class="small indent">
+            </h2>
+            <span class="small">
               <span class="category">{{ article.category }}</span>
               <span class="">
                 {% for tag in article.tags|sort %}
-                <a href="{{ SITEURL }}/{{ tag.url }}">{{ tag }}</a>
+                  {{ tag }}
                 {% endfor %}</span>
             </span>
-        </h3>
+          </div>
+
+        </div>
       </header>
     </article>
   </li>