Merge pull request #9015 from demarches-simplifiees/add_dsfr_components
Ajoute la liste de boutons et le composant toggle au format ds-fr
This commit is contained in:
commit
ef0238c9aa
5 changed files with 37 additions and 0 deletions
7
app/components/dsfr/radio_button_list_component.rb
Normal file
7
app/components/dsfr/radio_button_list_component.rb
Normal file
|
@ -0,0 +1,7 @@
|
|||
class Dsfr::RadioButtonListComponent < ApplicationComponent
|
||||
def initialize(form:, target:, buttons:)
|
||||
@form = form
|
||||
@target = target
|
||||
@buttons = buttons
|
||||
end
|
||||
end
|
|
@ -0,0 +1,13 @@
|
|||
%fieldset.fr-fieldset{ 'aria-labelledby': 'radio-hint-element-legend radio-hint-element-messages' }
|
||||
%legend.fr-fieldset__legend--regular.fr-fieldset__legend
|
||||
= content
|
||||
|
||||
- @buttons.map { _1.values_at(:label, :value, :hint) }.each do |label, value, hint|
|
||||
.fr-fieldset__element
|
||||
.fr-radio-group
|
||||
= @form.radio_button @target, value
|
||||
= @form.label @target, value: value, class: 'fr-label' do
|
||||
- capture do
|
||||
= label
|
||||
%span.fr-hint-text= hint
|
||||
.fr-messages-group{ 'aria-live': 'assertive' }
|
9
app/components/dsfr/toggle_component.rb
Normal file
9
app/components/dsfr/toggle_component.rb
Normal file
|
@ -0,0 +1,9 @@
|
|||
class Dsfr::ToggleComponent < ApplicationComponent
|
||||
def initialize(form:, target:, title:, hint:, disabled:)
|
||||
@form = form
|
||||
@target = target
|
||||
@title = title
|
||||
@hint = hint
|
||||
@disabled = disabled
|
||||
end
|
||||
end
|
|
@ -0,0 +1,7 @@
|
|||
.fr-toggle.fr-toggle--border-bottom.fr-toggle--label-left
|
||||
= @form.check_box @target, class: 'fr-toggle__input', disabled: @disabled
|
||||
= @form.label @target,
|
||||
@title,
|
||||
class: 'fr-toggle__label',
|
||||
data: { 'fr-checked-label': 'Activé', 'fr-unchecked-label': 'Désactivé' }
|
||||
%p.fr-hint-text= @hint
|
|
@ -35,3 +35,4 @@
|
|||
@import '@gouvfr/dsfr/dist/component/pagination/pagination.css';
|
||||
@import '@gouvfr/dsfr/dist/component/skiplink/skiplink.css';
|
||||
@import '@gouvfr/dsfr/dist/component/password/password.css';
|
||||
@import '@gouvfr/dsfr/dist/component/accordion/accordion.css';
|
||||
|
|
Loading…
Reference in a new issue