stuff

liqd · Dec 12, 2022 · 2000002 · 2000002
1 parent 58f13e2
commit 2000002
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 28 deletions.
diff --git a/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html b/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html
@@ -2277,7 +2277,7 @@ <h2 id="cl-upload">Upload</h2>
                                 <div class="upload-wrapper__fields input-group">
                                     <input name="logo" id="id_logo" class="form-control form-control-file" type="file">
                                     <input name="__noname__" class="form-control form-control-file-dummy" placeholder="Select a picture from your local folder." tabindex="-1" id="text-id_logo" type="text">
-                                    <label for="id_logo" class="upload-wrapper__action input-group__after btn" title="Upload a picture">
+                                    <label for="id_logo" class="upload-wrapper__action input-group__after btn btn--primary" title="Upload a picture">
                                         <i class="fas fa-cloud-upload-alt" aria-label="Upload a picture"></i>
                                     </label>
                                 </div>

diff --git a/meinberlin/assets/scss/components/_input_group.scss b/meinberlin/assets/scss/components/_input_group.scss
@@ -1,9 +1,5 @@
 // FIXME: this only works with buttons if it is included *afterwards*
 
-// .input-group {
-//     display: flex;
-// }
-
 .input-group__input {
     flex: 1 1 auto;
     background-clip: unset;

diff --git a/meinberlin/assets/scss/components/_participation_tile.scss b/meinberlin/assets/scss/components/_participation_tile.scss
@@ -16,10 +16,10 @@
 }
 
 .participation-tile__list-container {
-    flex: 0 1 44vh;
+    flex: 0 1 auto;
 
     @media (min-width: $breakpoint-xs) {
-        flex-grow: 2;
+        flex: 0 2 44vh;
         overflow-y: visible;
     }
 }

diff --git a/meinberlin/assets/scss/components/_upload.scss b/meinberlin/assets/scss/components/_upload.scss
@@ -20,7 +20,7 @@
 .upload-wrapper__fields,
 .upload-wrapper__preview {
     margin-bottom: $padding;
-    position: relative;
+    // position: relative;
 }
 
 // This is actually a label that looks like a button.  It is used to trigger
@@ -39,17 +39,3 @@
     opacity: 0.2;
     filter: grayscale(100%);
 }
-
-.upload-wrapper__alert {
-    clear: left;
-}
-
-@media (min-width: $breakpoint) {
-    .upload-wrapper__fields {
-        // @include grid-span(5, 0, ("columns": 9));
-    }
-
-    .upload-wrapper__preview {
-        // @include grid-span(4, 5, ("columns": 9));
-    }
-}
diff --git a/meinberlin/templates/a4images/image_upload_widget.html b/meinberlin/templates/a4images/image_upload_widget.html
@@ -1,6 +1,6 @@
 {% load i18n %}
-<div class="upload-wrapper form-control-upload">
-    <div class="upload-wrapper__fields input-group">
+<div class="upload-wrapper form-control-upload row">
+    <div class="upload-wrapper__fields input-group col">
         {{ file_input }}
         {{ text_input }}
         {% if has_image_set and not is_required %}
@@ -11,21 +11,23 @@
             </label>
         {% else %}
             <label for="{{ id }}"
-                class="upload-wrapper__action input-group__after btn"
+                class="upload-wrapper__action input-group__after btn btn--primary"
                 title="{% trans 'Upload a picture' %}">
                 <i class="fas fa-cloud-upload-alt" aria-label="{% trans 'Upload a picture' %}"></i>
             </label>
         {% endif %}
     </div>
-    <div class="form-{{ id }} upload-wrapper__preview">
+    <div class="form-{{ id }} upload-wrapper__preview col">
         {{ checkbox_input }}
         <img id="{{ file_id }}"
              src="{% if has_image_set %}{{ file_url }}{% else %}data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs={% endif %}"
              data-upload-preview="{{ id }}"
              alt=""
         >
     </div>
-    <div class="alert alert--info upload-wrapper__alert" role="alert">
-        {% trans 'Your image will be uploaded/removed once you save your changes at the end of this page.' %}
+    <div class="col-12">
+        <div class="alert alert--info upload-wrapper__alert" aria-live="polite">
+            {% trans 'Your image will be uploaded/removed once you save your changes at the end of this page.' %}
+        </div>
     </div>
 </div>