DGNum/demarches-normaliennes
14
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

procedure: align radio buttons vertically

Browse source 
- Remove the unused `.radios.vertical`
- Add a `.editable-champ-radio.vertical` variant for vertical radios
- Add an example of vertical radios to the patron
- Use vertical radios to display the procedure options
This commit is contained in:
Pierre de La Morinerie 2019-10-09 15:35:33 +00:00
parent 72b7ff221c
commit 112b44bdea
3 changed files with 29 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
app/assets/stylesheets/new_design/forms.scss
View file

@ -70,12 +70,14 @@
// Align checkboxes on the top-left side of the label
&.editable-champ-checkbox,
&.editable-champ-radio.vertical,
&.editable-champ-engagement {
label {
padding-left: 28px;
}
input[type=checkbox] {
input[type=checkbox],
input[type=radio] {
position: absolute;
top: 1px;
left: 0px;
@ -92,18 +94,6 @@
margin-left: 0;
}
}
&.vertical {
label {
display: block;
margin-left: 0;
margin-bottom: 0;
}
input[type=radio] {
margin-bottom: 16px;
}
}
}
input[type=text]:not([data-address='true']),

20
app/views/new_administrateur/procedures/_informations.html.haml
View file

@ -106,24 +106,22 @@
- if !@procedure.locked?
%h2.header-section À qui s’adresse ma démarche ?
.radios
.editable-champ.editable-champ-radio.vertical
= f.label :for_individual, value: true do
= f.radio_button :for_individual, true
Ma démarche s’adresse à un particulier
%span.notice
%p En choisissant cette option, l’usager devra renseigner son nom et prénom avant d’accéder au formulaire
= f.radio_button :for_individual, true
%p.explication
En choisissant cette option, l’usager devra renseigner son nom et prénom avant d’accéder au formulaire
.radios
.editable-champ.editable-champ-radio.vertical
= f.label :for_individual, value: false do
= f.radio_button :for_individual, false
Ma démarche s’adresse à une personne morale
%span.notice
%p En choisissant cette option, l’usager devra renseigner son n° SIRET.<br>Grâce à l’API Entreprise, les informations sur la personne morale (raison sociale, adresse du siège, etc.) seront automatiquement renseignées.
= f.radio_button :for_individual, false
%p.explication
En choisissant cette option, l’usager devra renseigner son n° SIRET. Grâce à l’API Entreprise, seront alors automatiquement remontées les informations sur la personne morale type raison sociale ou adresse du siège social.
%p
Si votre démarche s’adresse indifféremment à une personne morale ou un particulier choisissez l'option "particuliers". Vous pourrez utilisez le champ SIRET directement dans le formulaire.
Si votre démarche s’adresse indifféremment à une personne morale ou un particulier, choisissez l'option « Particuliers ». Vous pourrez utiliser le champ SIRET directement dans le formulaire.
%h2.header-section Options avancées
- if feature_enabled?(:administrateur_web_hook)

19
app/views/root/patron.html.haml
View file

@ -48,8 +48,23 @@
= render partial: "shared/dossiers/editable_champs/editable_champ",
locals: { champ: champ, form: champ_form, seen_at: nil }
%label Mot de passe
%input{ type: "password", value: "12345678" }
.editable-champ.editable-champ-text
%label Mot de passe
%input{ type: "password", value: "12345678" }
%h2.header-section Bouton radio verticaux
.editable-champ.editable-champ-radio.vertical
= f.label :archived, value: true do
Option A
%span.notice
%p Une option tout à fait valable.
= f.radio_button :archived, true
.editable-champ.editable-champ-radio.vertical
= f.label :archived, value: false do
Option B
%span.notice
%p Une autre option, pas mal non plus.
= f.radio_button :archived, false
.send-wrapper
= f.submit 'Enregistrer un brouillon (formnovalidate)', formnovalidate: true, class: 'button send'