From 9d96436992e7dedd8849c7520b628fb8b77ee6e3 Mon Sep 17 00:00:00 2001
From: rimu <3310831+rimu@users.noreply.github.com>
Date: Wed, 31 Jan 2024 20:35:47 +1300
Subject: [PATCH] masonry visual improvements

---
 app/static/structure.css  | 13 ++++++++++++-
 app/static/structure.scss |  9 ++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/app/static/structure.css b/app/static/structure.css
index c105f452..5f29f14b 100644
--- a/app/static/structure.css
+++ b/app/static/structure.css
@@ -709,14 +709,25 @@ fieldset legend {
 }
 .post_list_masonry .post_teaser .masonry_info .row .col a, .post_list_masonry_wide .post_teaser .masonry_info .row .col a {
   color: white;
+  padding-top: 6px;
+}
+@media (min-width: 1280px) {
+  .post_list_masonry .post_teaser .masonry_info .row .col a, .post_list_masonry_wide .post_teaser .masonry_info .row .col a {
+    padding-top: 0;
+  }
 }
 .post_list_masonry .post_teaser .masonry_info .row .col .upvote_button, .post_list_masonry .post_teaser .masonry_info .row .col .downvote_button, .post_list_masonry_wide .post_teaser .masonry_info .row .col .upvote_button, .post_list_masonry_wide .post_teaser .masonry_info .row .col .downvote_button {
   display: inline;
   color: white;
-  padding-top: 5px;
+  padding-top: 10px;
   width: 50%;
   position: relative;
 }
+@media (min-width: 1280px) {
+  .post_list_masonry .post_teaser .masonry_info .row .col .upvote_button, .post_list_masonry .post_teaser .masonry_info .row .col .downvote_button, .post_list_masonry_wide .post_teaser .masonry_info .row .col .upvote_button, .post_list_masonry_wide .post_teaser .masonry_info .row .col .downvote_button {
+    padding-top: 5px;
+  }
+}
 .post_list_masonry .post_teaser .masonry_info .row .col .upvote_button .htmx-indicator, .post_list_masonry .post_teaser .masonry_info .row .col .downvote_button .htmx-indicator, .post_list_masonry_wide .post_teaser .masonry_info .row .col .upvote_button .htmx-indicator, .post_list_masonry_wide .post_teaser .masonry_info .row .col .downvote_button .htmx-indicator {
   position: absolute;
   width: 20px;
diff --git a/app/static/structure.scss b/app/static/structure.scss
index 6113086f..160b984d 100644
--- a/app/static/structure.scss
+++ b/app/static/structure.scss
@@ -337,12 +337,19 @@ nav, etc which are used site-wide */
 
           a {
             color: white;
+            padding-top: 6px;
+            @include breakpoint(laptop) {
+              padding-top: 0;
+            }
           }
 
           .upvote_button, .downvote_button {
             display: inline;
             color: white;
-            padding-top: 5px;
+            padding-top: 10px;
+            @include breakpoint(laptop) {
+              padding-top: 5px;
+            }
             width: 50%;
             position: relative;