From 9db0cfd009f4d9b9d8419b274f7eace8f7a72b41 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Sun, 27 Dec 2020 16:54:27 +0100
Subject: [PATCH] Reduce title size on small screens

It didn't fit the screen properly on goals having long words.
---
 app/assets/stylesheets/sdg/goals/show.scss | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/app/assets/stylesheets/sdg/goals/show.scss b/app/assets/stylesheets/sdg/goals/show.scss
index 717979d5e..ccb05deb3 100644
--- a/app/assets/stylesheets/sdg/goals/show.scss
+++ b/app/assets/stylesheets/sdg/goals/show.scss
@@ -23,6 +23,10 @@
         content: "";
         flex: 1;
         min-width: 100px;
+
+        @include breakpoint(small only) {
+          min-width: 75px;
+        }
       }
     }
 
@@ -35,6 +39,10 @@
       line-height: 1.1;
       text-transform: uppercase;
 
+      @include breakpoint(small only) {
+        font-size: rem-calc(map-get(map-get(map-get($header-styles, small), h2), font-size));
+      }
+
       .goal-code {
         font-size: 2.2em;
         letter-spacing: -0.1em;