add padding on all edited page

core/static/sas/album.scss

@@ -1,3 +1,7 @@
+.main {
+  box-sizing: border-box;
+  padding: 10px;
+}
 
 .navbar {
   margin-top: 10px;
@@ -131,6 +135,7 @@
 
     @media (max-width: 500px) {
       width: calc(50% - 5px);
+      height: 108px;
     }
 
     @media (max-width: 300px) {
@@ -170,6 +175,7 @@
 
       @media (max-width: 500px) {
         width: 100%;
+        height: 100%;
       }
 
       &:hover > .text {

core/static/user/user_detail.scss

@@ -1,8 +1,11 @@
 .main {
+  box-sizing: border-box;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  margin-top: 0 !important;
+  padding: 10px;
   width: 100%;
 }
 

core/static/user/user_preferences.scss

@@ -4,7 +4,7 @@
   gap: 2px;
 
   &-general {
-    >p {
+    > p {
       display: flex;
       flex-direction: row-reverse;
       justify-content: left;
@@ -39,3 +39,11 @@
     max-width: 100px;
   }
 }
+
+.justify {
+  text-align: justify;
+}
+
+.main {
+  padding: 10px;
+}

core/static/user/user_tools.scss

@@ -1,5 +1,6 @@
 main {
   box-sizing: border-box;
+  padding: 10px;
 }
 
 .container {
@@ -9,9 +10,7 @@ main {
   justify-content: center;
   gap: 10px;
 
-
+  > div {
-  >div {
-    padding: 10px;
     border-radius: 10px;
     background-color: rgba(0, 0, 0, .05);
     width: 210px;

core/templates/core/user_pictures.jinja

@@ -9,6 +9,7 @@
 {% endblock %}
 
 {% block content %}
+    <div class="main">
     {% if can_edit(profile, user) %}
         <button id="download_all_pictures", onclick=download_pictures()>{% trans %}Download all my pictures{% endtrans %}</button>
     {% endif %}
@@ -41,6 +42,7 @@
         </div>
         <br>
     {% endfor %}
+    </div>
 {% endblock %}
 
 {% block script %}

core/templates/core/user_preferences.jinja

@@ -9,36 +9,37 @@
 {% endblock %}
 
 {% block content %}
-<h2>{% trans %}Preferences{% endtrans %}</h2>
+    <div class="main">
-<h3>{% trans %}General{% endtrans %}</h3>
+        <h2>{% trans %}Preferences{% endtrans %}</h2>
-<form class="form form-general" action="" method="post" enctype="multipart/form-data">
+        <h3>{% trans %}General{% endtrans %}</h3>
+        <form class="form form-general" action="" method="post" enctype="multipart/form-data">
             {% csrf_token %}
             {{ form.as_p() }}
             <input class="form-submit-btn" type="submit" value="{% trans %}Save{% endtrans %}" />
-</form>
+        </form>
 
-<h3>{% trans %}Trombi{% endtrans %}</h3>
+        <h3>{% trans %}Trombi{% endtrans %}</h3>
 
-{% if trombi_form %}
+        {% if trombi_form %}
-<form class="form form-trombi" action="{{ url('trombi:user_tools') }}" method="post" enctype="multipart/form-data">
+            <form class="form form-trombi" action="{{ url('trombi:user_tools') }}" method="post" enctype="multipart/form-data">
                 {% csrf_token %}
                 {{ trombi_form.as_p() }}
                 <input class="form-submit-btn" type="submit" value="{% trans %}Save{% endtrans %}" />
-</form>
+            </form>
 
-{% else %}
+        {% else %}
-<p>{% trans trombi=user.trombi_user.trombi %}You already choose to be in that Trombi: {{ trombi }}.{% endtrans %}
+            <p>{% trans trombi=user.trombi_user.trombi %}You already choose to be in that Trombi: {{ trombi }}.{% endtrans %}
                 <br />
                 <a href="{{ url('trombi:user_tools') }}">{% trans %}Go to my Trombi tools{% endtrans %}</a>
-</p>
+            </p>
-{% endif %}
+        {% endif %}
 
 
-{% if profile.customer %}
+        {% if profile.customer %}
-<h3>{% trans %}Student cards{% endtrans %}</h3>
+            <h3>{% trans %}Student cards{% endtrans %}</h3>
 
-{% if profile.customer.student_cards.exists() %}
+            {% if profile.customer.student_cards.exists() %}
-<ul>
+                <ul>
                     {% for card in profile.customer.student_cards.all() %}
                     <li>
                         {{ card.uid }}
@@ -48,19 +49,21 @@
                         </a>
                     </li>
                     {% endfor %}
-</ul>
+                </ul>
-{% else %}
+            {% else %}
-<em>{% trans %}No student card registered.{% endtrans %}</em>
+                <em>{% trans %}No student card registered.{% endtrans %}</em>
-<p align="justify">{% trans %}You can add a card by asking at a counter or add it yourself here. If you want to manually
+                <p class="justify">
-    add a student card yourself, you'll need a NFC reader. We store the UID of the card which is 14 characters long.{%
+                    {% trans %}You can add a card by asking at a counter or add it yourself here. If you want to manually
-    endtrans %}</p>
+                    add a student card yourself, you'll need a NFC reader. We store the UID of the card which is 14 characters long.{% endtrans %}
-{% endif %}
+                </p>
+            {% endif %}
 
-<form class="form form-cards" action="{{ url('counter:add_student_card', customer_id=profile.customer.pk) }}"
+            <form class="form form-cards" action="{{ url('counter:add_student_card', customer_id=profile.customer.pk) }}"
                 method="post">
                 {% csrf_token %}
                 {{ student_card_form.as_p() }}
                 <input class="form-submit-btn" type="submit" value="{% trans %}Save{% endtrans %}" />
-</form>
+            </form>
-{% endif %}
+        {% endif %}
+    </div>
 {% endblock %}

sas/templates/sas/main.jinja

@@ -35,6 +35,7 @@
 {% endmacro %}
 
 {% block content %}
+    <div class="main">
         <h3>{% trans %}SAS{% endtrans %}</h3>
 
         {% if not user.is_authenticated %}
@@ -105,4 +106,5 @@
                 </form>
             {% endif %}
         {% endif %}
+    </div>
 {% endblock %}