decidim-system 0.27.4 → 0.28.0.rc5

data/app/views/decidim/system/devise/passwords/edit.html.erb

@@ -1,22 +1,19 @@
-<h2>Change your password</h2>
+<h2 class="h3"> <%= link_to t(".change_your_password") %></h2>
 
 <%= decidim_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put }) do |f| %>
-  <%= render "devise/shared/error_messages", resource: resource %>
+  <%= render "devise/shared/error_messages", resource: %>
   <%= f.hidden_field :reset_password_token %>
 
-  <div class="field">
+  <div class="form__wrapper">
     <% if @minimum_password_length %>
-      <em>(<%= @minimum_password_length %> characters minimum)</em><br>
+      <em><%= t(".minimum_characters", minimum: @minimum_password_length) %></em><br>
     <% end %>
     <%= f.password_field :password, autofocus: true, autocomplete: "off" %>
-  </div>
-
-  <div class="field">
     <%= f.password_field :password_confirmation, autocomplete: "off" %>
   </div>
 
-  <div class="actions">
-    <%= f.submit "Change my password" %>
+  <div class="form__wrapper-block">
+    <%= f.submit "Change my password", class: "button button__sm md:button__lg md:button__lg button__secondary" %>
   </div>
 <% end %>
 

data/app/views/decidim/system/devise/passwords/new.html.erb

@@ -1,14 +1,14 @@
-<h2>Forgot your password?</h2>
+<h2 class="h3"><%= link_to t(".forgot_your_password") %></h2>
 
 <%= decidim_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f| %>
-  <%= render "devise/shared/error_messages", resource: resource %>
+  <%= render "devise/shared/error_messages", resource: %>
 
-  <div class="field">
+  <div class="form__wrapper">
     <%= f.email_field :email, autofocus: true %>
   </div>
 
-  <div class="actions">
-    <%= f.submit "Send me reset password instructions" %>
+  <div class="form__wrapper-block">
+    <%= f.submit t(".send_me_reset_password_instructions"), class: "button button__sm md:button__lg md:button__lg button__secondary" %>
   </div>
 <% end %>
 

data/app/views/decidim/system/devise/sessions/new.html.erb

@@ -1,23 +1,21 @@
-<h2>Log in</h2>
+<h2 class="h3"><%= t("log_in", scope: "decidim.system.devise.shared.links") %></h2>
 
 <%= decidim_form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>
-  <div class="field">
+  <div class="form__wrapper">
     <%= f.email_field :email, autofocus: true %>
-  </div>
 
-  <div class="field">
     <%= f.password_field :password, autocomplete: "off" %>
-  </div>
 
-  <% if devise_mapping.rememberable? -%>
-    <div class="field">
+    <% if devise_mapping.rememberable? -%>
       <%= f.check_box :remember_me %>
-    </div>
-  <% end -%>
+    <% end -%>
+  </div>
 
-  <div class="actions">
-    <%= f.submit "Log in" %>
+  <div class="form__wrapper-block">
+    <%= f.submit t("log_in", scope: "decidim.system.devise.shared.links"), class: "button button__sm md:button__lg md:button__lg button__secondary" %>
   </div>
 <% end %>
 
-<%= render "decidim/system/devise/shared/links" %>
+<div class="flex flex-col [&>a]:text-secondary hover:[&>a]:underline [&>a]:w-fit [&>a]:mt-4">
+  <%= render "decidim/system/devise/shared/links" %>
+</div>

data/app/views/decidim/system/devise/shared/_links.html.erb

@@ -1,25 +1,19 @@
 <%- if controller_name != 'sessions' %>
-  <%= link_to "Log in", new_session_path(resource_name) %><br>
+  <%= link_to t(".log_in"), new_session_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.registerable? && controller_name != 'registrations' %>
-  <%= link_to "Sign up", new_registration_path(resource_name) %><br>
+  <%= link_to t(".sign_up"), new_registration_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.recoverable? && controller_name != 'passwords' && controller_name != 'registrations' %>
-  <%= link_to "Forgot your password?", new_password_path(resource_name) %><br>
+  <%= link_to t(".forgot_your_password?"), new_password_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.confirmable? && controller_name != 'confirmations' %>
-  <%= link_to "Didn't receive confirmation instructions?", new_confirmation_path(resource_name) %><br>
+  <%= link_to t(".did_not_receive_confirmation_instructions?"), new_confirmation_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.lockable? && resource_class.unlock_strategy_enabled?(:email) && controller_name != 'unlocks' %>
-  <%= link_to "Didn't receive unlock instructions?", new_unlock_path(resource_name) %><br>
-<% end -%>
-
-<%- if devise_mapping.omniauthable? %>
-  <%- current_organization.enabled_omniauth_providers.keys.each do |provider| %>
-    <%= link_to "Sign in with #{OmniAuth::Utils.camelize(provider)}", omniauth_authorize_path(resource_name, provider) %><br>
-  <% end -%>
+  <%= link_to t(".did_not_receive_unlock_instructions?"), new_unlock_path(resource_name) %>
 <% end -%>

data/app/views/decidim/system/oauth_applications/_form.html.erb

@@ -1,26 +1,11 @@
-<div class="row column">
+<div class="form__wrapper">
   <%= form.text_field :name %>
-</div>
-
-<div class="row column">
   <%= form.text_field :redirect_uri %>
-</div>
-
-<div class="row column">
   <%= form.select :decidim_organization_id,
-                Decidim::Organization.pluck(:name, :id),
-                { include_blank: t(".select_organization") },
-                { multiple: false } %>
-</div>
-
-<div class="row column">
+                  Decidim::Organization.pluck(:name, :id),
+                  { include_blank: t(".select_organization") },
+                  { multiple: false } %>
   <%= form.text_field :organization_name %>
-</div>
-
-<div class="row column">
   <%= form.text_field :organization_url %>
-</div>
-
-<div class="row column">
-  <%= form.upload :organization_logo, required: true %>
+  <%= form.upload :organization_logo, required: true, button_class: "button button__lg button__transparent-primary" %>
 </div>

data/app/views/decidim/system/oauth_applications/edit.html.erb

@@ -1,13 +1,13 @@
-<%= decidim_form_for(@form, html: { class: "form edit_oauth_application" }) do |f| %>
-  <div class="card">
-    <div class="card-divider">
-      <h2 class="card-title"><%= t ".title" %></h2>
-    </div>
-    <div class="card-section">
-      <%= render partial: "form", object: f %>
-    </div>
-  </div>
-  <div class="button--double form-general-submit">
-    <%= f.submit t(".save") %>
+<% add_decidim_page_title(t(".title")) %>
+
+<% provide :title do %>
+  <h1 class="h1"><%= t ".title" %></h1>
+<% end %>
+
+<%= decidim_form_for(@form) do |f| %>
+  <%= render partial: "form", object: f %>
+
+  <div class="form__wrapper-block">
+    <%= f.submit t(".save"), class: "button button__sm md:button__lg button__primary" %>
   </div>
 <% end %>

data/app/views/decidim/system/oauth_applications/index.html.erb

@@ -1,12 +1,12 @@
+<% add_decidim_page_title(t(".title")) %>
+
 <% provide :title do %>
-  <h2><%= t ".title" %></h2>
+  <h1 class="h1"><%= t ".title" %></h1>
 <% end %>
 
-<div class="actions title">
-  <%= link_to t("actions.new", scope: "decidim.system", name: t("models.oauth_application.name", scope: "decidim.system")), [:new, :oauth_application], class: "new" %>
-</div>
+<%= link_to t("actions.new_oauth_application", scope: "decidim.system"), [:new, :oauth_application], class: "button button__sm md:button__lg button__primary" %>
 
-<table class="stack">
+<table>
   <thead>
     <tr>
       <th></th>
@@ -20,20 +20,20 @@
     <% @oauth_applications.each do |oauth_application| %>
       <tr>
         <td>
-          <%= image_tag oauth_application.attached_uploader(:organization_logo).path %>
+          <%= image_tag oauth_application.attached_uploader(:organization_logo).path, class: "max-w-md" %>
         </td>
         <td>
           <%= link_to oauth_application.name, oauth_application %><br>
         </td>
         <td>
-          <%= link_to oauth_application.organization_name, oauth_application.organization %><br>
+          <%= link_to oauth_application.organization_name, edit_organization_path(oauth_application.organization) %><br>
         </td>
         <td>
           <%= l oauth_application.created_at, format: :short %>
         </td>
         <td class="actions">
           <%= link_to t("actions.edit", scope: "decidim.system"), [:edit, oauth_application] %>
-          <%= link_to t("actions.destroy", scope: "decidim.system"), oauth_application, method: :delete, class: "small alert button", data: { confirm: t(".confirm_delete") } %>
+          <%= link_to t("actions.destroy", scope: "decidim.system"), oauth_application, method: :delete, data: { confirm: t(".confirm_delete") } %>
         </td>
       </tr>
     <% end %>

data/app/views/decidim/system/oauth_applications/new.html.erb

@@ -1,13 +1,13 @@
-<%= decidim_form_for(@form, html: { class: "form new_oauth_application" }) do |f| %>
-  <div class="card">
-    <div class="card-divider">
-      <h2 class="card-title"><%= t ".title" %></h2>
-    </div>
-    <div class="card-section">
-      <%= render partial: "form", object: f %>
-    </div>
-  </div>
-  <div class="button--double form-general-submit">
-    <%= f.submit t(".save") %>
+<% add_decidim_page_title(t(".title")) %>
+
+<% provide :title do %>
+  <h1 class="h1"><%= t ".title" %></h1>
+<% end %>
+
+<%= decidim_form_for(@form) do |f| %>
+  <%= render partial: "form", object: f %>
+
+  <div class="form__wrapper-block">
+    <%= f.submit t(".save"), class: "button button__sm md:button__lg button__primary" %>
   </div>
 <% end %>

data/app/views/decidim/system/oauth_applications/show.html.erb

@@ -1,27 +1,26 @@
-<div class="card">
-  <div class="card-divider">
-    <h2 class="card-title"><%= @oauth_application.name %></h2>
-  </div>
-  <div class="card-section">
-    <dl>
-      <%= display_for @oauth_application,
-            { uid: :client_id },
-            { secret: :client_secret },
-            :organization_name,
-            :organization_url,
-            :redirect_uri %>
+<% add_decidim_page_title(@oauth_application.name) %>
 
-      <dt><%= display_label(@oauth_application, :authorize_url) %></dt>
-      <dd><%= decidim.oauth_authorization_url(host: @oauth_application.owner.host) %></dd>
+<% provide :title do %>
+  <h1 class="h1"><%= @oauth_application.name %></h1>
+<% end %>
 
-      <dt><%= display_label(@oauth_application, :site) %></dt>
-      <dd><%= decidim.root_url(host: @oauth_application.owner.host) %></dd>
+<dl>
+  <%= display_for @oauth_application,
+                  { uid: :client_id },
+                  { secret: :client_secret },
+                  :organization_name,
+                  :organization_url,
+                  :redirect_uri %>
 
-      <dt><%= display_label(@oauth_application, :authorized_tokens) %></dt>
-      <dd><%= @oauth_application.authorized_tokens.count %></dd>
+  <dt><%= display_label(@oauth_application, :authorize_url) %></dt>
+  <dd><%= decidim.oauth_authorization_url(host: @oauth_application.owner.host) %></dd>
 
-      <dt><%= display_label(@oauth_application, :authorization_url) %></dt>
-      <dd><%= decidim.oauth_authorization_url(host: @oauth_application.owner.host, client_id: @oauth_application.uid, redirect_uri: @oauth_application.redirect_uri, response_type: "code") %></dd>
-    </dl>
-  </div>
-</div>
+  <dt><%= display_label(@oauth_application, :site) %></dt>
+  <dd><%= decidim.root_url(host: @oauth_application.owner.host) %></dd>
+
+  <dt><%= display_label(@oauth_application, :authorized_tokens) %></dt>
+  <dd><%= @oauth_application.authorized_tokens.count %></dd>
+
+  <dt><%= display_label(@oauth_application, :authorization_url) %></dt>
+  <dd><%= decidim.oauth_authorization_url(host: @oauth_application.owner.host, client_id: @oauth_application.uid, redirect_uri: @oauth_application.redirect_uri, response_type: "code") %></dd>
+</dl>

data/app/views/decidim/system/organizations/_advanced_settings.html.erb

@@ -1,10 +1,12 @@
-<div class="row column">
-  <button type="button" class="button collapse hide"><%= t(".hide") %></button>
-  <button type="button" class="button expand"><%= t(".show") %></button>
-</div>
+<button id="advanced-settings-trigger" data-component="dropdown" data-target="advanced-settings-panel" type="button" class="button button__sm md:button__lg button__primary w-fit" aria-expanded="false">
+  <span><%= t(".show") %></span>
+  <span><%= t(".hide") %></span>
+</button>
 
-<div class="collapsible hide">
-  <%= render partial: "smtp_settings", locals: { f: f } %>
-  <%= render partial: "omniauth_settings", locals: { f: f } %>
-  <%= render partial: "file_upload_settings", locals: { f: f } %>
+<div id="advanced-settings-panel" aria-hidden="true">
+  <% %w(smtp_settings omniauth_settings file_upload_settings csp_settings).each do |partial| %>
+    <div class="border-2 rounded border-background p-4 form__wrapper mt-8 first:mt-0 last:pb-4">
+      <%= render partial:, locals: { f: } %>
+    </div>
+  <% end %>
 </div>

data/app/views/decidim/system/organizations/_csp_settings.html.erb

@@ -0,0 +1,12 @@
+<h3 class="h4"><%= t("decidim.system.models.organization.fields.content_security_policy") %></h3>
+
+<%= f.fields_for :content_security_policy do %>
+  <%= f.text_field "default-src".to_sym, label: t(".default_src"), help_text: t(".default_src_hint") %>
+  <%= f.text_field "img-src".to_sym, label: t(".img_src"), help_text: t(".img_src_hint") %>
+  <%= f.text_field "media-src".to_sym, label: t(".media_src"), help_text: t(".media_src_hint") %>
+  <%= f.text_field "script-src".to_sym, label: t(".script_src"), help_text: t(".script_src_hint") %>
+  <%= f.text_field "style-src".to_sym, label: t(".style_src"), help_text: t(".style_src_hint") %>
+  <%= f.text_field "frame-src".to_sym, label: t(".frame_src"), help_text: t(".frame_src_hint") %>
+  <%= f.text_field "font-src".to_sym, label: t(".font_src"), help_text: t(".font_src_hint") %>
+  <%= f.text_field "connect-src".to_sym, label: t(".connect_src"), help_text: t(".connect_src_hint") %>
+<% end %>

data/app/views/decidim/system/organizations/_file_upload_settings.erb

@@ -1,56 +1,33 @@
-<div class="fieldset">
-  <h4><%= t("decidim.system.models.organization.fields.file_upload_settings") %></h4>
-  <p><%= t(".intro") %></p>
+<h3 class="h4"><%= t("decidim.system.models.organization.fields.file_upload_settings") %></h3>
+<p class="help-text"><%= t(".intro") %></p>
 
-  <%= f.fields_for :file_upload_settings, f.object.file_upload_settings do |settings_form| %>
-    <%= settings_form.fields_for :allowed_file_extensions, OpenStruct.new(settings_form.object.allowed_file_extensions) do |extensions_form| %>
-      <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.allowed_file_extensions" %>
+<%= f.fields_for :file_upload_settings, f.object.file_upload_settings do |settings_form| %>
+  <%= settings_form.fields_for :allowed_file_extensions, OpenStruct.new(settings_form.object.allowed_file_extensions) do |extensions_form| %>
+    <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.allowed_file_extensions" %>
 
-      <h5><%= t(".file_extensions.title") %></h5>
-
-      <div class="field">
-        <%= extensions_form.text_field :default, class: "js-tags-container", label: t("default", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".file_extensions.default_hint") %></p>
-      </div>
-      <div class="field">
-        <%= extensions_form.text_field :image, class: "js-tags-container", label: t("image", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".file_extensions.image_hint") %></p>
-      </div>
-      <div class="field">
-        <%= extensions_form.text_field :admin, class: "js-tags-container", label: t("admin", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".file_extensions.admin_hint") %></p>
-      </div>
+    <%= field_set_tag f.label(t(".file_extensions.title"), nil, for: nil), class: "border-2 border-background p-4 form__wrapper" do %>
+      <%= extensions_form.text_field :default, class: "js-tags-container mt-4", label: t("default", scope: i18n_scope), help_text: t(".file_extensions.default_hint") %>
+      <%= extensions_form.text_field :image, class: "js-tags-container mt-4", label: t("image", scope: i18n_scope), help_text: t(".file_extensions.image_hint") %>
+      <%= extensions_form.text_field :admin, class: "js-tags-container mt-4", label: t("admin", scope: i18n_scope), help_text: t(".file_extensions.admin_hint") %>
     <% end %>
+  <% end %>
 
-    <%= settings_form.fields_for :allowed_content_types, OpenStruct.new(settings_form.object.allowed_content_types) do |extensions_form| %>
-      <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.allowed_content_types" %>
-
-      <h5><%= t(".content_types.title") %></h5>
-      <p><%= t(".content_types.intro_html") %></p>
+  <%= settings_form.fields_for :allowed_content_types, OpenStruct.new(settings_form.object.allowed_content_types) do |extensions_form| %>
+    <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.allowed_content_types" %>
 
-      <div class="field">
-        <%= extensions_form.text_field :default, class: "js-tags-container", label: t("default", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".content_types.default_hint") %></p>
-      </div>
-      <div class="field">
-        <%= extensions_form.text_field :admin, class: "js-tags-container", label: t("admin", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".content_types.admin_hint") %></p>
-      </div>
+    <%= field_set_tag f.label(t(".content_types.title"), nil, for: nil), class: "border-2 border-background p-4 form__wrapper" do %>
+      <p class="help-text"><%= t(".content_types.intro_html") %></p>
+      <%= extensions_form.text_field :default, class: "js-tags-container mt-4", label: t("default", scope: i18n_scope), help_text: t(".content_types.default_hint") %>
+      <%= extensions_form.text_field :admin, class: "js-tags-container mt-4", label: t("admin", scope: i18n_scope), help_text: t(".content_types.admin_hint") %>
     <% end %>
+  <% end %>
 
-    <%= settings_form.fields_for :maximum_file_size, OpenStruct.new(settings_form.object.maximum_file_size) do |extensions_form| %>
-      <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.maximum_file_size" %>
-
-      <h5><%= t(".file_sizes.title") %></h5>
+  <%= settings_form.fields_for :maximum_file_size, OpenStruct.new(settings_form.object.maximum_file_size) do |extensions_form| %>
+    <% i18n_scope = "#{f.object.class.i18n_scope}.attributes.#{settings_form.object.model_name.i18n_key}.maximum_file_size" %>
 
-      <div class="field">
-        <%= extensions_form.number_field :default, step: 0.1, min: 0, label: t("default", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".file_sizes.default_hint") %></p>
-      </div>
-      <div class="field">
-        <%= extensions_form.number_field :avatar, step: 0.1, min: 0, label: t("avatar", scope: i18n_scope) %>
-        <p class="help-text"><%= t(".file_sizes.avatar_hint") %></p>
-      </div>
+    <%= field_set_tag f.label(t(".file_sizes.title"), nil, for: nil), class: "border-2 border-background p-4 form__wrapper last:pb-4" do %>
+      <%= extensions_form.number_field :default, step: 0.1, min: 0, label: t("default", scope: i18n_scope), help_text: t(".file_sizes.default_hint") %>
+      <%= extensions_form.number_field :avatar, step: 0.1, min: 0, label: t("avatar", scope: i18n_scope), help_text: t(".file_sizes.avatar_hint") %>
     <% end %>
   <% end %>
-</div>
+<% end %>

data/app/views/decidim/system/organizations/_omniauth_provider.html.erb

@@ -1,23 +1,20 @@
 <% i18n_scope = "decidim.system.organizations.omniauth_settings" %>
 
-<div class="card">
-  <h5><%= provider_name(provider) %></h5>
-
+<%= field_set_tag f.label(provider_name(provider), nil, for: nil), class: "border-2 border-background p-4 form__wrapper last:pb-4" do %>
   <% if provider_enabled?(provider) %>
     <p class="help-text"><%= t("enabled_by_default", scope: i18n_scope) %></p>
   <% end %>
 
-  <div class="card-section">
-    <%= f.check_box(
-          "omniauth_settings_#{provider}_enabled",
-          label: t("enabled", scope: i18n_scope)
-        ) %>
+  <%= f.check_box(
+    "omniauth_settings_#{provider}_enabled",
+    label: t("enabled", scope: i18n_scope),
+    label_options: { class: "form__wrapper-checkbox-label" }
+  ) %>
 
-    <% Rails.application.secrets.dig(:omniauth, provider.to_sym).keys.select { |k| k != :enabled }.each do |setting| %>
-        <%= f.text_field("omniauth_settings_#{provider}_#{setting}", label: I18n.t(
-              ".#{setting}",
-              scope: [:icon, :icon_path].include?(setting) ? i18n_scope : "#{i18n_scope}.#{provider}"
-            )) %>
-    <% end %>
-  </div>
-</div>
+  <% Rails.application.secrets.dig(:omniauth, provider.to_sym).keys.select { |k| k != :enabled }.each do |setting| %>
+  <%= f.text_field("omniauth_settings_#{provider}_#{setting}", label: I18n.t(
+        ".#{setting}",
+        scope: [:icon, :icon_path].include?(setting) ? i18n_scope : "#{i18n_scope}.#{provider}"
+      )) %>
+  <% end %>
+<% end %>

data/app/views/decidim/system/organizations/_omniauth_settings.html.erb

@@ -1,11 +1,9 @@
-<div class="fieldset">
-  <h4><%= t("decidim.system.models.organization.fields.omniauth_settings") %></h4>
+<h3 class="h4"><%= t("decidim.system.models.organization.fields.omniauth_settings") %></h3>
 
-  <%= f.fields_for :omniauth_settings do %>
-    <% providers = Decidim::OmniauthProvider.available.keys %>
+<%= f.fields_for :omniauth_settings do %>
+  <% providers = Decidim::OmniauthProvider.available.keys %>
 
-    <% providers.each do |provider| %>
-      <%= render partial: "omniauth_provider", locals: { f: f, provider: provider } %>
-    <% end %>
+  <% providers.each do |provider| %>
+    <%= render partial: "omniauth_provider", locals: { f:, provider: } %>
   <% end %>
-</div>
+<% end %>

data/app/views/decidim/system/organizations/_smtp_settings.html.erb

@@ -1,23 +1,13 @@
-<div class="fieldset">
-  <h4><%= t("decidim.system.models.organization.fields.smtp_settings") %></h4>
-  <%= f.fields_for :smtp_settings do %>
-    <fieldset class="fieldset">
-      <legend><%= t(".fieldsets.sender") %></legend>
-      <%= f.email_field :from_email, placeholder: t(".placeholder.from_email") %>
-      <%= f.text_field :from_label, placeholder: t(".placeholder.from_label") %>
-      <p class="help-text"><%= t(".instructions.from_label") %></p>
-    </fieldset>
-    <div class="field">
-      <%= f.text_field :user_name %>
-    </div>
-    <div class="field">
-      <%= f.text_field :password %>
-    </div>
-    <div class="field">
-      <%= f.text_field :address %>
-    </div>
-    <div class="field">
-      <%= f.number_field :port %>
-    </div>
+<h3 class="h4"><%= t("decidim.system.models.organization.fields.smtp_settings") %></h3>
+
+<%= f.fields_for :smtp_settings do %>
+  <%= field_set_tag f.label(t(".fieldsets.sender"), nil, for: nil), class: "border border-background p-4" do %>
+    <%= f.email_field :from_email, placeholder: t(".placeholder.from_email") %>
+    <%= f.text_field :from_label, placeholder: t(".placeholder.from_label"), help_text: t(".instructions.from_label") %>
   <% end %>
-</div>
+
+  <%= f.text_field :user_name %>
+  <%= f.text_field :password %>
+  <%= f.text_field :address %>
+  <%= f.number_field :port %>
+<% end %>

data/app/views/decidim/system/organizations/edit.html.erb

@@ -1,38 +1,47 @@
+<% add_decidim_page_title(t(".title")) %>
+
+<% provide :title do %>
+  <h1 class="h1"><%= t ".title" %></h1>
+<% end %>
+
 <%= decidim_form_for(@form) do |f| %>
-  <div class="field">
+  <div class="form__wrapper">
     <%= f.text_field :name, autofocus: true %>
-  </div>
 
-  <div class="field">
     <%= f.text_field :host %>
-  </div>
 
-  <div class="field">
-    <%= f.text_area :secondary_hosts %>
-    <p class="help-text"><%= t(".secondary_hosts_hint") %></p>
-  </div>
+    <%= f.text_area :secondary_hosts, help_text: t(".secondary_hosts_hint") %>
 
-  <div class="field">
-    <%= f.label :force_authentication %>
-    <%= f.check_box :force_users_to_authenticate_before_access_organization %>
-  </div>
+    <%= field_set_tag f.label(:force_authentication, nil, for: nil) do %>
+      <%= f.check_box :force_users_to_authenticate_before_access_organization, label_options: { class: "form__wrapper-checkbox-label" } %>
+    <% end %>
 
-  <div class="field">
-    <%= f.label :users_registration_mode %>
-    <%= f.collection_radio_buttons :users_registration_mode,
-                                   Decidim::Organization.users_registration_modes,
-                                   :first,
-                                   ->(mode) { t("decidim.system.organizations.users_registration_mode.#{mode.first}") } %>
-  </div>
+    <%= field_set_tag f.label(:users_registration_mode, nil, for: nil) do %>
+      <%= f.collection_radio_buttons :users_registration_mode,
+                                     Decidim::Organization.users_registration_modes,
+                                     :first,
+                                     ->(mode) { t("decidim.system.organizations.users_registration_mode.#{mode.first}") } do |builder|
+                                      builder.label(for: nil, class: "form__wrapper-checkbox-label") { builder.radio_button(id: nil) + builder.text }
+                                    end %>
+    <% end %>
 
-  <div class="field">
-    <%= f.label :available_authorizations %>
-    <%= f.collection_check_boxes :available_authorizations, Decidim.authorization_workflows, :name, :description %>
-  </div>
+    <%= field_set_tag f.label(:available_authorizations, nil, for: nil) do %>
+      <%= f.collection_check_boxes :available_authorizations, Decidim.authorization_workflows, :name, :description do |builder|
+        builder.label(for: nil, class: "form__wrapper-checkbox-label") { builder.check_box(id: nil) + builder.text }
+      end %>
+    <% end %>
 
-  <%= render partial: "advanced_settings", locals: { f: f } %>
+    <%= render partial: "advanced_settings", locals: { f: } %>
+  </div>
 
-  <div class="actions">
-    <%= f.submit t("decidim.system.actions.save") %>
+  <div class="form__wrapper-block flex-col-reverse md:flex-row justify-between">
+    <% if @organization.users.first&.invitation_pending? %>
+      <%= link_to t(".resend_invitation"),
+                  resend_invitation_organization_path(@organization),
+                  method: :post,
+                  class: "button button__sm md:button__lg button__transparent-secondary",
+                  data: { confirm: t(".confirm_resend_invitation") } %>
+    <% end %>
+    <%= f.submit t("decidim.system.actions.save"), class: "button button__sm md:button__lg button__primary" %>
   </div>
 <% end %>

data/app/views/decidim/system/organizations/index.html.erb

@@ -1,8 +1,9 @@
+<% add_decidim_page_title(t(".title")) %>
+
 <% provide :title do %>
-  <h2><%= t ".title" %></h2>
+  <h1 class="h1"><%= t ".title" %></h1>
 <% end %>
 
-<div class="actions title">
-  <%= link_to t("actions.new", scope: "decidim.system", name: t("models.organization.name", scope: "decidim.system")), [:new, :organization], class: "new" %>
-</div>
+<%= link_to t("actions.new_organization", scope: "decidim.system"), [:new, :organization], class: "button button__sm md:button__lg button__primary" %>
+
 <%= render partial: "decidim/system/shared/organizations_list", locals: { organizations: @organizations } %>