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

Passe les champs select au DSFR

Browse source
This commit is contained in:
Kara Diaby 2023-06-28 12:14:04 +02:00 committed by Martin
parent 1ba28cc8d3
commit fb8fcd00b3
9 changed files with 46 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/assets/stylesheets/buttons.scss
View file

@ -316,13 +316,12 @@ ul.dropdown-items {
margin-bottom: 2 * $default-spacer;
}
input:not(.fr-btn),
select {
input:not(.fr-btn) {
width: 200px;
display: inline-block;
background-color: $light-grey;
border: 1px solid $border-grey;
}
}
[disabled] {
display: none;

3
app/assets/stylesheets/forms.scss
View file

@ -246,8 +246,7 @@
}
}
input[type=text]:not([data-address='true']),
select {
input[type=text]:not([data-address='true']) {
border-radius: 4px;
border: solid 1px $border-grey;
padding: $default-padding;

2
app/components/editable_champ/departements_component/departements_component.html.haml
View file

@ -1 +1 @@
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile"
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "fr-select"

2
app/components/editable_champ/drop_down_list_component.rb
View file

@ -1,6 +1,6 @@
class EditableChamp::DropDownListComponent < EditableChamp::EditableChampBaseComponent
def select_class_names
class_names('width-100': contains_long_option?)
class_names('width-100': contains_long_option?, 'fr-select': true)
end
def contains_long_option?

37
app/components/editable_champ/editable_champ_component.rb
View file

@ -21,6 +21,40 @@ class EditableChamp::EditableChampComponent < ApplicationComponent
"EditableChamp::#{@champ.type_champ.camelcase}Component".constantize
end
def select_group
[
'departements',
'drop_down_list',
'epci',
'pays',
'regions'
]
end
def input_group
[
'annuaire_education',
'date',
'datetime',
'decimal_number',
'dgfip',
'dossier_link',
'email',
'iban',
'integer_number',
'mesri',
'number',
'phone',
'piece_justificative',
'pole_emploi',
'rna',
'siret',
'text',
'textarea',
'titre_identite'
]
end
def html_options
{
class: class_names(
@ -28,7 +62,8 @@ class EditableChamp::EditableChampComponent < ApplicationComponent
'editable-champ': true,
"editable-champ-#{@champ.type_champ}": true,
"hidden": !@champ.visible?,
"fr-input-group": true
"fr-input-group": input_group.include?(@champ.type_champ),
"fr-select-group": select_group.include?(@champ.type_champ)
}.merge(input_group_error_class_names)
),
id: @champ.input_group_id,

4
app/components/editable_champ/epci_component/epci_component.html.haml
View file

@ -1,5 +1,5 @@
%label.notice{ for: @champ.code_departement_input_id } Le département de l’EPCI
= @form.select :code_departement, departement_options, departement_select_options, required: @champ.required?, id: @champ.code_departement_input_id, class: "width-33-desktop width-100-mobile"
= @form.select :code_departement, departement_options, departement_select_options, required: @champ.required?, id: @champ.code_departement_input_id, class: "width-33-desktop width-100-mobile fr-select"
- if @champ.departement?
= @form.label "EPCI", for: @champ.epci_input_id
= @form.select :value, epci_options, epci_select_options, required: @champ.required?, id: @champ.epci_input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile"
= @form.select :value, epci_options, epci_select_options, required: @champ.required?, id: @champ.epci_input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"

2
app/components/editable_champ/pays_component/pays_component.html.haml
View file

@ -1 +1 @@
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile"
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"

2
app/components/editable_champ/regions_component/regions_component.html.haml
View file

@ -1 +1 @@
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile"
= @form.select :value, options, select_options, required: @champ.required?, id: @champ.input_id, aria: { describedby: @champ.describedby_id }, class: "width-33-desktop width-100-mobile fr-select"

1
app/components/types_de_champ_editor/champ_component/champ_component.html.haml
View file

@ -32,6 +32,7 @@
.cell.flex.justify-start.column.flex-grow
= form.label :type_champ, "Type de champ", for: dom_id(type_de_champ, :type_champ)
= form.select :type_champ, grouped_options_for_select(types_of_type_de_champ, type_de_champ.type_champ), {}, class: 'fr-select small-margin small inline width-100', id: dom_id(type_de_champ, :type_champ), disabled: coordinate.used_by_routing_rules?
.flex.column.justify-start.flex-grow
.cell
.flex.align-center