internal feedback suggestions

ProjectEvergreen · Oct 4, 2024 · a6a8d22 · a6a8d22
1 parent e2fd16d
commit a6a8d22
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 28 deletions.
diff --git a/src/components/blog-posts-list/blog-posts-list.js b/src/components/blog-posts-list/blog-posts-list.js
@@ -17,7 +17,9 @@ export default class BlogPostsList extends HTMLElement {
             const { title, route } = post;
             const { coverImage, abstract = "", published } = post.data;
             const date = new Date(published);
-            const time = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
+            const month = date.getMonth() + 1 < 10 ? `0${date.getMonth() + 1}` : date.getMonth();
+            const day = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate();
+            const time = `${date.getFullYear()}.${month}.${day}`;
             const coverBackground = coverImage ? coverImage : "/assets/greenwood-logo-leaf.svg";
             const coverBackgroundPadding =
               coverImage && coverImage !== "/assets/greenwood-logo-g.svg" ? "4px" : "14px";
@@ -35,10 +37,8 @@ export default class BlogPostsList extends HTMLElement {
                   />
 
                   <div class="${styles.postsListItemContentContainer}">
-                    <h2 class="${styles.postsListItemContentTitle}">
-                      ${title}
-                      <span class="${styles.postsListItemContentPublished}">(${time})</span>
-                    </h2>
+                    <h2 class="${styles.postsListItemContentTitle}">${title}</h2>
+                    <span class="${styles.postsListItemContentPublished}">Published: ${time}</span>
                     <p class="${styles.postsListItemContentAbstract}">${abstract}</p>
                   </div>
 

diff --git a/src/components/blog-posts-list/blog-posts-list.module.css b/src/components/blog-posts-list/blog-posts-list.module.css
@@ -47,18 +47,16 @@
 .postsListItemContentTitle {
   font-family: var(--font-primary-bold);
   font-size: var(--font-size-2);
-  /* display: inline-flex; */
   display: block;
   margin: 0 0 var(--size-1);
 }
 
 .postsListItemContentPublished {
-  /* font-family: var(--font-primary-bold); */
   font-size: 16px;
   display: block;
-  /* display: inline-flex; */
-  /* display: block;
-  margin: 0 0 var(--size-1); */
+  margin: 0 0 var(--size-3) 0;
+  padding: 0 0 var(--size-2) 0;
+  border-bottom: 1px solid var(--color-black);
 }
 
 .postsListItemContentAbstract {
@@ -81,16 +79,10 @@
   }
 
   .postsListItemCoverImage {
-    margin: var(--size-1);
-  }
-
-  .postsListItemContentTitle {
-    display: inline-flex;
-  }
-
-  .postsListItemContentPublished {
-    font-size: var(--font-size-1);
-    display: contents;
+    margin: 0 var(--size-1);
+    max-width: 12%;
+    max-height: var(--size-9);
+    min-height: var(--size-9);
   }
 }
 
@@ -101,14 +93,6 @@
     margin: 0 auto;
   }
 
-  .postsListItemCoverImage {
-    width: 20%;
-    max-width: 80px;
-    max-height: var(--size-9);
-    min-height: var(--size-9);
-    margin: var(--size-2);
-  }
-
   .postsListItemContentTitle {
     font-size: var(--font-size-3);
   }