Merge pull request #9705 from demarches-simplifiees/setup-dark-mode-ldu

[Accessibilité] Configurer le mode "sombre"
This commit is contained in:
Lisa Durand 2023-11-16 15:10:41 +00:00 committed by GitHub
commit 1fa3425d4f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
91 changed files with 296 additions and 409 deletions

View file

@ -5,3 +5,4 @@
//= link administrate/application.js
//= link manager.css
//= link attestation.css
//= link_tree ../../../node_modules/@gouvfr/dsfr/dist/artwork

View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-prefix="fas" data-icon="arrows-alt-v" class="svg-inline--fa fa-arrows-alt-v fa-w-8 fa-lg" width="32" height="32"><path d="M19.04 20.763h-1.656v-9.526h1.656c.768 0 2.494.242.61-1.6l-3.094-3.362a.815.815 0 0 0-1.22 0l-3.093 3.361c-1.643 1.831-.159 1.6.61 1.6h1.655v9.527h-1.655c-.769 0-2.235-.244-.61 1.6l3.093 3.362a.815.815 0 0 0 1.22 0l3.094-3.361c1.884-1.795.158-1.6-.61-1.6z" fill="currentColor"/><rect width="9" height="2" y="11" ry=".402"/><rect ry=".402" y="19" height="2" width="9"/><rect width="9" height="2" y="15" ry=".402"/><rect ry=".402" y="11" x="23" height="2" width="9"/><rect width="9" height="2" x="23" y="19" ry=".402"/><rect ry=".402" y="15" x="23" height="2" width="9"/></svg>

Before

Width:  |  Height:  |  Size: 761 B

View file

@ -7,7 +7,6 @@
}
.autosave-explanation {
color: $dark-grey;
margin-left: 4px;
}

View file

@ -174,6 +174,27 @@
}
}
[data-fr-theme="dark"] .dropdown-content {
border: none;
background: var(--background-action-low-blue-france);
}
[data-fr-theme="dark"] .dropdown-items {
li {
&:not(.inactive) {
&:hover,
&.selected {
background: var(--background-action-low-blue-france-hover);
}
}
&.form-inside {
background-color: var(--background-action-low-blue-france);
}
}
}
.dropdown-content {
border: 1px solid $border-grey;
background: #FFFFFF;
@ -226,7 +247,6 @@ ul.dropdown-items {
li {
display: flex;
padding: $default-padding;
color: $dark-grey;
border-bottom: 1px solid $border-grey;
font-size: 12px;
min-width: 300px;
@ -293,7 +313,6 @@ ul.dropdown-items {
h4 {
font-size: 14px;
color: $black;
margin-bottom: $default-spacer;
}

View file

@ -1,6 +1,12 @@
@import "colors";
@import "constants";
[data-fr-theme="dark"] .card {
background: none;
border: 1px solid var(--background-action-low-blue-france);
}
.card {
padding: ($default-spacer * 3) ($default-spacer * 2);
border: 1px solid $border-grey;
@ -8,7 +14,6 @@
background: #FFFFFF;
.card-title {
color: $black;
font-weight: bold;
font-size: 20px;
line-height: 1.5rem;

View file

@ -3,6 +3,11 @@
$dossier-actions-bar-border-width: 1px;
[data-fr-theme="dark"] .dossier-edit .dossier-edit-sticky-footer {
background-color: var(--background-action-low-blue-france);
border: none;
}
.dossier-header {
.fr-container {
padding-bottom: $default-padding;

View file

@ -4,13 +4,11 @@
.dossier-container {
.sub-header {
h1 {
color: $black;
font-size: 22px;
margin-bottom: 0;
}
h2 {
color: $dark-grey;
font-weight: bold;
}

View file

@ -10,15 +10,6 @@ ol.fr-ol-content--override {
}
}
// override default transparent background on inputs & font-size to 16px by default
input,
textarea,
select,
// FIXME when DSFR is DONE
.form-ds-fr-white .fr-input {
background: $white;
font-size: 1em;
}
// with Marianne font, weight of font is less bolder, so bold it up
.button.primary {

View file

@ -386,7 +386,6 @@
[data-reach-combobox-token] button {
border: solid 1px $border-grey;
color: $black;
border-radius: 4px;
padding: $default-spacer;
margin-right: $default-spacer;
@ -449,22 +448,6 @@
margin-bottom: $default-padding;
}
.explication-libelle {
font-weight: bold;
font-size: 20px;
margin-bottom: $default-padding;
}
.explication {
margin-bottom: $default-fields-spacer;
padding: $default-spacer;
background-color: $light-grey;
p:not(:last-child) {
margin-bottom: $default-padding;
}
}
.send-wrapper {
display: flex;
width: 100%;
@ -623,6 +606,15 @@
outline-color: $light-blue;
}
[data-fr-theme="dark"] [data-reach-combobox-popover] {
border: none;
background: var(--background-action-low-blue-france);
}
[data-fr-theme="dark"] [data-reach-combobox-option]:hover {
background: var(--background-action-low-blue-france-hover);
}
[data-reach-combobox-popover] {
z-index: 20;
}
@ -653,6 +645,11 @@ textarea::placeholder {
}
}
[data-fr-theme="dark"] .fixed-footer {
border-top: 2px solid var(--background-action-low-blue-france-hover);
background-color: var(--background-action-low-blue-france);
}
.fixed-footer {
border-top: 2px solid $blue-france-500;
position: fixed;

View file

@ -8,7 +8,7 @@
}
.help-dropdown-title {
color: $blue-france-500;
font-weight: bold;
}
.dropdown-items li.help-dropdown-service {

View file

@ -170,10 +170,6 @@
background-image: image-url("icons/trash.svg");
}
&.move-handle {
background-image: image-url("icons/move-handle.svg");
}
&.mandatory {
width: 10px;
}

View file

@ -3,10 +3,6 @@
@import "mixins";
@import "placeholders";
.landing-panel {
@include vertical-padding(60px);
}
$landing-breakpoint: 1040px;
.hero-wrapper {
@ -27,16 +23,6 @@ $landing-breakpoint: 1040px;
}
}
.hero-tagline {
margin-bottom: 0px;
}
.hero-tagline-em {
color: $blue-france-500;
font-style: normal;
font-weight: bold;
}
.hero-illustration {
max-width: 500px;
@ -74,7 +60,6 @@ $landing-breakpoint: 1040px;
}
.feature-text {
color: #FFFFFF;
font-size: 20px;
text-align: center;
}
@ -139,17 +124,7 @@ $landing-breakpoint: 1040px;
font-weight: bold;
}
.usagers-panel,
.numbers-panel,
.cta-panel-2 {
background-color: var(--background-alt-blue-france);
}
.landing {
.more-info {
background-color: #FFFFFF;
}
.numbers {
@extend %horizontal-list;
@ -229,15 +204,6 @@ $users-breakpoint: 950px;
height: 180px;
}
.cta-panel {
background-color: $blue-france-500;
color: #FFFFFF;
.fr-btn {
box-shadow: inset 0 0 0 1px var(--text-inverted-blue-france);
}
}
.role-panel-wrapper {
width: 100%;
display: flex;
@ -274,25 +240,6 @@ $users-breakpoint: 950px;
}
}
.cta-panel-title {
font-size: 24px;
font-weight: bold;
margin-top: 13px;
color: #FFFFFF;
&.grey {
color: $g700;
}
}
.cta-panel-explanation {
font-size: 22px;
margin-bottom: 10px;
&.grey {
color: $g700;
}
}
.role-administrations-image {
text-align: right;

View file

@ -3,10 +3,9 @@
@import "placeholders";
.two-columns {
background-color: $white;
@media (min-width: $two-columns-breakpoint) {
background: linear-gradient(to right, #FFFFFF 0%, #FFFFFF 50%, $light-grey 50%, $light-grey 100%);
background: linear-gradient(to right, transparent 0%, transparent 50%, var(--background-alt-blue-france) 50%, var(--background-alt-blue-france) 100%);
}
.columns-container { // TODO: https://github.com/betagouv/demarches-simplifiees.fr/issues/7882, once implemented, we won't need container anymore

View file

@ -23,7 +23,6 @@
.form [data-reach-combobox-token] button {
border: solid 1px #CCCCCC;
background-color: transparent;
color: #333333;
border-radius: 4px;
padding: 8px;
margin-right: 8px;

View file

@ -1,7 +1,6 @@
@import "colors";
.menu-component-header {
color: $dark-grey;
font-size: 12px;
a {

View file

@ -1,12 +1,21 @@
@import "colors";
@import "constants";
[data-fr-theme="dark"] .message {
background: var(--background-action-low-blue-france);
&.inverted-background {
background: var(--background-action-low-blue-france);
}
}
.message {
display: flex;
align-items: flex-start;
margin-bottom: $default-padding;
padding: $default-padding;
background: #FFFFFF;
background: $light-grey;
border-radius: 3px;
&.inverted-background {

View file

@ -5,7 +5,6 @@
max-height: 350px;
overflow-y: scroll;
border: 1px solid $border-grey;
background: $light-grey;
padding: 2 * $default-spacer;
margin-bottom: $default-spacer;
border-radius: 4px;

View file

@ -7,3 +7,9 @@ span.notifications {
border-radius: 4px;
background-color: $orange;
}
.fr-tabs__list span.notifications {
z-index: 2;
top: 5px;
right: 8px;
}

View file

@ -19,7 +19,6 @@
[data-reach-combobox-token] button {
border: solid 1px $border-grey;
color: $black;
margin-top: 0.5 * $default-padding;
margin-bottom: 0.5 * $default-padding;
margin-right: 0.5 * $default-padding;

View file

@ -25,15 +25,9 @@
box-shadow: 0px 2px 4px -4px;
}
.handle.icon {
width: 32px;
height: 32px;
background-size: 32px;
margin-left: 7px;
margin-right: 16px;
.handle {
align-self: center;
cursor: grab;
opacity: 0.8;
&:hover {
opacity: 0.4;

View file

@ -22,7 +22,6 @@
.procedure-form__column--form {
flex: 10;
padding: 0 $default-padding;
background-color: $light-grey;
input[type=file] {
background-color: transparent; // Remove white bg set by DSFR
@ -67,6 +66,11 @@
}
}
[data-fr-theme="dark"] .procedure-form__actions {
background: var(--background-action-low-blue-france);
border-top: 1px solid var(--background-action-low-blue-france-hover);
}
.procedure-form__actions {
display: flex;
padding: $default-spacer $default-padding;

View file

@ -49,7 +49,6 @@
.stats-legend {
font-size: 12px;
color: $dark-grey;
}
}

View file

@ -56,7 +56,6 @@
[data-reach-combobox-token] button {
border: solid 1px $border-grey;
color: $black;
margin: 0.25 * $default-padding;
border-radius: 2px;
padding: 0.25 * $default-padding;

View file

@ -1,26 +0,0 @@
@import "constants";
#sources-particulier-form {
h2 {
margin-bottom: 0;
}
h3 {
margin-top: 2 * $default-padding;
}
.explication {
padding: $default-padding;
ul {
list-style-type: circle;
list-style-position: inside;
padding-left: $default-padding;
margin-bottom: $default-padding;
}
}
.form input[type="checkbox"] {
margin-bottom: 0;
}
}

View file

@ -56,6 +56,17 @@
width: calc(100vw);
}
[data-fr-theme="dark"] .fr-table--bordered {
.table {
&.hoverable {
tbody tr:hover {
background-color: var(--background-action-low-blue-france);
}
}
}
}
.fr-table--bordered {
.table {
&.hoverable {

View file

@ -1,57 +0,0 @@
@import "colors";
@import "mixins";
.tabs {
ul {
margin-bottom: 0;
padding: 0;
}
li {
display: inline-block;
line-height: 36px;
position: relative;
text-align: center;
font-size: 14px;
border-radius: 3px 3px 0 0;
border: 1px solid transparent;
a {
display: block;
padding-left: 20px;
padding-right: 20px;
color: $black;
background-image: none;
}
&.active {
background-color: #FFFFFF;
border-top: 2px solid $blue-france-500;
border-left: 1px solid $border-grey;
border-right: 1px solid $border-grey;
a {
color: $blue-france-500;
}
.badge {
color: $blue-france-500;
}
}
&:hover {
a {
color: $blue-france-500;
}
.badge {
color: $blue-france-500;
}
}
.notifications {
top: 3px;
right: 3px;
}
}
}

View file

@ -1,5 +1,5 @@
%fieldset
%legend.header-subsection{ legend_params }= @champ.libelle
%legend.fr-h5{ legend_params }= @champ.libelle
- if @champ.description.present?
.notice{ notice_params }= render SimpleFormatComponent.new(@champ.description, allow_a: true)

View file

@ -1,9 +1,7 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to gestionnaire_groupe_gestionnaire_children_path(@groupe_gestionnaire), id: 'gestionnaires', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
.line-count.fr-my-1w
%p.fr-tag= @groupe_gestionnaire.children.size

View file

@ -1,9 +1,7 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to gestionnaire_groupe_gestionnaire_gestionnaires_path(@groupe_gestionnaire), id: 'gestionnaires', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
.line-count.fr-my-1w
%p.fr-tag= @groupe_gestionnaire.gestionnaires.size

View file

@ -1,9 +1,7 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to admin_procedure_administrateurs_path(@procedure), id: 'administrateurs', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
.line-count.fr-my-1w
%p.fr-tag= @procedure.administrateurs.size

View file

@ -6,13 +6,9 @@
%span.icon.refuse
%p.fr-tile-status-error À modifier
- elsif @count == 0
%div
%span.icon.clock
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
- else
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
.line-count.fr-my-1w
%p.fr-tag= @count

View file

@ -2,13 +2,9 @@
= link_to jeton_admin_procedure_path(@procedure), class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.api_entreprise_token.present?
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Configurer le jeton API entreprise

View file

@ -2,13 +2,9 @@
= link_to admin_procedure_api_particulier_path(@procedure), class: 'fr-tile fr-enlarge-link', id: 'api-particulier' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.api_particulier_token.present?
%div
%span.icon.accept
%p.fr-tile-status-accept= t('.ready')
%p.fr-badge.fr-badge--success= t('.ready')
- else
%div
%span.icon.clock
%p.fr-tile-status-todo= t('.needs_configuration')
%p.fr-badge.fr-badge--info= t('.needs_configuration')
%div
%h3.fr-h6.fr-mt-10v= Procedure.human_attribute_name(:api_particulier_token)
%p.fr-tile-subtitle= t('.configure_api_particulier_token')

View file

@ -4,15 +4,11 @@
- if @procedure.attestation_template&.activated?
%div
- if error_messages.present?
%span.icon.refuse
%p.fr-tile-status-error À modifier
%p.fr-badge.fr-badge--warning À modifier
- else
%span.icon.accept
%p.fr-tile-status-accept Activée
%p.fr-badge.fr-badge--success Activée
- else
%div
%span.icon.clock
%p.fr-tile-status-todo Désactivée
%p.fr-badge Désactivée
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Délivrance automatique pour les dossiers acceptés

View file

@ -6,13 +6,9 @@
%span.icon.refuse
%p.fr-tile-status-error À modifier
- elsif @count == 0
%div
%span.icon.clock
%p.fr-tile-status-todo À faire
%p.fr-badge.fr-badge--warning À faire
- else
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
.line-count.fr-my-1w
%p.fr-tag= @count

View file

@ -2,13 +2,9 @@
= link_to edit_admin_procedure_chorus_path(@procedure), class: 'fr-tile fr-enlarge-link', title: 'Configurer le cadre budgetaire Chorus' do
.fr-tile__body.flex.column.align-center.justify-between
- if !@procedure.chorus_configuration.complete?
%div
%span.icon.clock
%p.fr-tile-status-todo À compléter
%p.fr-badge.fr-badge--warning À compléter
- else
%div
%span.icon.accept
%p.fr-tile-status-accept Configuré
%p.fr-badge.fr-badge--success Configuré
%div
%h3.fr-h6.fr-mt-10v
Connecteur Chorus

View file

@ -2,13 +2,9 @@
= link_to edit_admin_procedure_dossier_submitted_message_path(@procedure), class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.active_dossier_submitted_message.present?
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Orienter l'usager suite à l'envoi de son dossier

View file

@ -3,14 +3,11 @@
.fr-tile__body.flex.column.align-center.justify-between
%div
- if error_messages.present?
%span.icon.refuse
%p.fr-tile-status-error À modifier
%p.fr-badge.fr-badge--warning À modifier
- elsif fully_customized?
%span.icon.accept
%p.fr-tile-status-todo Validé
%p.fr-badge.fr-badge--success Validé
- else
%span.icon.clock
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
%div
.line-count.fr-my-1w
%p.fr-tag= customized_progress

View file

@ -1,9 +1,7 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to admin_procedure_experts_path(@procedure), class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%div
%span.icon.preview
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Gérer les avis des experts invités

View file

@ -2,13 +2,9 @@
= link_to admin_procedure_groupe_instructeurs_path(@procedure), id: 'groupe-instructeurs', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.routing_enabled? || @procedure.instructeurs.present?
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À faire
%p.fr-badge.fr-badge--warning À faire
%div
.line-count.fr-my-1w
- if @procedure.routing_enabled?

View file

@ -1,12 +1,11 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to modifications_admin_procedure_path(@procedure), id: 'modifications', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%p.fr-badge.fr-badge--success Activée
%div
%span.icon.accept
%p.fr-tile-status-accept Activée
%div
%h3.fr-h6.fr-mt-10v
.line-count.fr-my-1w
%p.fr-tag= @procedure.revisions_count
%h3.fr-h6
= t('.title', count: @procedure.revisions_count)
%p.fr-tile-subtitle Historique des modifications du formulaire

View file

@ -2,13 +2,9 @@
= link_to monavis_admin_procedure_path(@procedure), class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.monavis_embed.present?
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À configurer
%p.fr-badge.fr-badge--info À configurer
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Avis des usagers sur votre démarche

View file

@ -1,9 +1,7 @@
.fr-col-6.fr-col-md-4.fr-col-lg-3
= link_to edit_admin_procedure_path(@procedure), id: 'presentation', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle Logo, nom, description

View file

@ -2,13 +2,9 @@
= link_to service_link, class: 'fr-tile fr-enlarge-link', id: 'service' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.service_id.present?
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À faire
%p.fr-badge.fr-badge--warning À faire
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle

View file

@ -2,13 +2,9 @@
= link_to edit_admin_procedure_sva_svr_path(@procedure), class: 'fr-tile fr-enlarge-link', id: 'sva' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.sva_svr_enabled?
%div
%span.icon.accept
%p.fr-tile-status-accept= t('.ready')
%p.fr-badge.fr-badge--success= t('.ready')
- else
%div
%span.icon.clock
%p.fr-tile-status-todo= t('.needs_configuration')
%p.fr-badge.fr-badge--info= t('.needs_configuration')
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle= t('.subtitle')
%p.fr-btn.fr-btn--tertiary= t('views.shared.actions.edit')

View file

@ -2,13 +2,9 @@
= link_to zones_admin_procedure_path(@procedure), id: 'zones', class: 'fr-tile fr-enlarge-link' do
.fr-tile__body.flex.column.align-center.justify-between
- if @procedure.zones.size >= 1
%div
%span.icon.accept
%p.fr-tile-status-accept Validé
%p.fr-badge.fr-badge--success Validé
- else
%div
%span.icon.clock
%p.fr-tile-status-todo À faire
%p.fr-badge.fr-badge--info À faire
%div
%h3.fr-h6.fr-mt-10v= t('.title')
%p.fr-tile-subtitle= t('.subtitle')

View file

@ -51,7 +51,7 @@
= f.button type: :submit, class: "fr-btn fr-btn--secondary" do
= t('.add')
= form_for @api_token, namespace: dom_id(@api_token, :write_access), html: { class: 'form form-ds-fr-white mb-3', data: { turbo: true, controller: 'autosubmit' } } do |f|
= form_for @api_token, namespace: dom_id(@api_token, :write_access), html: { class: 'form mb-3', data: { turbo: true, controller: 'autosubmit' } } do |f|
= f.label :write_access do
= t('.token_procedures')
%label.toggle-switch.no-margin

View file

@ -1,7 +1,7 @@
%li.type-de-champ.flex.column.justify-start{ html_options }
.type-de-champ-container
.flex.justify-between.section.head.hr
.handle.small.icon-only.icon.move-handle{ title: "Déplacer le champ vers le haut ou vers le bas" }
.handle.fr-icon-drag-move-2-line{ title: "Déplacer le champ vers le haut ou vers le bas" }
- if coordinate.used_by_routing_rules?
.flex.align-center

View file

@ -1,5 +1,6 @@
@import '@gouvfr/dsfr/dist/core/core.css';
@import '@gouvfr/dsfr/dist/utility/utility.css';
@import '@gouvfr/dsfr/dist/scheme/scheme.css';
/* These base components may be dependencies of other components */
@import '@gouvfr/dsfr/dist/component/link/link.css';
@ -36,3 +37,4 @@
@import '@gouvfr/dsfr/dist/component/skiplink/skiplink.css';
@import '@gouvfr/dsfr/dist/component/password/password.css';
@import '@gouvfr/dsfr/dist/component/accordion/accordion.css';
@import '@gouvfr/dsfr/dist/component/tab/tab.css';

View file

@ -23,13 +23,13 @@
.description
= tag[:description]
%h3.header-subsection Logo de l'attestation
%h3.fr-h5 Logo de l'attestation
%p.fr-text--sm.fr-text-mention--grey.fr-mb-0
Dimensions conseillées : au minimum 500px de largeur ou de hauteur.
= render Attachment::EditComponent.new(attached_file: @attestation_template.logo, direct_upload: false)
%h3.header-subsection.fr-mt-5w Tampon de l'attestation
%h3.fr-h5.fr-mt-5w Tampon de l'attestation
%p.fr-text--sm.fr-text-mention--grey.fr-mb-0
Dimensions conseillées : au minimum 500px de largeur ou de hauteur.
= render Attachment::EditComponent.new(attached_file: @attestation_template.signature, direct_upload: false)

View file

@ -10,7 +10,7 @@
= render NestedForms::FormOwnerComponent.new
= form_for @attestation_template,
url: admin_procedure_attestation_template_path(@procedure),
html: { multipart: true, class: 'form form-ds-fr-white procedure-form__column--form' } do |f|
html: { multipart: true, class: 'form procedure-form__column--form fr-background-alt--blue-france' } do |f|
%h1.page-title
Délivrance dattestation

View file

@ -1,3 +1,4 @@
= f.label :message_on_submit_by_usager do
Message affiché après l'envoi du dossier
= f.text_area :message_on_submit_by_usager, placeholder: "Merci, votre dossier sera traité dans les plus brefs délais"
.fr-input-group
= f.label :message_on_submit_by_usager do
Message affiché après l'envoi du dossier
= f.text_area :message_on_submit_by_usager, placeholder: "Merci, votre dossier sera traité dans les plus brefs délais", class: 'fr-input'

View file

@ -9,7 +9,7 @@
.procedure-form__columns.container
= form_for @dossier_submitted_message,
url: url_for({ controller: 'administrateurs/dossier_submitted_messages', action: :update, id: @procedure.id }),
html: { class: 'form procedure-form__column--form' } do |f|
html: { class: 'form procedure-form__column--form fr-background-alt--blue-france' } do |f|
%h1.page-title
Fin du dépot
@ -18,10 +18,9 @@
= render partial: 'administrateurs/dossier_submitted_messages/informations', locals: { f: f }
.procedure-form__actions
.actions-left
= f.submit 'Enregistrer', class: 'button primary send'
= f.submit 'Enregistrer', class: 'fr-btn send'
.procedure-form__column--preview
%h3

View file

@ -11,12 +11,14 @@
.container
%h1
= form_with model: @procedure, url: admin_procedure_api_particulier_jeton_path, local: true, html: { class: 'form' } do |f|
%p.explication
= t('.api_particulier_description_html', app_name: APPLICATION_NAME)
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%p
= t('.api_particulier_description_html', app_name: APPLICATION_NAME)
= f.label :api_particulier_token
.desc.mb-2
%p= t('.token_description')
= f.password_field :api_particulier_token, class: 'form-control', required: :required
.text-right
= f.button t('views.shared.actions.save'), class: 'button primary send'
= f.button t('views.shared.actions.save'), class: 'fr-btn send'

View file

@ -14,7 +14,7 @@
= form_for @mail_template,
url: admin_procedure_mail_template_path(@procedure, @mail_template.class.const_get(:SLUG)),
method: :put,
html: { class: 'form form-ds-fr-white procedure-form__column--form' } do |f|
html: { class: 'form form-ds-fr-white procedure-form__column--form fr-background-alt--blue-france' } do |f|
%h1.page-title= @mail_template.class.const_get(:DISPLAYED_NAME)
= render partial: 'form', locals: { f: f, tags: @mail_template.tags }

View file

@ -1,15 +1,17 @@
%p.explication
Proposez aux usagers de donner un avis sur votre démarche. Pour ce faire, vous devez précédemment aller sur «
%a{ :href => "https://monavis.numerique.gouv.fr" } https://monavis.numerique.gouv.fr
», créer un compte, et référencer la démarche que vous venez de publier.
%br
%br
Vous pouvez
%a{ :href => DOC_INTEGRATION_MONAVIS_URL } consulter notre tutoriel complet
pour intégrer le bouton « MonAvis » sur #{APPLICATION_NAME}.
%br
%br
Une fois en possession du code généré sur le site MonAvis, vous pouvez le coller dans le champ ci-dessous :
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%p
Proposez aux usagers de donner un avis sur votre démarche. Pour ce faire, vous devez précédemment aller sur «
%a{ :href => "https://monavis.numerique.gouv.fr" } https://monavis.numerique.gouv.fr
», créer un compte, et référencer la démarche que vous venez de publier.
%br
%br
Vous pouvez
%a{ :href => DOC_INTEGRATION_MONAVIS_URL } consulter notre tutoriel complet
pour intégrer le bouton « MonAvis » sur #{APPLICATION_NAME}.
%br
%br
Une fois en possession du code généré sur le site MonAvis, vous pouvez le coller dans le champ ci-dessous :
.fr-input-group
= f.label :monavis_embed, "Mon avis", class: "fr-label"

View file

@ -2,8 +2,8 @@
.fr-container
%h1.page-title Prévisualisation de la démarche «&nbsp;#{@dossier.procedure.libelle}&nbsp;»
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item('le dossier',
apercu_admin_procedure_path(@dossier.procedure, tab: 'dossier'),
active: @tab == 'dossier')

View file

@ -5,8 +5,8 @@
= link_to "Nouvelle Démarche", new_from_existing_admin_procedures_path, id: 'new-procedure', class: 'fr-btn'
.fr-container
%nav.tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul
%nav.fr-tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item(t('pluralize.published', count: @procedures_publiees_count), admin_procedures_path(statut: 'publiees'), active: @statut == 'publiees', badge: number_with_html_delimiter(@procedures_publiees_count))
= tab_item('En test', admin_procedures_path(statut: 'brouillons'), active: @statut == 'brouillons', badge: number_with_html_delimiter(@procedures_draft_count))
= tab_item(t('pluralize.closed', count: @procedures_closed_count), admin_procedures_path(statut: 'archivees'), active: @statut == 'archivees', badge: number_with_html_delimiter(@procedures_closed_count))

View file

@ -10,13 +10,15 @@
.container
%h1
= form_with model: @procedure, url: url_for({ controller: 'administrateurs/procedures', action: :update_jeton }) do |f|
%p.explication
Démarches Simplifiées utilise
= link_to 'API Entreprise', "https://entreprise.api.gouv.fr/"
qui permet de récupérer les informations administratives des entreprises et des associations.
Si votre démarche nécessite des autorisations spécifiques que Démarches Simplifiées na pas par défaut, merci de renseigner ici le jeton
= link_to 'API Entreprise', "https://api.gouv.fr/les-api/api-entreprise/demande-acces"
propre à votre démarche.
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%p
Démarches Simplifiées utilise
= link_to 'API Entreprise', "https://entreprise.api.gouv.fr/"
qui permet de récupérer les informations administratives des entreprises et des associations.
Si votre démarche nécessite des autorisations spécifiques que Démarches Simplifiées na pas par défaut, merci de renseigner ici le jeton
= link_to 'API Entreprise', "https://api.gouv.fr/les-api/api-entreprise/demande-acces"
propre à votre démarche.
.fr-input-group
= f.label :api_entreprise_token, "Jeton", class: 'fr-label'

View file

@ -9,13 +9,16 @@
.container#sources-particulier-form.mb-2
= form_with model: @procedure, url: admin_procedure_api_particulier_sources_path, local: true, html: { class: 'form' } do |f|
.explication= t('.explication_html')
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%p
= t('.explication_html')
- @available_sources.each do |provider_key, scopes|
%h2.header-section= t("api_particulier.providers.#{provider_key}.libelle")
- scopes.each do |scope_key, sources|
%h3.explication-libelle= t("api_particulier.providers.#{provider_key}.scopes.#{scope_key}.libelle")
%h3= t("api_particulier.providers.#{provider_key}.scopes.#{scope_key}.libelle")
%ul.procedure-admin-api-particulier-sources{ id: "#{provider_key}-#{scope_key}" }
- sources.each do |source_key, enabled_hash|
- enabled = (@procedure.api_particulier_sources.dig(provider_key, scope_key)&.include?(source_key)).present?
@ -25,4 +28,4 @@
#{t("api_particulier.providers.#{provider_key}.scopes.#{scope_key}.#{source_key}")}
.text-right
= f.button t('views.shared.actions.save'), class: 'button primary send'
= f.button t('views.shared.actions.save'), class: 'fr-btn send'

View file

@ -4,7 +4,7 @@
.fr-container
.fr-grid-row.fr-grid-row--gutters
.fr-col-lg.fr-p-6w.fr-background-alt--grey
.fr-col-lg.fr-p-6w.fr-background-alt--blue-france
#session-new.auth-form.sign-in-form
= form_for User.new, url: user_session_path do |f|
@ -43,7 +43,7 @@
.fr-fieldset__element
= render Dsfr::InputComponent.new(form: f, attribute: :password, input_type: :password_field, opts: { autocomplete: 'current-password' })
%p= link_to t('views.users.sessions.new.reset_password'), new_user_password_path, class: "link"
%p= link_to t('views.users.sessions.new.reset_password'), new_user_password_path, class: "fr-link"
.fr-fieldset__element
.auth-options

View file

@ -18,8 +18,8 @@
%span.fr-download__detail
ZIP
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
= dynamic_tab_item('Demande', expert_avis_path(avis.procedure, avis))
= dynamic_tab_item('Avis', instruction_expert_avis_path(avis.procedure, avis), notification: avis.answer.blank?)
- if avis.procedure.allow_expert_messaging

View file

@ -11,8 +11,8 @@
.procedure-header
%h1.fr-h3= procedure_libelle @procedure
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item('avis à donner',
procedure_expert_avis_index_path(statut: Instructeurs::AvisController::A_DONNER_STATUS),
active: @statut == Instructeurs::AvisController::A_DONNER_STATUS,

View file

@ -1,6 +1,6 @@
#header-bottom.fr-container
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
- notifications_summary = current_instructeur.notifications_for_dossier(dossier)
= dynamic_tab_item(t('views.instructeurs.dossiers.tab_steps.request'),

View file

@ -1,5 +1,5 @@
%nav.tabs.mt-3
%ul
%nav.fr-tabs.mt-3
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item(t(tab_i18n_key_from_status('a-suivre')),
instructeur_procedure_path(procedure, statut: 'a-suivre'),
active: statut == 'a-suivre',

View file

@ -9,8 +9,10 @@
= t('.title')
= form_for @assign_to, url: update_email_notifications_instructeur_procedure_path(@procedure), html: { class: 'form' } do |form|
.explication
= t('.subtitle')
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%p
= t('.subtitle')
= form.label :email_notification, t('.for_each_file_submitted.title')

View file

@ -5,8 +5,8 @@
%h1.fr-h3.fr-mb-0 Démarches
= render partial: 'instructeurs/procedures/synthese', locals: { procedures: @procedures, all_dossiers_counts: @all_dossiers_counts }
%nav.tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul
%nav.fr-tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item(t('pluralize.en_cours', count: @procedures_en_cours_count), instructeur_procedures_path(statut: 'en-cours'), active: @statut == 'en-cours', badge: number_with_html_delimiter(@procedures_en_cours_count))
= tab_item(t('pluralize.en_test', count: @procedures_draft_count), instructeur_procedures_path(statut: 'brouillons'), active: @statut == 'brouillons', badge: number_with_html_delimiter(@procedures_draft_count))
= tab_item(t('pluralize.closed', count: @procedures_closes_count), instructeur_procedures_path(statut: 'archivees'), active: @statut == 'archivees', badge: number_with_html_delimiter(@procedures_closes_count))

View file

@ -0,0 +1,41 @@
%dialog#fr-theme-modal.fr-modal{ "aria-labelledby" => "fr-theme-modal-title", role: "dialog" }
.fr-container.fr-container--fluid.fr-container-md
.fr-grid-row.fr-grid-row--center
.fr-col-12.fr-col-md-6.fr-col-lg-4
.fr-modal__body
.fr-modal__header
%button#button-5622.fr-btn--close.fr-btn{ "aria-controls" => "fr-theme-modal", title: "Fermer" } Fermer
.fr-modal__content
%h1#fr-theme-modal-title.fr-modal__title Paramètres daffichage
#fr-display.fr-display
%fieldset#display-fieldset.fr-fieldset
%legend#display-fieldset-legend.fr-fieldset__legend--regular.fr-fieldset__legend Choisissez un thème pour personnaliser lapparence du site.
.fr-fieldset__element
.fr-radio-group.fr-radio-rich
%input#fr-radios-theme-light{ name: "fr-radios-theme", type: "radio", value: "light" }/
%label.fr-label{ for: "fr-radios-theme-light" } Thème clair
.fr-radio-rich__img
%svg.fr-artwork{ aria_hidden: "true", viewBox: "0 0 80 80", width: "80px", height: "80px" }
%use.fr-artwork-decorative{ href: image_path("pictograms/environment/sun.svg#artwork-decorative") }
%use.fr-artwork-minor{ href: image_path("pictograms/environment/sun.svg#artwork-minor") }
%use.fr-artwork-major{ href: image_path("pictograms/environment/sun.svg#artwork-major") }
.fr-fieldset__element
.fr-radio-group.fr-radio-rich
%input#fr-radios-theme-dark{ name: "fr-radios-theme", type: "radio", value: "dark" }/
%label.fr-label{ for: "fr-radios-theme-dark" } Thème sombre
.fr-radio-rich__img
%svg.fr-artwork{ "aria-hidden" => "true", height: "80px", viewbox: "0 0 80 80", width: "80px" }
%use.fr-artwork-decorative{ href: image_path("pictograms/environment/moon.svg#artwork-decorative") }
%use.fr-artwork-minor{ href: image_path("pictograms/environment/moon.svg#artwork-minor") }
%use.fr-artwork-major{ href: image_path("pictograms/environment/moon.svg#artwork-major") }
.fr-fieldset__element
.fr-radio-group.fr-radio-rich
%input#fr-radios-theme-system{ name: "fr-radios-theme", type: "radio", value: "system" }/
%label.fr-label{ for: "fr-radios-theme-system" }
Système
%span.fr-hint-text Utilise les paramètres système
.fr-radio-rich__img
%svg.fr-artwork{ "aria-hidden" => "true", height: "80px", viewbox: "0 0 80 80", width: "80px" }
%use.fr-artwork-decorative{ href: image_path("pictograms/system/system.svg#artwork-decorative") }
%use.fr-artwork-minor{ href: image_path("pictograms/system/system.svg#artwork-minor") }
%use.fr-artwork-major{ href: image_path("pictograms/system/system.svg#artwork-major") }

View file

@ -1,5 +1,5 @@
!!! 5
%html{ lang: html_lang, class: yield(:root_class) }
%html{ lang: html_lang, data: { fr_scheme: 'system' }, class: yield(:root_class) }
%head
%meta{ "http-equiv": "Content-Type", content: "text/html; charset=UTF-8" }
%meta{ "http-equiv": "X-UA-Compatible", content: "IE=edge" }
@ -38,6 +38,8 @@
%body{ { id: content_for(:page_id), class: browser.platform.ios? ? 'ios' : nil, data: { controller: 'turbo number-input' } }.compact }
= render partial: 'layouts/skiplinks'
= render partial: 'layouts/display_theme_modal'
.page-wrapper
- if feature_enabled?(:team_on_strike)
= render partial: 'layouts/strike_banner'

View file

@ -89,7 +89,7 @@ as well as a link to its edit page.
<% end %>
<% end %>
<% if attribute.name == 'tags' %>
<%= form_for procedure, url: add_tags_manager_procedure_path(procedure), html: { class: 'form procedure-form__column--form mt-1' } do %>
<%= form_for procedure, url: add_tags_manager_procedure_path(procedure), html: { class: 'form procedure-form__column--form fr-background-alt--blue-france mt-1' } do %>
<%= hidden_field_tag 'procedure[tags]', nil %>
<%= react_component("ComboMultiple",
options: Procedure.tags,

View file

@ -1,4 +1,4 @@
.landing-panel
.fr-py-6w
.container
%h2.center.fr-mb-4w Ce que les utilisateurs pensent du service

View file

@ -1,4 +1,4 @@
.landing-panel.users-panel
.fr-py-6w
.container
%h2.center.fr-mb-4w Ils utilisent déjà #{APPLICATION_NAME}

View file

@ -2,18 +2,18 @@
= render partial: "root/footer"
.landing
.landing-panel.hero-panel
.fr-py-6w
.container
.hero-wrapper
.hero-text
%h1.hero-tagline
%em.hero-tagline-em Dématérialisez et simplifiez
%h1.fr-mb-0
Dématérialisez et simplifiez
vos démarches administratives
.hero-illustration
%img{ :src => image_url("landing/hero/dematerialiser.svg"), alt: "" }
.landing-panel.more-info
.fr-py-6w.fr-background-alt--blue-france
.container
.role-panel-wrapper.role-administrations-panel
.role-panel-70
@ -26,7 +26,7 @@
.role-panel-30.role-more-info-image.fr-mt-2w
%img.role-image{ :src => image_url("landing/roles/usagers.svg"), alt: "" }
.landing-panel.usagers-panel
.fr-py-6w
.container
.role-panel-wrapper.role-administrations-panel
.role-panel-30.role-administrations-image
@ -44,9 +44,7 @@
%br
.landing-panel.features-panel
.fr-py-6w.fr-background-flat--blue-france.fr-text-inverted--blue-france
.container
%ul.features
%li.feature
@ -73,7 +71,7 @@
= render partial: "root/testimonials" if LANDING_TESTIMONIALS_ENABLED
- cache "numbers-panel", :expires_in => 3.hours do
.landing-panel.numbers-panel
.fr-py-6w.fr-background-alt--blue-france
.container
%h2.center.fr-mb-4w #{APPLICATION_NAME} en chiffres
%ul.numbers
@ -113,11 +111,11 @@
- c.with_footer_button do
= link_to("Inscription à notre prochain webinaire", INSCRIPTION_WEBINAIRE_URL, class: "fr-btn", **external_link_attributes)
.landing-panel.cta-panel
.fr-py-6w.fr-background-alt--blue-france
.container
.cta-panel-wrapper
%div
%h1.cta-panel-title Une question, un problème ?
%p.cta-panel-explanation Consultez notre FAQ
%h2 Une question, un problème ?
%p.fr-h5 Consultez notre FAQ
%div
= link_to "Voir la FAQ", t("links.common.faq.url"), class: "fr-btn fr-btn--lg", **external_link_attributes

View file

@ -3,17 +3,17 @@
- content_for :title, t(".promise")
.landing
.landing-panel.hero-panel
.fr-py-6w
.container
.hero-wrapper
.hero-text
%h1.hero-tagline
%em.hero-tagline-em= t(".promise")
%h1.fr-mb-0
= t(".promise")
.hero-illustration
%img{ :src => image_url("landing/hero/dematerialiser.svg"), alt: '', width: 499, height: 280, loading: 'lazy' }
.landing-panel.usagers-panel
.fr-background-alt--blue-france.fr-py-6w
.container
.role-panel-wrapper
.role-panel-30.role-usagers-image
@ -27,7 +27,7 @@
= link_to t("views.users.sessions.new.connection"), new_user_session_path, class: "fr-btn fr-btn--secondary fr-btn--lg"
- cache [I18n.locale, "numbers-panel"], expires_in: 3.hours do
.landing-panel
.fr-py-6w
.container
%h2.center.fr-mb-4w= t(".our_numbers", name: APPLICATION_NAME)
%ul.numbers
@ -44,28 +44,20 @@
= "#{number_with_delimiter(50)} %"
.number-label.number-label-third= t(".numbers.processing_time")
.landing-panel.cta-panel
.fr-background-alt--blue-france.fr-py-6w
.container
.cta-panel-wrapper
%div
%h2.cta-panel-title= t(".question")
%p.cta-panel-explanation= t(".answer_in_faq")
%h2= t(".question")
%p.fr-h5= t(".answer_in_faq")
%div
= link_to t(".online_help"), t("links.common.faq.url"), class: "fr-btn fr-btn--lg", title: new_tab_suffix(t(".online_help")), **external_link_attributes
-# We temporarily disable the link to the contact page on the homepage
-# %p.cta-panel-explanation Notre équipe est disponible pour vous renseigner et vous aider
-# %div
-# = contact_link "Contactez-nous",
-# tags: 'landing',
-# class: "cta-panel-button-white",
-# target: "_blank",
-# rel: "noopener noreferrer"
.landing-panel
.fr-py-6w
.container
.cta-panel-wrapper
%div
%h2.fr-h4= t(".administration_dematerialize")
%p.cta-panel-explanation.grey= t(".administration_fill_online")
%h2= t(".administration_dematerialize")
%p.fr-h5= t(".administration_fill_online")
%div
= link_to t(".administration_discover"), administration_path, class: "fr-btn fr-btn--lg"

View file

@ -35,7 +35,6 @@
%span.icon.retry
%span.icon.download
%span.icon.download-white
%span.icon.move-handle
%span.icon.frown
%span.icon.meh
%span.icon.smile
@ -50,7 +49,7 @@
%label Mot de passe
%input{ type: "password", value: "12345678" }
%h3.header-subsection Bouton radio verticaux
%h3.fr-h5 Bouton radio verticaux
.radios.vertical
= f.label :archived, value: true do
= f.radio_button :archived, true
@ -61,7 +60,7 @@
Option B
%p.notice Une autre option, pas mal non plus.
%h3.header-subsection Interrupteur
%h3.fr-h5 Interrupteur
%label.toggle-switch
= f.check_box :archived, class: 'toggle-switch-checkbox'
%span.toggle-switch-control.round
@ -231,8 +230,8 @@
.sub-header
.container
Titre
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
= tab_item("Onglet actif", "#", active: true)
= tab_item("Onglet inactif", "#")
= tab_item("Onglet avec badge", "#", badge: 2)

View file

@ -1,7 +1,7 @@
%li{ class: (active ? 'active' : nil) }
%li{ class: "relative #{(active ? 'active' : nil)}", role: 'presentation' }
- if notification
%span.notifications{ 'aria-label': 'notifications' }
= link_to(url, 'aria-current': active ? 'page' : nil) do
= link_to(url, 'aria-selected': active ? true : nil, class: 'fr-tabs__tab', role: 'tab' ) do
- if badge.present?
%span.badge= badge
%span.badge.fr-mr-1w= badge
= label

View file

@ -17,6 +17,6 @@
= render Dsfr::InputComponent.new(form: f, attribute: :otp_attempt, input_type: :number_field, opts: { inputmode: :numeric }, required: false)
.fr-fieldset__element
%p= link_to "Mot de passe oublié ou réinitialisation 2FA ?", new_super_admin_password_path, class: "link"
%p= link_to "Mot de passe oublié ou réinitialisation 2FA ?", new_super_admin_password_path, class: "fr-link"
= f.submit t('views.users.sessions.new.connection'), class: "fr-btn fr-btn--lg"

View file

@ -5,3 +5,6 @@
= link_to t("links.footer.mentions_legales.label"), MENTIONS_LEGALES_URL, title: t("links.footer.mentions_legales.title"), class: "fr-footer__bottom-link", rel: "noopener noreferrer"
%li.fr-footer__bottom-item
= link_to t("links.footer.cookies.label"), suivi_path, title: t("links.footer.cookies.title"), class: "fr-footer__bottom-link"
%li.fr-footer__bottom-item
%button.fr-footer__bottom-link.fr-icon-theme-fill.fr-btn--icon-left{ aria: {controls: "fr-theme-modal" }, data: {'fr-opened': "false" } }
= t('links.footer.display_params')

View file

@ -25,8 +25,8 @@
= render Dossiers::UserProcedureFilterComponent.new(procedures_for_select: @procedures_for_select)
- if @search_terms.blank?
%nav.tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul
%nav.fr-tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
%ul.fr-tabs__list{ role: 'tablist' }
- if @user_dossiers.present?
= tab_item(t('pluralize.en_cours', count: @user_dossiers.count),
dossiers_path(statut: 'en-cours', procedure_id: params[:procedure_id]),

View file

@ -21,8 +21,8 @@
title: t('views.users.dossiers.demande.edit_dossier_title')
= render(partial: 'users/dossiers/show/print_dossier', locals: { dossier: dossier })
%nav.tabs
%ul
%nav.fr-tabs
%ul.fr-tabs__list{ role: 'tablist' }
= dynamic_tab_item(t('views.users.dossiers.show.header.summary'), dossier_path(dossier))
= dynamic_tab_item(t('views.users.dossiers.show.header.request'), [demande_dossier_path(dossier), modifier_dossier_path(dossier)])
= dynamic_tab_item(t('views.users.dossiers.show.header.mailbox'), messagerie_dossier_path(dossier))

View file

@ -17,6 +17,10 @@
= link_to 'Refuser la fusion', refuse_merge_path, method: :post, class: 'fr-btn fr-btn--secondary', data: { confirm: "Confirmez-vous le refus ?" }
= link_to 'Accepter la fusion', accept_merge_path, method: :post, class: 'fr-btn fr-btn--secondary', data: { confirm: "Confirmez-vous la fusion des comptes ?" }
.card
.card-title Choisissez un thème pour personnaliser lapparence du site
= link_to t('links.footer.display_params'),'#', { aria: {controls: "fr-theme-modal" }, data: {'fr-opened': "false" }, class: 'fr-icon-theme-fill fr-link--icon-left fr-link' }
.card
.card-title= t('.contact')
%p

View file

@ -20,7 +20,7 @@
.fr-fieldset__element
= render Dsfr::InputComponent.new(form: f, attribute: :password, input_type: :password_field, opts: { autocomplete: 'current-password' })
%p= link_to t('views.users.sessions.new.reset_password'), new_user_password_path, class: "link"
%p= link_to t('views.users.sessions.new.reset_password'), new_user_password_path, class: "fr-link"
.fr-fieldset__element

View file

@ -10,6 +10,7 @@ Rails.application.config.assets.paths << Rails.root.join('node_modules', 'trix',
Rails.application.config.assets.paths << Rails.root.join('node_modules', 'mapbox-gl', 'dist')
Rails.application.config.assets.paths << Rails.root.join('node_modules', '@reach', 'combobox')
Rails.application.config.assets.paths << Rails.root.join('node_modules', '@mapbox', 'mapbox-gl-draw', 'dist')
Rails.application.config.assets.paths << Rails.root.join('node_modules', '@gouvfr', 'dsfr', 'dist', 'artwork')
# Precompile additional assets.
# application.js, application.css, and all non-JS/CSS in the app/assets

View file

@ -77,3 +77,4 @@ en:
contact:
label: Contact
title: Contact
display_params: Display params

View file

@ -89,3 +89,4 @@ fr:
contact:
label: Nous contacter
title: Nous contacter
display_params: Paramètres d'affichage

View file

@ -25,7 +25,8 @@ describe 'As an administrateur, I want to manage the procedures attestation',
scenario do
visit admin_procedure_path(procedure)
# start with no attestation
find_attestation_card(with_nested_selector: ".icon.clock")
expect(page).to have_content('Désactivée')
find_attestation_card(with_nested_selector: ".fr-badge")
# now process to enable attestation
find_attestation_card.click
@ -38,7 +39,8 @@ describe 'As an administrateur, I want to manage the procedures attestation',
# check attestation
visit admin_procedure_path(procedure)
find_attestation_card(with_nested_selector: ".icon.accept")
expect(page).to have_content('Activée')
find_attestation_card(with_nested_selector: ".fr-badge--success")
# publish procedure
# click CTA for publication screen
@ -55,7 +57,8 @@ describe 'As an administrateur, I want to manage the procedures attestation',
# check attestation is now disabled
visit admin_procedure_path(procedure)
find_attestation_card(with_nested_selector: ".icon.clock")
expect(page).to have_content('Désactivée')
find_attestation_card(with_nested_selector: ".fr-badge")
end
end
end

View file

@ -72,7 +72,7 @@ describe 'Inviting an expert:' do
click_on '1 avis à donner'
click_on avis.dossier.user.email
within('.tabs') { click_on 'Avis' }
within('.fr-tabs') { click_on 'Avis' }
expect(page).to have_text("Demandeur : #{avis.claimant.email}")
expect(page).to have_text('Cet avis est confidentiel')
@ -102,7 +102,7 @@ describe 'Inviting an expert:' do
click_on '1 avis à donner'
click_on avis.dossier.user.email
within('.tabs') { click_on 'Avis' }
within('.fr-tabs') { click_on 'Avis' }
expect(page).to have_text("Demandeur : #{avis.claimant.email}")
expect(page).to have_text('Question ?')
expect(page).to have_text('Cet avis est confidentiel')
@ -200,7 +200,7 @@ describe 'Inviting an expert:' do
click_on '1 avis à donner'
click_on avis_1.dossier.user.email
within('.tabs') { click_on 'Avis' }
within('.fr-tabs') { click_on 'Avis' }
expect(page).to have_text("Demandeur : #{avis_1.claimant.email}")
click_on 'Voir les avis'
expect(page).to have_text("Vous")
@ -216,7 +216,7 @@ describe 'Inviting an expert:' do
click_on '1 avis à donner'
click_on avis_2.dossier.user.email
within('.tabs') { click_on 'Avis' }
within('.fr-tabs') { click_on 'Avis' }
expect(page).to have_text("Demandeur : #{avis_2.claimant.email}")
click_on 'Voir les avis'
expect(page).to have_text("Vous")

View file

@ -204,14 +204,14 @@ describe 'The routing with rules', js: true do
## on the dossiers list
click_on procedure.libelle
expect(page).to have_current_path(instructeur_procedure_path(procedure))
expect(find('.tabs')).to have_css('span.notifications')
expect(find('.fr-tabs')).to have_css('span.notifications')
## on the dossier itself
click_on 'suivi'
click_on litteraire_user.email
expect(page).to have_current_path(instructeur_dossier_path(procedure, litteraire_user.dossiers.first))
expect(page).to have_text('Annotations privées')
expect(find('.tabs')).to have_css('span.notifications')
expect(find('.fr-tabs')).to have_css('span.notifications')
log_out
# the scientifiques instructeurs should not have a notification

View file

@ -231,7 +231,7 @@ describe 'user access to the list of their dossiers', js: true do
it "appears in the result list" do
expect(current_path).to eq(dossiers_path)
expect(page).to have_content("Résultat de la recherche pour « #{dossier_en_construction.id} »")
expect(page).not_to have_css('.tabs')
expect(page).not_to have_css('.fr-tabs')
expect(page).to have_content(dossier_en_construction.id)
end
end

View file

@ -76,7 +76,7 @@ describe 'users/dossiers/index', type: :view do
end
it 'naffiche la barre donglets' do
expect(rendered).to have_selector('nav.tabs')
expect(rendered).to have_selector('nav.fr-tabs')
end
end
@ -88,9 +88,9 @@ describe 'users/dossiers/index', type: :view do
end
it 'affiche la barre donglets' do
expect(rendered).to have_selector('nav.tabs')
expect(rendered).to have_selector('nav.tabs li', count: 5)
expect(rendered).to have_selector('nav.tabs li.active', count: 1)
expect(rendered).to have_selector('nav.fr-tabs')
expect(rendered).to have_selector('nav.fr-tabs li', count: 5)
expect(rendered).to have_selector('nav.fr-tabs li.active', count: 1)
end
end

View file

@ -13,7 +13,7 @@ describe 'users/dossiers/show/header', type: :view do
expect(rendered).to have_text("Dossier nº #{dossier.id}")
expect(rendered).to have_text("en construction")
expect(rendered).to have_selector("nav.tabs")
expect(rendered).to have_selector("nav.fr-tabs")
expect(rendered).to have_link("Résumé", href: dossier_path(dossier))
expect(rendered).to have_link("Demande", href: demande_dossier_path(dossier))
end