Remove .fr-search-bar .fr-label styles. And unse .sr-only instead
This commit is contained in:
parent
03409a798f
commit
6f1b41b1a7
3 changed files with 17 additions and 2 deletions
|
@ -164,3 +164,18 @@ button.fr-tag-bug {
|
||||||
border: 2px solid var(--border-action-high-grey);
|
border: 2px solid var(--border-action-high-grey);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// On restaure la visibilité des éléments .fr-search-bar .fr-label (en appliquant les valeurs par défaut des différentes propriétés)
|
||||||
|
// Et on utilise la classe .sr-only pour masquer les éléments souhaités au cas par cas
|
||||||
|
.fr-search-bar .fr-label {
|
||||||
|
position: initial;
|
||||||
|
width: initial;
|
||||||
|
height: initial;
|
||||||
|
padding: initial;
|
||||||
|
margin: initial;
|
||||||
|
overflow: initial;
|
||||||
|
clip: initial;
|
||||||
|
white-space: initial;
|
||||||
|
border: initial;
|
||||||
|
display: block; // Pour cette valeur spécifique, on récupère celle de .fr-label
|
||||||
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
= form_with(url: admin_procedure_groupe_instructeurs_path(@procedure),
|
= form_with(url: admin_procedure_groupe_instructeurs_path(@procedure),
|
||||||
method: :get) do
|
method: :get) do
|
||||||
#header-search.fr-search-bar.fr-mb-2w{ role: "search" }
|
#header-search.fr-search-bar.fr-mb-2w{ role: "search" }
|
||||||
= label_tag :q, 'Rechercher par nom', class: 'fr-label'
|
= label_tag :q, 'Rechercher par nom', class: 'sr-only'
|
||||||
= text_field_tag :q, @query, class: 'fr-input', type: 'search', autocomplete: 'off', placeholder: 'Rechercher par nom'
|
= text_field_tag :q, @query, class: 'fr-input', type: 'search', autocomplete: 'off', placeholder: 'Rechercher par nom'
|
||||||
%button.fr-btn{ title: "Rechercher" } Rechercher
|
%button.fr-btn{ title: "Rechercher" } Rechercher
|
||||||
- if @query.present?
|
- if @query.present?
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
%button.fr-btn--close.fr-btn{ "aria-controls" => "search-modal", :title => t('close_modal', scope: [:layouts, :header]) }= t('close_modal', scope: [:layouts, :header])
|
%button.fr-btn--close.fr-btn{ "aria-controls" => "search-modal", :title => t('close_modal', scope: [:layouts, :header]) }= t('close_modal', scope: [:layouts, :header])
|
||||||
#search-473.fr-search-bar.fr-search-bar--lg
|
#search-473.fr-search-bar.fr-search-bar--lg
|
||||||
= form_tag recherche_index_path, method: :get, :role => "search", class: "flex width-100" do
|
= form_tag recherche_index_path, method: :get, :role => "search", class: "flex width-100" do
|
||||||
= label_tag "q", t('views.users.dossiers.search.search_file'), class: 'fr-label'
|
= label_tag "q", t('views.users.dossiers.search.search_file'), class: 'sr-only'
|
||||||
= text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: t('views.users.dossiers.search.search_file'), class: "fr-input"
|
= text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: t('views.users.dossiers.search.search_file'), class: "fr-input"
|
||||||
%button.fr-btn
|
%button.fr-btn
|
||||||
= t('views.users.dossiers.search.simple')
|
= t('views.users.dossiers.search.simple')
|
||||||
|
|
Loading…
Reference in a new issue