Improve responsiveness

sos-lapsikyla · Nov 24, 2024 · 7d3d0cb · 7d3d0cb
1 parent 73015d4
commit 7d3d0cb
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/src/landing/index.html b/src/landing/index.html
@@ -68,11 +68,11 @@ <h2 class="card-h2">Aalto</h2>
                     </div>
                     <div class="mentor-card-content">
                        <div class="mentor-card-story-container">
-                          <h2 class="black" localization-key="mentorCardMyStory"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardMyStory"></h2>
                           <p class="card-p">Olen nuorisokodista itsenäistynyt teini-ikäisen pojan vanhempi. Voin olla sinulle tukena opintoihin, itsenäistymiseen, jälkihuoltoon ja vanhemmuuteen liittyvissä asioissa.</p>
                        </div>
                        <div class="mentor-card-languages-container">
-                          <h2 class="black" localization-key="mentorCardSpokenLanguages"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardSpokenLanguages"></h2>
                           <div class="pill-container">
                              <div class="pill">
                                 <p class="card-p">Suomi</p>
@@ -83,7 +83,7 @@ <h2 class="black" localization-key="mentorCardSpokenLanguages"></h2>
                           </div>
                        </div>
                        <div class="mentor-card-skill-container">
-                          <h2 class="black" localization-key="mentorCardSkills"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardSkills"></h2>
                           <div class="pill-container">
                              <div class="pill">
                                 <p class="card-p">Lastensuojelu</p>
@@ -123,11 +123,11 @@ <h2 class="card-h2">Havu</h2>
                     </div>
                     <div class="mentor-card-content">
                        <div class="mentor-card-story-container">
-                          <h2 class="black" localization-key="mentorCardMyStory"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardMyStory"></h2>
                           <p class="card-p">Olen helsinkiläinen Havu. Voin olla sinulle tukena esimerkiksi mielenterveyteen liittyvissä pulmissa. Tuen sinua parhaani mukaan kuitenkin missä tahansa aiheessa.</p>
                        </div>
                        <div class="mentor-card-languages-container">
-                          <h2 class="black" localization-key="mentorCardSpokenLanguages"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardSpokenLanguages"></h2>
                           <div class="pill-container">
                              <div class="pill">
                                 <p class="card-p">Suomi</p>
@@ -138,7 +138,7 @@ <h2 class="black" localization-key="mentorCardSpokenLanguages"></h2>
                           </div>
                        </div>
                        <div class="mentor-card-skill-container">
-                          <h2 class="black" localization-key="mentorCardSkills"></h2>
+                          <h2 class="card-h2 black" localization-key="mentorCardSkills"></h2>
                           <div class="pill-container">
                              <div class="pill">
                                 <p class="card-p">Mielenterveys</p>

diff --git a/src/landing/styles.css b/src/landing/styles.css
@@ -366,10 +366,11 @@ footer {
 
   .middle-card {
     flex-direction: column-reverse;
+    height: auto;
   }
 
   .middle-right-content {
-    padding: 8px;
+    padding: 1rem;
   }
 
   .middle-left-content {
@@ -416,4 +417,8 @@ footer {
   .ylitse-logo {
     height: 8rem;
   }
+
+  .middle-bottom-footer {
+    padding: 1rem;
+  }
 }