decidim-elections 0.27.5 → 0.28.0.rc4

data/app/views/decidim/elections/votes/_new_confirm_step.html.erb

@@ -1,53 +1,65 @@
-<%= render("focus_header", header_title: t("decidim.elections.votes.header.confirm")) %>
+<div class="election-question__intro">
+  <h2 class="h3">
+    <%= t("decidim.elections.votes.confirm.header") %>
+  </h2>
 
-<div class="focus__content evote">
-  <div class="row">
-    <h1 class="heading2">
-      <%= t("decidim.elections.votes.confirm.header") %>
-    </h1>
-    <p>
-      <%= t("decidim.elections.votes.confirm.intro").html_safe %>
+  <p class="election-question__description">
+    <%= t("decidim.elections.votes.confirm.intro").html_safe %>
+  </p>
+</div>
+
+<% questions.each_with_index do |question, question_index| %>
+  <div class="election-question__answer">
+    <p class="election-question__counter">
+      <%= t("decidim.elections.votes.new.question_steps", current_step: question_index + 1, total_steps: questions_count) %>
     </p>
 
-    <dl class="evote__confirm">
-      <dt>
-        <% questions.each_with_index do |question, question_index| %>
-          <strong class="evote__confirm-label">
-            <%= t("decidim.elections.votes.confirm.question", count: question_index + 1) %>:
-           </strong>
-          <strong>
-            <%= translated_attribute(question.title) %>
-          </strong>
-          <dd id="edit-step-<%= question_index+1 %>">
-            <strong class="evote__confirm-label">
-              <%= t("decidim.elections.votes.confirm.answer") %>
-              (<%= link_to(
-                  "#{t("decidim.elections.votes.confirm.edit")}<span class='show-for-sr'>
-                    #{t("decidim.elections.votes.confirm.answer_number", number: question_index + 1)}</span>".html_safe,
-                  "#",
-                  class: "evote__edit-answer",
-                  data: {
-                    toggle: ["step-#{question_index}", "step-#{questions_count}"].join(" ")
-                  }
-                ) %>):
-            </strong>
-            <ul>
-              <% question.answers.each do |answer| %>
-                <li class="confirmed_answer hide" id="<%= answer.slug %>">
-                  <%= translated_attribute(answer.title) %>
-                </li>
-              <% end %>
-              <% if question.nota_option? %>
-                <li class="<%= "hide nota_input_question-#{question.id}" %>">
-                  <%= t("decidim.elections.votes.confirm.nota_option") %>
-                </li>
-              <% end %>
-            </ul>
-          </dd>
+    <p class="h4">
+      <%= translated_attribute(question.title) %>
+    </p>
+
+    <div id="edit-step-<%= question_index + 1 %>" class="election-question__answer-option">
+      <span>
+        <% question.answers.each do |answer| %>
+          <span id="<%= answer.slug %>">
+            <%= translated_attribute(answer.title) %>
+          </span>
+        <% end %>
+        <% if question.nota_option? %>
+          <span id="<%= "nota_input_question-#{question.id}" %>">
+            <%= t("decidim.elections.votes.confirm.nota_option") %>
+          </span>
         <% end %>
-      </dt>
-    </dl>
+      </span>
+
+      <button class="button button__lg button__text-secondary" data-toggle="<%= ["step-#{question_index}", "step-confirm"].join(" ") %>">
+        <span class="underline"><%= t("decidim.elections.votes.confirm.edit") %></span>
+        <span class="sr-only"><%= t("decidim.elections.votes.confirm.answer_number", number: question_index + 1) %></span>
+      </button>
+    </div>
   </div>
-</div>
+<% end %>
 
-<%= render("new_confirm_step_footer") %>
+<div class="form__wrapper-block flex-col-reverse md:flex-row justify-between">
+  <%= button_tag(
+    t("decidim.elections.votes.voting_step.back"),
+    type: "button",
+    class: "button button__sm md:button__lg button__transparent-secondary",
+    id: "back-step-#{questions_count - 1}",
+    data: {
+      toggle: ["step-#{questions_count - 1}", "step-confirm"].join(" ")
+    }
+  ) %>
+
+  <%= button_tag(
+    class: "button button__sm md:button__lg button__secondary",
+    type: "button",
+    id: "next-encrypting",
+    data: {
+      toggle: ["step-encrypting", "step-confirm"].join(" ")
+    }
+  ) do %>
+    <span><%= t("decidim.elections.votes.confirm.confirm") %></span>
+    <%= icon "arrow-right-line" %>
+  <% end %>
+</div>

data/app/views/decidim/elections/votes/_new_encrypting_step.html.erb

@@ -1,20 +1,9 @@
-<%= render("focus_header", header_title: t("decidim.elections.votes.header.encrypting")) %>
-<div class="focus__content evote">
-  <div class="row">
-    <h1 class="heading2">
-      <%= t("decidim.elections.votes.encrypting.header") %>
-    </h1>
-    <div class="evote__encrypting" aria-hidden="true">
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-    </div>
-    <p>
-      <%= t("decidim.elections.votes.encrypting.text") %>
-    </p>
-  </div>
+<div class="flex flex-col items-center gap-14 py-14">
+  <h1 class="h1">
+    <%= t("decidim.elections.votes.encrypting.header") %>
+  </h1>
+  <%= icon "fingerprint-line", class: "w-40 h-40 text-tertiary animate-pulse fill-current" %>
+  <p class="text-lg font-semibold text-gray-2">
+    <%= t("decidim.elections.votes.encrypting.text") %>
+  </p>
 </div>

data/app/views/decidim/elections/votes/_new_question.html.erb

@@ -1,49 +1,33 @@
-<h1 class="heading2">
-  <%= translated_attribute(question.title) %>
-</h1>
-<%= content_tag(:p, t("decidim.elections.votes.new.answer_choices", choices: question.max_selections)) if question.max_selections > 1 %>
-
-<div class="evote__options" data-max-selection="<%= question.max_selections %>" data-min-selection="<%= question.min_selections %>">
+<div id="<%= dom_id(question) %>" class="election-question__container" data-max-selection="<%= question.max_selections %>" data-min-selection="<%= question.min_selections %>">
   <% ordered_answers(question).each do |answer| %>
-    <%= label_tag nil, data: { "disabled-by": "#check-nota" }, class: "evote__check evote__card" do %>
+    <%= label_tag nil, data: { "disabled-by": "check-nota" }, class: "election-question" do %>
       <% if question.max_selections == 1 %>
         <%= radio_button_tag question.slug, answer.slug, false, class: "answer_input" %>
       <% else %>
         <%= check_box_tag question.slug, answer.slug, false, class: "answer_input" %>
       <% end %>
 
-      <span class="evote__check-label">
-        <%= translated_attribute(answer.title) %>
-        <% if more_information?(answer) %>
-          <span class="evote__check-extra">
-            <button type="button" class="link" data-toggle="show-focus-modal-<%= answer.slug %>">
-              <%= t("decidim.elections.votes.new.more_information") %>
-            </button>
-          </span>
-        <% end %>
-      </span>
+      <%= translated_attribute(answer.title) %>
+
+      <% if more_information?(answer) %>
+        <button type="button" class="button button__sm button__text-secondary ml-auto" data-dialog-open="show-focus-modal-<%= answer.slug %>">
+          <%= t("decidim.elections.votes.new.more_information") %>
+        </button>
+      <% end %>
     <% end %>
 
-    <%= render("new_question_modal", answer: answer) if more_information?(answer) %>
+    <%= render("new_question_modal", answer:) if more_information?(answer) %>
   <% end %>
 
   <% if question.nota_option? %>
-    <%= label_tag nil, nil, class: "evote__check evote__card" do %>
+    <%= label_tag nil, nil, class: "election-question" do %>
       <% if question.max_selections == 1 %>
         <%= radio_button_tag question.slug, "nota_input_#{question.slug}", false, class: "nota_input" %>
       <% else %>
         <%= check_box_tag question.slug, "nota_input_#{question.slug}", false, { class: "nota_input", id: "check-nota", data: { "disable-check": "" } } %>
       <% end %>
 
-      <span class="evote__check-label" id="nota_input">
-        <%= t("decidim.elections.votes.new.nota_option") %>
-      </span>
+      <%= t("decidim.elections.votes.new.nota_option") %>
     <% end %>
   <% end %>
 </div>
-
-<% if question.max_selections > 1 %>
-  <div class="evote__counter">
-    <%= t("votes.new.selections", scope:"decidim.elections", selected: "<strong class='evote__counter-num evote__counter-min'></strong>", max_selections: "<span class='evote__counter-num'>#{question.max_selections}</span>").html_safe %>
-  </div>
-<% end %>

data/app/views/decidim/elections/votes/_new_question_modal.html.erb

@@ -1,29 +1,28 @@
-<div class="reveal" id="show-focus-modal-<%= answer.slug %>" data-reveal>
-  <div class="reveal__header">
-    <h3 class="reveal__title"><%= translated_attribute(answer.title) %></h3>
-    <button class="close-button" data-close aria-label="Close modal"
-      type="button">
-      <span aria-hidden="true">&times;</span>
-    </button>
-  </div>
-  <div class="row m-bottom">
-    <div class="columns">
+<%= decidim_modal id: "show-focus-modal-#{answer.slug}", class: "election-question__modal" do %>
+  <div data-dialog-container>
+    <%= icon "arrow-right-line" %>
+
+    <h2 class="h2" id="dialog-title-show-focus-modal-<%= answer.slug %>" data-dialog-title>
+      <%= translated_attribute(answer.title) %>
+    </h2>
+
+    <div class="election-question__modal-explanation">
       <% if answer.photos.any? %>
-        <div class="section">
+        <div class="election-question__modal-grid">
           <% answer.photos.each do |photo| %>
-            <%= image_tag photo.thumbnail_url, class:"thumbnail", alt: strip_tags(translated_attribute(photo.title)) %>
+            <%= image_tag photo.thumbnail_url, alt: strip_tags(translated_attribute(photo.title)) %>
           <% end %>
         </div>
       <% end %>
+
       <% if answer.description %>
-        <div class="section">
+        <div class="editor-content">
           <%== translated_attribute(answer.description) %>
         </div>
       <% end %>
-    </div>
-    <div class="section">
+
       <% if answer.proposals.any? %>
-        <h4><%= t("decidim.elections.votes.modal.proposal_header") %></h4>
+        <h3 class="h4"><%= t("decidim.elections.votes.modal.proposal_header") %></h3>
         <ul>
           <% answer.proposals.each do |proposal| %>
             <li>
@@ -36,11 +35,9 @@
       <% end %>
     </div>
   </div>
-  <div class="row">
-    <div class="columns medium-4 medium-centered">
-      <button class="button expanded" data-close>
-        <%= t("decidim.elections.votes.modal.close") %>
-      </button>
-    </div>
+  <div data-dialog-actions>
+    <button data-dialog-close="show-focus-modal-<%= answer.slug %>" class="button button__sm md:button__lg button__secondary">
+      <%= t("decidim.elections.votes.modal.close") %>
+    </button>
   </div>
-</div>
+<% end %>

data/app/views/decidim/elections/votes/_onboarding_modal.html.erb

@@ -1,25 +1,17 @@
-<div class="reveal" data-reveal id="onboarding-modal">
-  <div class="reveal__header">
-    <h3 class="reveal__title"><%= t("decidim.elections.votes.onboarding_modal.title") %></h3>
-    <button class="close-button" data-close aria-label="<%= t("decidim.elections.votes.onboarding_modal.close") %>">
-      <span aria-hidden="true">&times;</span>
-    </button>
+<%= decidim_modal id: "onboarding-modal", data: { "is-open": true } do %>
+  <div data-dialog-container>
+    <%= icon "error-warning-line" %>
+    <h3 class="h3" id="dialog-title-onboarding-modal" data-dialog-title>
+      <%= t("decidim.elections.votes.onboarding_modal.title") %>
+    </h3>
+    <p id="dialog-desc-onboarding-modal"><%= t("decidim.elections.votes.onboarding_modal.description") %></p>
   </div>
-  <p>
-    <%= t("decidim.elections.votes.onboarding_modal.description") %>
-  </p>
-  <div class="row mt-sm">
-    <div class="columns medium-8 medium-offset-2">
-      <%= link_to decidim.new_user_registration_path, class: "button button--sc expanded" do %>
-        <%= t("decidim.elections.votes.onboarding_modal.create_account") %>
-      <% end %>
-      <div class="text-center">
-        <button class="link" data-close type="button"><%= t("decidim.elections.votes.onboarding_modal.no_account") %></button>
-      </div>
-    </div>
+  <div data-dialog-actions>
+    <button data-dialog-close="onboarding-modal" class="button button__sm md:button__lg button__transparent-secondary">
+      <%= t("decidim.elections.votes.onboarding_modal.no_account") %>
+    </button>
+    <%= link_to decidim.new_user_registration_path, class: "button button__sm md:button__lg button__secondary" do %>
+      <%= t("decidim.elections.votes.onboarding_modal.create_account") %>
+    <% end %>
   </div>
-</div>
-
-<% content_for :js_content do %>
-  <%= javascript_pack_tag "decidim_elections_onboarding" %>
 <% end %>

data/app/views/decidim/elections/votes/_show_casted.html.erb

@@ -1,36 +1,34 @@
-<%= render("focus_header", header_title: t("decidim.elections.votes.header.confirmed")) %>
+<div class="flex justify-center">
+  <h1 class="title-decorator my-12">
+    <%= t("decidim.elections.votes.confirmed.header") %>
+  </h1>
+</div>
+
+<div class="space-y-4 text-center">
+  <p class="h4"><%= t("decidim.elections.votes.confirmed.lead") %></p>
+
+  <p class="election-question__description">
+    <%= t("decidim.elections.votes.confirmed.text") %>
+  </p>
 
-<div class="focus__content evote ballot_confirmed">
-  <div class="row">
-    <h1 class="heading2">
-      <%= t("decidim.elections.votes.confirmed.header") %>
-    </h1>
+  <code class="block"><%= h(params[:id]) %></code>
 
-    <h2 class="h4"><%= t("decidim.elections.votes.confirmed.lead") %></h2>
-    <div class="evote__content">
-      <%= t("decidim.elections.votes.confirmed.text", e_vote_poll_id: h(params[:id])).html_safe %>
-      <p>
-        <%= t("decidim.elections.votes.confirmed.verify_link", link: election_vote_verify_path(election, vote_id: params[:id])).html_safe %>
-      </p>
-    </div>
+  <p class="election-question__description">
+    <%= t("decidim.elections.votes.confirmed.verify_link", link: election_vote_verify_path(election, vote_id: params[:id])).html_safe %>
+  </p>
 
-    <% if params[:token] && valid_questionnaire? %>
-      <div>
-        <p class="text-small">
-          <%= t("decidim.elections.votes.confirmed.experience") %>
-        </p>
-      </div>
-      <div class="button">
-        <%= link_to t("decidim.elections.votes.confirmed.feedback"), election_feedback_path(election, hash: params[:id], token: params[:token]) %>
-      </div>
-    <% end %>
+  <% if params[:token] && valid_questionnaire? %>
+    <p class="election-question__description">
+      <%= t("decidim.elections.votes.confirmed.experience") %>
+      <%= link_to t("decidim.elections.votes.confirmed.feedback"), election_feedback_path(election, hash: params[:id], token: params[:token]) %>
+    </p>
+  <% end %>
 
-    <% if !valid_questionnaire? && current_user.nil? %>
-      <%= render partial: "decidim/elections/votes/onboarding_modal" %>
-    <% end %>
+  <% if !valid_questionnaire? && current_user.nil? %>
+    <%= render partial: "decidim/elections/votes/onboarding_modal" %>
+  <% end %>
 
-    <%= link_to :elections, class: valid_questionnaire? ? "" : "button" do %>
-      <%= t("decidim.elections.votes.confirmed.back") %>
-    <% end %>
-  </div>
+  <%= link_to :elections, class: "button button__lg button__secondary" do %>
+    <span><%= t("decidim.elections.votes.confirmed.back") %></span>
+  <% end %>
 </div>

data/app/views/decidim/elections/votes/_show_casting.html.erb

@@ -1,29 +1,22 @@
-<%= render("focus_header", header_title: t("decidim.elections.votes.header.casting")) %>
-<div class="focus__content evote casting-vote-wrapper"
+<div id="casting-vote-wrapper"
   data-api-endpoint-url="<%= bulletin_board_server %>"
   data-message-id="<%= vote.message_id %>">
-  <div class="row">
-    <h1 class="heading2">
+
+  <div class="flex justify-center">
+    <h1 class="title-decorator my-12">
       <%= t("decidim.elections.votes.casting.header") %>
     </h1>
-    <div class="evote__casting" aria-hidden="true">
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-      <div class="evote__dot"></div>
-    </div>
-    <p>
+  </div>
+
+  <div class="space-y-4 text-center">
+    <%= icon "fingerprint-line", class: "w-40 h-40 text-tertiary animate-pulse fill-current mx-auto" %>
+
+    <p class="election-question__description">
       <%= t("decidim.elections.votes.casting.text") %>
     </p>
+
+    <%= form_tag election_vote_path(election, id: vote.encrypted_vote_hash), method: :patch, class: "update_vote_status" %>
   </div>
-  <%= form_tag election_vote_path(election, id: vote.encrypted_vote_hash), method: :patch, class: "update_vote_status" %>
 </div>
 
 <%= render "decidim/elections/shared/broken_promises_modal" %>
-
-<% content_for :js_content do %>
-  <%= javascript_pack_tag "decidim_elections_voter_casting_vote" %>
-<% end %>

data/app/views/decidim/elections/votes/_show_failed.html.erb

@@ -1,23 +1,26 @@
-<%= render("focus_header", header_title: t("decidim.elections.votes.header.failed")) %>
+<div class="flex justify-center">
+  <h1 class="title-decorator my-12">
+    <%= t("decidim.elections.votes.failed.header") %>
+  </h1>
+</div>
 
-<div class="focus__content evote">
-  <div class="row">
-    <h1 class="heading2">
-      <%= t("decidim.elections.votes.failed.header") %>
-    </h1>
-    <h2 class="h4"><%= t("decidim.elections.votes.failed.lead") %></h2>
+<div class="space-y-4 text-center">
+  <p class="h4"><%= t("decidim.elections.votes.failed.lead") %></p>
 
-    <div class="evote__content">
-      <%= t("decidim.elections.votes.failed.text") %>
-    </div>
+  <p class="election-question__description">
+    <%= t("decidim.elections.votes.failed.text") %>
+  </p>
 
-    <%= link_to new_election_vote_path(election), class: "button" do %>
-      <%= t("decidim.elections.votes.failed.try_again") %>
-    <% end %>
+  <%= link_to new_election_vote_path(election), class: "button button__lg button__secondary" do %>
+    <%= t("decidim.elections.votes.failed.try_again") %>
+  <% end %>
 
-    <div>
-      <%= t("decidim.elections.votes.confirmed.experience") %>
+  <p class="election-question__description">
+    <%= t("decidim.elections.votes.confirmed.experience") %>
+    <% if vote %>
       <%= link_to t("decidim.elections.votes.confirmed.feedback"), election_feedback_path(election, hash: vote.encrypted_vote_hash, token: params[:token]) %>
-    </div>
-  </div>
+    <% else %>
+      <%= link_to t("decidim.elections.votes.confirmed.feedback"), election_feedback_path(election) %>
+    <% end %>
+  </p>
 </div>

data/app/views/decidim/elections/votes/new.html.erb

@@ -1,73 +1,90 @@
-<div class="vote-wrapper"
-  data-election-id="<%== election.id %>"
-  data-api-endpoint-url="<%== bulletin_board_server %>"
-  data-authority-public-key="<%= authority_public_key %>"
-  data-election-unique-id="<%== election_unique_id %>"
-  data-voter-id="<%== voter_id %>"
-  data-scheme-name="<%== scheme_name %>"
-  <% if ballot_style_id.present? %>
-  data-ballot-style-id="<%== ballot_style_id %>"
-  <% end %>>
-
-  <% questions.each_with_index do |step_question, step_index| %>
-    <div id="step-<%= step_index %>" class="focus__step <%= "hide" if step_index.positive? %>"
-    data-toggler=".hide">
-      <div class="focus__header">
-        <div class="row">
-          <div class="focus__steps">
-            <strong>
-              <%= t("decidim.elections.votes.new.question_steps", current_step: step_index + 1, total_steps: questions_count) %>
-            </strong>
-          </div>
-          <div class="heading5 focus__header-title">
-            <%= translated_attribute(election.title) %>
-          </div>
-        </div>
-      </div>
+<%= append_stylesheet_pack_tag "decidim_elections" %>
+<%= append_javascript_pack_tag "decidim_elections" %>
 
-      <div class="focus__content evote">
-        <div class="row">
-          <%= render(
-            "new_question",
-            question: step_question
-          ) %>
-        </div>
-      </div>
+<%= render layout: "layouts/decidim/shared/layout_center" do %>
+  <div id="vote-wrapper"
+    data-preview-mode="<%= preview_mode? %>"
+    data-election-id="<%== election.id %>"
+    data-api-endpoint-url="<%== bulletin_board_server %>"
+    data-authority-public-key="<%= authority_public_key %>"
+    data-election-unique-id="<%== election_unique_id %>"
+    data-voter-id="<%== voter_id %>"
+    data-scheme-name="<%== scheme_name %>"
+    <% if ballot_style_id.present? %>
+    data-ballot-style-id="<%== ballot_style_id %>"
+    <% end %>>
 
-      <%= cell(
-        "decidim/elections/voting_step_navigation",
-        step_index,
-        total_steps: questions_count
-      ) %>
+    <div id="heading">
+      <div class="flex justify-center">
+        <h1 class="title-decorator my-12">
+          <%= t("vote_for", scope: "decidim.elections.votes.header", title: translated_attribute(election.title) ) %>
+        </h1>
+      </div>
 
+      <ol id="wizard-steps" class="wizard-steps">
+        <% wizard_steps.each_with_index do |wizard_step, i| %>
+          <li data-step="step-<%= wizard_step %>" <%= "aria-current=step" if i.zero? %>><%= t(wizard_step, scope: "decidim.elections.votes.header") %></li>
+        <% end %>
+      </ol>
     </div>
-  <% end %>
 
-  <div id="step-<%= questions_count %>" class="hide focus__step" data-toggler=".hide">
-    <%= render(
-      "new_confirm_step",
-      questions: questions
-    ) %>
-  </div>
+    <%= cell("decidim/announcement", t("decidim.elections.votes.new.preview_alert"), callout_class: "warning mb-4") if preview_mode? %>
 
-  <div id="encrypting" class="hide focus__step" data-toggler=".hide">
-    <%= render("new_encrypting_step") %>
-  </div>
+    <% questions.each_with_index do |step_question, step_index| %>
+      <div id="step-<%= step_index %>" <%= "hidden" unless step_index.zero? %>>
 
-  <div id="ballot_decision" class="hide focus__step" data-redirect_url=".hide">
-    <%= render("new_ballot_decision_step") %>
-  </div>
-</div>
+        <div class="election-question__intro">
+          <p class="election-question__counter">
+            <%= t("decidim.elections.votes.new.question_steps", current_step: step_index + 1, total_steps: questions_count) %>
+          </p>
+
+          <h2 class="h3">
+            <%= translated_attribute(step_question.title) %>
+          </h2>
+
+          <% if step_question.max_selections > 1 %>
+            <div class="election-question__maxselections">
+              <p>
+                <%= t("decidim.elections.votes.new.answer_choices", choices: step_question.max_selections) %>
+              </p>
+
+              <span>
+                <%= t("votes.new.selections", scope:"decidim.elections", selected: "<strong data-counter-selection></strong>", max_selections: step_question.max_selections ).html_safe %>
+              </span>
+            </div>
+          <% end %>
+        </div>
+
+        <%= render(
+          "new_question",
+          question: step_question
+        ) %>
+
+        <%= cell(
+          "decidim/elections/voting_step_navigation",
+          step_index,
+          total_steps: questions_count
+        ) %>
 
-<%= render "decidim/elections/shared/broken_promises_modal" %>
+      </div>
+    <% end %>
 
-<% content_for :js_content do %>
+    <div id="step-confirm" hidden>
+      <%= render("new_confirm_step", questions:) %>
+    </div>
 
-  <% if preview_mode? %>
-    <%= javascript_pack_tag "decidim_elections_voter_setup_preview" %>
-  <% else %>
-    <%= javascript_pack_tag "decidim_elections_voter_setup_vote" %>
-  <% end %>
+    <div id="step-encrypting" hidden>
+      <%= render("new_encrypting_step") %>
+    </div>
+
+    <div id="step-ballot_decision" hidden>
+      <%= render("new_ballot_decision_step") %>
+    </div>
+
+    <div id="failed" hidden>
+      <%= render("show_failed") %>
+    </div>
+  </div>
 
-  <%= javascript_pack_tag "decidim_elections_voter_new_vote" %>
+  <%= render "decidim/elections/shared/broken_promises_modal" %>
 <% end %>