front page styling update

froide_govplan/templates/cms/mypage.html

@@ -232,6 +232,12 @@
   }
 }
 
+.bg-body-tertiary {
+    margin-left: -50vw;
+    margin-right: -50vw;
+    padding-left: 50vw;
+    padding-right: 50vw;
+  }
     </style>
     {% block extra_css %}
     {% endblock %}

froide_govplan/templates/froide_govplan/base.html

@@ -129,10 +129,14 @@
     <main>
 
         {% if request.path == '/' %}
-        <h1 class="text-body-emphasis">Wir bringen Licht ins Dunkel der Behörden</h1>
+        <div style="margin: 6rem 0;">
-        <p class="fs-5 col-md-8">
+            
-            Mit unserem Verwaltungstracker können Sie die Arbeit der Stadtverwaltung Karlsruhe live verfolgen: Welche Vorhaben werden umgesetzt? Wo wird gebremst? Wie sieht der Stand in einzelnen Themenbereichen aus?
+            <h1 class="text-body-emphasis">Wir bringen Licht ins Dunkel der Behörden</h1>
-        </p>
+            <p class="fs-5 col-md-8">
+                Mit unserem Verwaltungstracker können Sie die Arbeit der Stadtverwaltung Karlsruhe live verfolgen: Welche Vorhaben werden umgesetzt? Wo wird gebremst? Wie sieht der Stand in einzelnen Themenbereichen aus?
+            </p>
+
+        </div>
         {% endif %}
         
         {% static_alias "govplan_header" %}
@@ -142,8 +146,7 @@
 
         {% if request.path == '/' %}
 
-        <hr class="featurette-divider">
+          <div class="row featurette py-5">
-          <div class="row featurette">
             <div class="col-md-7">
                 <h2 class="featurette-heading fw-normal lh-1">Mitmachen!</h2>
                 <p class="lead">
@@ -157,7 +160,7 @@
                 </p>
                 <p>
                     <a class="btn btn-primary" href="mailto:onny@project-insanity.org?subject=Verwaltungstracker">
-                        <i class="fa fa-envelope-o">&nbsp;</i>
+                        <i class="fa fa-envelope">&nbsp;</i>
                         onny@project-insanity.org
                     </a>
                 </p>
@@ -173,7 +176,7 @@
 
     </main>
 
-    <footer class="pt-5 my-5 text-body-secondary border-top">
+    <footer class="pt-5 text-body-secondary border-top">
 
         <div class="row">
             <div class="col-12 col-md-8">

froide_govplan/templates/froide_govplan/plugins/sections.html

@@ -9,7 +9,7 @@
     background-image: url('{% thumbnail section.image 600x300 crop subject_location=section.image.subject_location %}');
     background-size: cover;
     background-position: center;
-    height: 225px;
+    height: 185px;
     position: relative;
     display: flex;
     align-items: center;
@@ -37,6 +37,10 @@
     padding: 0 15px;
   }
 
+  .card-body {
+    padding: 0.3rem 1rem;
+  }
+
     /* Featurettes
 ------------------------- */
 
@@ -67,16 +71,10 @@
     font-size: 50px;
   }
 }
-
-@media (min-width: 62em) {
-  .featurette-heading {
-    margin-top: 7rem;
-  }
-}
 </style>
 
 
-<div class="album py-5">
+<div class="album py-5 bg-body-tertiary">
 
   <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
 
@@ -109,6 +107,7 @@
   </div>
 </div>
 
+<div class="py-5">
 
         <div class="row featurette">
             <div class="col-md-7">
@@ -142,4 +141,4 @@
             </div>
           </div>
 
-          <hr class="featurette-divider">
+</div>

froide_govplan/templates/froide_govplan/plugins/updates.html

@@ -2,7 +2,9 @@
 
 {% if request.path == '/' %}
 
-<div class="py-3">
+<div class="py-5 bg-body-tertiary">
+
+<div class="mb-4">
   <h1 class="text-body-emphasis">Aktuelles</h1>
   <p class="fs-5 col-md-8">
     Hier finden Sie aktuelle Artikel und Links zu Blogs zu den Fortschritten der Stadtverwaltung Karlsruhe.
@@ -93,6 +95,8 @@
   </button>
 </div>
 
+</div>
+
 {% else %}
 
 <div class="py-3" style="margin-top: 1rem; margin-bottom: -2rem;">