From 1389d4564627213c2b58c59fa4a5eff815dc71ae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Fri, 7 Mar 2025 15:55:30 +0100
Subject: [PATCH] Simplify like/unlike buttons styles on small screens

Since we're now using a flex layout, the styles are more robust when we
keep the percentages below each button even on small screens.
---
 app/assets/stylesheets/participation.scss      |  7 +------
 .../stylesheets/shared/in_favor_against.scss   | 18 +++---------------
 2 files changed, 4 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss
index 7f06d370c..c9f4cc37d 100644
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -605,14 +605,9 @@
     }
 
     .total-votes {
-      float: right;
+      display: block;
       font-weight: bold;
       line-height: $line-height * 2;
-
-      @include breakpoint(medium) {
-        display: block;
-        float: none;
-      }
     }
   }
 }
diff --git a/app/assets/stylesheets/shared/in_favor_against.scss b/app/assets/stylesheets/shared/in_favor_against.scss
index c7a59f7cb..0aaa86104 100644
--- a/app/assets/stylesheets/shared/in_favor_against.scss
+++ b/app/assets/stylesheets/shared/in_favor_against.scss
@@ -1,9 +1,5 @@
 .in-favor-against {
-  @include flex-with-gap($line-height * 0.25);
-
-  @include breakpoint(medium) {
-    @include flex-with-gap($line-height * 0.75);
-  }
+  @include flex-with-gap($line-height * 0.75);
 
   &,
   .in-favor,
@@ -77,16 +73,8 @@
   }
 
   .percentage {
-    display: inline-block;
+    display: block;
     font-size: $small-font-size;
-    line-height: $line-height * 2;
-    padding-right: calc($line-height / 2);
-    vertical-align: top;
-
-    @include breakpoint(medium) {
-      display: block;
-      line-height: $line-height;
-      padding-right: 0;
-    }
+    line-height: $line-height;
   }
 }