Merge pull request #369 from maykinmedia/task-960-improve-invite-acce…

…pt-styling [#960] Fix/styling invite accept buttons
maykinmedia · Dec 9, 2022 · c5a353b · c5a353b
2 parents 85fe822 + 9da3a84
commit c5a353b
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/src/open_inwoner/accounts/templates/accounts/invite_accept.html b/src/open_inwoner/accounts/templates/accounts/invite_accept.html
@@ -10,5 +10,10 @@ <h1 class="h1">
     {% blocktranslate with inviter_name=object.inviter.get_full_name %}Accept invitation from {{ inviter_name }} and join Open Inwoner Platform {% endblocktranslate %}
 </p>
 
-{% form id="invite-form" form_object=form method="POST" submit_text=_("Aanvaard") secondary_href='root' secondary_text=_('Terug') secondary_icon='arrow_backward' secondary_icon_position="before" %}
+{% render_form id="invite-form" method="POST" form=form extra_classes="form--flex" %}
+    {% csrf_token %}
+    {% hidden form.accepted %}
+    {% form_actions primary_text=_("Aanvaard") primary_icon="arrow_forward" secondary_href='root' secondary_text=_('Terug') secondary_icon='arrow_backward' %}
+{% endrender_form %}
+
 {% endblock content %}
diff --git a/src/open_inwoner/scss/components/Form/Form.scss b/src/open_inwoner/scss/components/Form/Form.scss
@@ -24,6 +24,13 @@
     }
   }
 
+  &--flex {
+    .form__actions {
+      display: flex;
+      gap: var(--spacing-medium);
+    }
+  }
+
   /// Columns.
 
   @media (min-width: 768px) {