added extra css classes for playground

2 files changed, 22 insertions, 10 deletions

diff --git a/themes/dj_blog/layouts/_default/list.html b/themes/dj_blog/layouts/_default/list.html
index 0b7f219..65771ef 100644
--- a/themes/dj_blog/layouts/_default/list.html
+++ b/themes/dj_blog/layouts/_default/list.html
@@ -25,20 +25,16 @@
                 {{ partial "sidebar.svg" . }}
             </div>
 
-            <div class="article-header-container">
-                <div class="article-header">
-                    <div class="publish-date" style="margin-top: 0px;">
+            <div class="playground-header-container">
+                <div class="playground-header">
+                    <div class="publish-date" style="margin-top: 0px; float: none">
                         <h3>{{ .Date.Format "02" }}</h3></br>{{ .Date.Format "January" | upper }}
                     </div>
                     <h1>{{ .Title }}</h1>
+                    <a href="#"><img id="alignJustify" src="/images/justify.svg"></a>
+                    <a href="#"><img id="alignLeft" src="/images/left.svg"></a>
                 </div>
             </div>
-            <div class="article-meta-inf">
-                <a href="/about/" rel="me">by {{ .Site.Author.name }} </a>  
-                <text> &nbsp; · &nbsp; {{ .ReadingTime }} minutes reading time</text>  
-                <a href="#"><img id="alignJustify" src="/images/justify.svg"></a>
-                <a href="#"><img id="alignLeft" src="/images/left.svg"></a>
-            </div>
             <div id="article-body">
                     {{ .Content }}
             </div>
diff --git a/themes/dj_blog/static/css/default.css b/themes/dj_blog/static/css/default.css
index d4cc01a..33bdc03 100644
--- a/themes/dj_blog/static/css/default.css
+++ b/themes/dj_blog/static/css/default.css
@@ -154,12 +154,29 @@
 	}
 }
 
+/* Playground page classes */
+.playground-header-container {
+	height: 140px; 
+	margin-top: 35px;
+}
+
+.playground-header {
+	max-width: 900px;
+	display: flex;  
+    margin-left: auto;
+    margin-right: auto;
+    padding-left: 25px;
+    padding-right: 25px;
+    align-items: center;
+}
+
 /* Single page classes */
 
 .article-header-container {
 	height: 140px; 
 	margin-top: 35px;
 	background-color: #4CABAB;
+	color: #EFFFFF;
 	box-shadow: 0 1px 5px black inset;
 }
 
@@ -171,7 +188,6 @@
     padding-left: 25px;
     padding-right: 25px;
     align-items: center;
-	color: #EFFFFF;
 }
 
 .article-header h1 {