use buttons instead of select for contact page

This commit is contained in:
Christophe Robillard 2020-09-16 20:58:31 +02:00
parent 766981e7b7
commit 61ea73580f
5 changed files with 24 additions and 31 deletions

View file

@ -13,6 +13,10 @@ select {
line-height: 1.42857143;
}
dt {
margin-bottom: 0.5em;
}
.page-wrapper {
position: relative;
min-height: 100%;

View file

@ -3,10 +3,10 @@ class Helpscout::FormAdapter
def self.options
[
[I18n.t(TYPE_INFO, scope: [:support, :question]), TYPE_INFO],
[I18n.t(TYPE_PERDU, scope: [:support, :question]), TYPE_PERDU],
[I18n.t(TYPE_INSTRUCTION, scope: [:support, :question]), TYPE_INSTRUCTION],
[I18n.t(TYPE_AMELIORATION, scope: [:support, :question]), TYPE_AMELIORATION],
[I18n.t(TYPE_INFO, scope: [:support, :question]), TYPE_INFO, FAQ_CONTACTER_SERVICE_EN_CHARGE_URL],
[I18n.t(TYPE_PERDU, scope: [:support, :question]), TYPE_PERDU, LISTE_DES_DEMARCHES_URL],
[I18n.t(TYPE_INSTRUCTION, scope: [:support, :question]), TYPE_INSTRUCTION, FAQ_OU_EN_EST_MON_DOSSIER_URL],
[I18n.t(TYPE_AMELIORATION, scope: [:support, :question]), TYPE_AMELIORATION, FEATURE_UPVOTE_URL],
[I18n.t(TYPE_AUTRE, scope: [:support, :question]), TYPE_AUTRE]
]
end

View file

@ -25,31 +25,20 @@
= label_tag :type do
= t('your_question', scope: [:support, :question])
%span.mandatory *
= select_tag :type, options_for_select(@options, params[:type]), include_blank: t('choose_question', scope: [:support, :question]), required: true
.support.card.featured.hidden{ data: { 'contact-type-only': Helpscout::FormAdapter::TYPE_INFO } }
.card-title
= t('our_answer', scope: [:support, :response])
.card-content
= t('procedure_info_html', scope: [:support, :response], link_procedure_info: FAQ_CONTACTER_SERVICE_EN_CHARGE_URL)
.support.card.featured.hidden{ data: { 'contact-type-only': Helpscout::FormAdapter::TYPE_PERDU } }
.card-title
= t('our_answer', scope: [:support, :response])
.card-content
= t('lost_user_html', scope: [:support, :response], base_url: APPLICATION_BASE_URL, link_lost_user: LISTE_DES_DEMARCHES_URL)
.support.card.featured.hidden{ data: { 'contact-type-only': Helpscout::FormAdapter::TYPE_INSTRUCTION } }
.card-title
= t('our_answer', scope: [:support, :response])
.card-content
= t('instruction_info_html', scope: [:support, :response], link_instruction: FAQ_OU_EN_EST_MON_DOSSIER_URL)
.support.card.featured.hidden{ data: { 'contact-type-only': Helpscout::FormAdapter::TYPE_AMELIORATION } }
.card-title
= t('our_answer', scope: [:support, :response])
.card-content
= t('product_html', scope: [:support, :response], link_product: FEATURE_UPVOTE_URL)
%dl
- @options.each do |(question, question_type, link)|
%dt
- if link.present?
%button.button{ 'aria-expanded': 'false', 'aria-controls': question_type, data: { 'question-type': question_type } }= question
- else
%button.button.button-without-hint{ data: { 'question-type': question_type } }= question
- if link.present?
%dd
.support.card.featured.hidden{ id: question_type }
.card-title
= t('our_answer', scope: [:support, :response])
.card-content
= t("#{question_type}_html", scope: [:support, :response], base_url: APPLICATION_BASE_URL, "link_#{question_type}": link)
.contact-champ
= label_tag :dossier_id, t('file_number', scope: [:utils])

View file

@ -16,7 +16,7 @@ en:
<p>If you have questions about the information requested, contact the service in charge of the procedure.</p>
<p><a href=%{link_procedure_info}>Find more information</a></p>"
instruction_info_html: "<p>If you have questions about the instruction of your application (response delay for example), contact directly the instructor via our mail system.</p>
<p><a href=%{link_instruction}>Find more information</a></p>
<p><a href=%{link_instruction_info}>Find more information</a></p>
<br>
<p>If you are facing technical issues on the website, use the form below. We will not be able to inform you about the instruction of your application.</p>"
product_html: "<p>Got an idea? Please check our <strong>enhancement dashboard</strong></p>

View file

@ -16,7 +16,7 @@ fr:
<p>Si vous avez des questions sur les informations à saisir, contactez les services en charge de la démarche.</p>
<p><a href=%{link_procedure_info}>En savoir plus</a></p>"
instruction_info_html: "<p>Si vous avez des questions sur linstruction de votre dossier (par exemple sur les délais), nous vous invitons à contacter directement les services qui instruisent votre dossier par votre messagerie.</p>
<p><a href=%{link_instruction}>En savoir plus</a></p>
<p><a href=%{link_instruction_info}>En savoir plus</a></p>
<br>
<p>Si vous souhaitez poser une question pour un problème technique sur le site, utilisez le formulaire ci-dessous. Nous ne pourrons pas vous renseigner sur l'instruction de votre dossier.</p>"
product_html: "<p>Une idée ? Pensez à consulter notre <strong>tableau de bord des améliorations</strong></p>