added space for header, dates, and articles to dir space under articles

src/static/css/feature.css

@@ -27,7 +27,7 @@ ul { list-style-position: inside; }
 .grid {
     display: grid;
     grid-template-columns: auto 533px 267px auto;
-    grid-template-rows: 25px 90px repeat(4, 1fr) 40px auto;
+    grid-template-rows: 25px 90px repeat(4, 1fr) 200px auto;
     grid-column-gap: 0px;
     grid-row-gap: 0px;
 }
@@ -139,11 +139,6 @@ ul { list-style-position: inside; }
 
 /* Body */
 
-.dir-row {
-    grid-area: 7 / 1 / 8 / 5;
-    background-color: #F5D7E3;
-}
-
 .body-row {
     grid-area: 3 / 1 / 7 / 5;
     background-color: #b56c4d;
@@ -173,7 +168,6 @@ ul { list-style-position: inside; }
 .latest-text {
     background-color: #512806;
     text-align: left;
-
 }
 
 .disclosure {
@@ -181,6 +175,30 @@ ul { list-style-position: inside; }
     background-color: #ce6a85;
 }
 
+.dir-row {
+    grid-area: 7 / 1 / 8 / 5;
+    background-color: #F5D7E3;
+    display: grid;
+    grid-template-columns: auto;
+    grid-template-rows: 15% 35% auto;
+    grid-column-gap: 0px;
+    grid-row-gap: 0px; 
+}
+
+.dir-header { 
+    grid-area: 1 / 1 / 2 / 2; 
+}
+.dir-date { 
+    grid-area: 2 / 1 / 3 / 2;
+    overflow-x: scroll;
+    overflow-y: hidden;
+}
+.dir-articles { 
+    grid-area: 3 / 1 / 4 / 2; 
+    overflow-x: scroll;
+    overflow-y: hidden;
+} 
+
 .footer-row {
     grid-area: 8 / 1 / 9 / 5; 
     background-color: #A8577E;