Adds news index page

1 files changed, 15 insertions, 33 deletions

diff --git a/public/main.css b/public/main.css
index 0b88656..1fdf2ab 100644
--- a/public/main.css
+++ b/public/main.css
@@ -287,47 +287,29 @@ ol li {
   }
 }
 
-.news-post {
-  margin-block: 1.5rem;
-  margin-inline: 0.5rem;
-  width: 30%;
-  border: solid 2px var(--text-color);
-  color: var(--text-color);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  padding-inline: var(--spacing-inline-sm);
-  padding-block: var(--spacing-block-sm);
-  transition:
-    background-color 300ms,
-    color 300ms,
-    transform 50ms;
-}
-
-.news-post:hover {
-  background-color: var(--background-highlight-color);
-  color: var(--text-highlight-color);
+.news-index {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-block-lg);
 }
 
-.news-post:active {
-  transform: scale(1.1, 1.1);
+.news-index__item {
+  display: block;
+  transition: background 300ms;
+  padding-block: var(--spacing-block-md);
+  padding-inline: var(--spacing-inline-sm);
 }
 
-.news-post__title {
-  padding-block: 0;
-  text-decoration: underline;
-  transition: text-decoration 300ms;
+.news-index__item:hover {
+  background: var(--background-highlight-color);
 }
 
-.news-post:hover .news-post__title {
-  text-decoration-color: transparent;
+.news-index__item :first-child {
+  margin-block-start: 0;
 }
 
-.news-post__summary {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  white-space: normal;
-  font-size: var(--font-size-sm);
+.news-index__item :last-child {
+  margin-block-end: 0;
 }
 
 footer {