diff --git a/app/assets/stylesheets/card.scss b/app/assets/stylesheets/card.scss index 2db51bef0..5e528b453 100644 --- a/app/assets/stylesheets/card.scss +++ b/app/assets/stylesheets/card.scss @@ -6,18 +6,18 @@ border: 1px solid $border-grey; margin-bottom: $default-spacer * 2; background: #FFFFFF; - - .notice { - font-size: 16px; - color: #666666; - margin-top: -8px; - margin-bottom: 16px; - } + color: $dark-grey; .card-title { + color: $black; font-weight: bold; font-size: 20px; + line-height: 1.5rem; margin-bottom: $default-spacer * 2; + + a:not(:hover) { + background-image: none; // remove DSFR underline + } } &.feedback { diff --git a/app/assets/stylesheets/flex.scss b/app/assets/stylesheets/flex.scss index e8c78a5a9..bc0b81f48 100644 --- a/app/assets/stylesheets/flex.scss +++ b/app/assets/stylesheets/flex.scss @@ -11,6 +11,10 @@ align-items: flex-start; } + &.align-end { + align-items: end; + } + &.align-baseline { align-items: baseline; } diff --git a/app/components/dsfr/alert_component.rb b/app/components/dsfr/alert_component.rb index d1fe28566..42ed9f432 100644 --- a/app/components/dsfr/alert_component.rb +++ b/app/components/dsfr/alert_component.rb @@ -13,20 +13,25 @@ class Dsfr::AlertComponent < ApplicationComponent end def alert_class(state) - ["fr-alert fr-alert--#{state}", extra_class_names].compact.flatten + if size == 'small' + ["fr-alert fr-alert--sm fr-alert--#{state}", extra_class_names].compact.flatten + else + ["fr-alert fr-alert--#{state}", extra_class_names].compact.flatten + end end private - def initialize(state:, title:, extra_class_names: nil, heading_level: 'h3') + def initialize(state:, title: '', size: '', extra_class_names: nil, heading_level: 'h3') @state = state @title = title + @size = size @block = block @extra_class_names = extra_class_names @heading_level = heading_level end - attr_reader :state, :title, :block, :extra_class_names, :heading_level + attr_reader :state, :title, :size, :block, :extra_class_names, :heading_level private end diff --git a/app/components/dsfr/alert_component/alert_component.html.haml b/app/components/dsfr/alert_component/alert_component.html.haml index b8e848bdb..a0f9cf28d 100644 --- a/app/components/dsfr/alert_component/alert_component.html.haml +++ b/app/components/dsfr/alert_component/alert_component.html.haml @@ -1,4 +1,5 @@ %div{ class: alert_class(state) } - = content_tag(heading_level, class: 'fr-alert__title') do - = "#{prefix_for_state}#{title}" + - if size != 'small' + = content_tag(heading_level, class: 'fr-alert__title') do + = "#{prefix_for_state}#{title}" = body diff --git a/app/views/administrateurs/experts_procedures/index.html.haml b/app/views/administrateurs/experts_procedures/index.html.haml index 8876f5b9b..a68895352 100644 --- a/app/views/administrateurs/experts_procedures/index.html.haml +++ b/app/views/administrateurs/experts_procedures/index.html.haml @@ -10,7 +10,7 @@ .card .card-title= t('.titles.allow_invite_experts') - %p.notice= t('.descriptions.allow_invite_experts') + %p= t('.descriptions.allow_invite_experts') = form_for @procedure, method: :put, url: allow_expert_review_admin_procedure_path(@procedure), @@ -24,7 +24,7 @@ - if @procedure.allow_expert_review? .card .card-title= t('.titles.manage_procedure_experts') - %p.notice= t('.descriptions.manage_procedure_experts') + %p= t('.descriptions.manage_procedure_experts') = form_for @procedure, method: :put, url: experts_require_administrateur_invitation_admin_procedure_path(@procedure), @@ -37,7 +37,7 @@ .card .card-title= t('.titles.allow_expert_messaging') - %p.notice= t('.descriptions.allow_expert_messaging') + %p= t('.descriptions.allow_expert_messaging') = form_for @procedure, method: :put, url: allow_expert_messaging_admin_procedure_path(@procedure), @@ -56,8 +56,8 @@ html: { class: 'form' } do |f| .instructeur-wrapper - %p.notice Pendant l'instruction d’un dossier, les instructeurs peuvent demander leur avis à un ou plusieurs experts. - %p#experts-emails.notice Entrez les adresses email des experts que vous souhaitez affecter à cette démarche + %p Pendant l'instruction d’un dossier, les instructeurs peuvent demander leur avis à un ou plusieurs experts. + %p#experts-emails Entrez les adresses email des experts que vous souhaitez affecter à cette démarche = hidden_field_tag :emails, nil = react_component("ComboMultiple", options: [], diff --git a/app/views/administrateurs/groupe_instructeurs/_instructeurs.html.haml b/app/views/administrateurs/groupe_instructeurs/_instructeurs.html.haml index bc2a07f12..0b94f472a 100644 --- a/app/views/administrateurs/groupe_instructeurs/_instructeurs.html.haml +++ b/app/views/administrateurs/groupe_instructeurs/_instructeurs.html.haml @@ -4,7 +4,7 @@ = form_for :instructeur, url: { action: :add_instructeur, id: groupe_instructeur.id }, html: { class: 'form' } do |f| .instructeur-wrapper - if !procedure.routing_enabled? - %p.notice Entrez les adresses email des instructeurs que vous souhaitez affecter à cette démarche + %p Entrez les adresses email des instructeurs que vous souhaitez affecter à cette démarche - if disabled_as_super_admin = f.select :emails, available_instructeur_emails, {}, disabled: disabled_as_super_admin, id: 'instructeur_emails' diff --git a/app/views/administrateurs/procedures/_procedures_list.html.haml b/app/views/administrateurs/procedures/_procedures_list.html.haml index 9fd38500b..ede6aa56d 100644 --- a/app/views/administrateurs/procedures/_procedures_list.html.haml +++ b/app/views/administrateurs/procedures/_procedures_list.html.haml @@ -5,24 +5,24 @@ = image_tag procedure.logo, alt: procedure.libelle, width: '100' .flex.column.ml-1 .card-title - = link_to procedure.libelle, admin_procedure_path(procedure), style: 'color: black;' + = link_to procedure.libelle, admin_procedure_path(procedure) = link_to commencer_url(procedure.path), commencer_url(procedure.path), class: 'fr-link fr-mb-1w' .admin-procedures-list-timestamps - %p.notice N° #{procedure.id} - %p.notice créée le #{procedure.created_at.strftime('%d/%m/%Y')} + %p N° #{procedure.id} + %p créée le #{procedure.created_at.strftime('%d/%m/%Y')} - if procedure.published_at.present? - %p.notice publiée le #{procedure.published_at.strftime('%d/%m/%Y')} + %p publiée le #{procedure.published_at.strftime('%d/%m/%Y')} - if procedure.updated_at.today? - %p.notice modifiée à #{procedure.updated_at.strftime('%H:%M')} + %p modifiée à #{procedure.updated_at.strftime('%H:%M')} - else - %p.notice modifiée le #{procedure.updated_at.strftime('%d/%m/%Y %H:%M')} + %p modifiée le #{procedure.updated_at.strftime('%d/%m/%Y %H:%M')} - if procedure.closed_at.present? - %p.notice archivée le #{procedure.closed_at.strftime('%d/%m/%Y')} + %p archivée le #{procedure.closed_at.strftime('%d/%m/%Y')} - elsif procedure.auto_archive_on&.future? - %p.notice sera clôturée le #{procedure.auto_archive_on.strftime('%d/%m/%Y')} + %p sera clôturée le #{procedure.auto_archive_on.strftime('%d/%m/%Y')} .admin-procedures-list-row.actions.flex.justify-between %div @@ -80,4 +80,3 @@ %span.icon.unarchive .dropdown-description %h4= t('administrateurs.dropdown_actions.restore') - diff --git a/app/views/users/dossiers/_dossier_actions.html.haml b/app/views/users/dossiers/_dossier_actions.html.haml index 03d8e741f..bb8b926c4 100644 --- a/app/views/users/dossiers/_dossier_actions.html.haml +++ b/app/views/users/dossiers/_dossier_actions.html.haml @@ -7,23 +7,20 @@ - if has_actions - = render Dropdown::MenuComponent.new(wrapper: :div, wrapper_options: {class: 'invite-user-actions'}, menu_options: {id: dom_id(dossier, :actions_menu)}, button_options: {class: 'fr-btn--sm'}) do |menu| - - menu.with_button_inner_html do - = t('views.users.dossiers.dossier_action.actions') + - if has_edit_action + - if dossier.brouillon? + = link_to t('views.users.dossiers.dossier_action.edit_draft'), (url_for_dossier(dossier)), class: 'fr-btn fr-mr-1w' - - if has_edit_action - - if dossier.brouillon? - - menu.with_item do - = link_to(url_for_dossier(dossier), role: 'menuitem') do - %span.icon.edit - .dropdown-description - = t('views.users.dossiers.dossier_action.edit_draft') + - else + = link_to t('views.users.dossiers.dossier_action.edit_dossier'), modifier_dossier_path(dossier), class: 'fr-btn fr-btn--tertiary fr-mr-1w' + + + = render Dropdown::MenuComponent.new(wrapper: :div, wrapper_options: {class: 'invite-user-actions'}, menu_options: {id: dom_id(dossier, :actions_menu)}, button_options: {class: 'fr-btn--tertiary'}) do |menu| + - menu.with_button_inner_html do + - if has_edit_action + = t('views.users.dossiers.dossier_action.other_actions') - else - - menu.with_item do - = link_to(modifier_dossier_path(dossier), role: 'menuitem') do - %span.icon.edit - .dropdown-description - = t('views.users.dossiers.dossier_action.edit_dossier') + = t('views.users.dossiers.dossier_action.actions') - if has_transfer_action - menu.with_item do diff --git a/app/views/users/dossiers/_dossiers_list.html.haml b/app/views/users/dossiers/_dossiers_list.html.haml index 4c5a7361a..ff9893ca6 100644 --- a/app/views/users/dossiers/_dossiers_list.html.haml +++ b/app/views/users/dossiers/_dossiers_list.html.haml @@ -1,54 +1,71 @@ - if dossiers.present? - %span.fr-h6.fr-mr-2w + .fr-h6.fr-mb-2w = page_entries_info dossiers - .fr-table.fr-table--bordered.fr-table--no-caption.fr-mt-2w - %table.table.dossiers-table.hoverable.hack-to-display-dropdown - %caption= t('views.users.dossiers.dossiers_list.caption') - %thead - %tr - %th.number-col{ scope: :col }= t('views.users.dossiers.dossiers_list.n_dossier') - %th{ scope: :col }= t('views.users.dossiers.dossiers_list.procedure') - - if dossiers.present? - %th{ scope: :col }= t('views.users.dossiers.dossiers_list.requester') - %th.status-col{ scope: :col }= t('views.users.dossiers.dossiers_list.status') - %th.updated-at-col{ scope: :col }= t('views.users.dossiers.dossiers_list.updated') - %th.action-col.follow-col{ scope: :col }= t('views.users.dossiers.dossiers_list.actions') - %tbody - - dossiers.each do |dossier| - - if dossier.transfer.present? - %tr.fr-background-alt--blue-france.no-border - %td.fr-py-2w{ colspan: 100 } - .flex.align-center - %p.fr-mb-0 - %small - = t('views.users.dossiers.transfers.sender_demande_en_cours', id: dossier.id, email: dossier.transfer.email) - .ml-auto - = link_to t('views.users.dossiers.transfers.revoke'), transfer_path(dossier.transfer), class: 'fr-btn fr-btn--sm fr-btn--tertiary-no-outline', method: :delete - %tr{ data: { 'dossier-id': dossier.id } } - %th.number-col{ scope: :row } - = link_to(url_for_dossier(dossier), class: 'cell-link', tabindex: -1) do - %span.icon.folder - = dossier.id - %td - = link_to(url_for_dossier(dossier), class: 'cell-link') do - = procedure_libelle(dossier.procedure) - - if dossiers.present? - %td - %span.cell-link= demandeur_dossier(dossier) - %td.status-col - - if dossier.pending_correction? - = pending_correction_badge(:for_user) - - else - = status_badge(dossier.state) + - dossiers.each do |dossier| + .card + .flex.justify-between + %div + %h2.card-title + = link_to(url_for_dossier(dossier), class: 'cell-link') do + = procedure_libelle(dossier.procedure) - %td.updated-at-col.cell-link - = try_format_date(dossier.updated_at) - %td.action-col.follow-col - = render partial: 'dossier_actions', locals: { dossier: dossier } + %p.fr-icon--sm.fr-icon-user-line + = demandeur_dossier(dossier) + + %p.fr-icon--sm.fr-icon-edit-box-line + - if dossier.depose_at.present? + %span + = t('views.users.dossiers.dossiers_list.depose_at', date: dossier.depose_at.strftime('%d/%m/%Y')) + - else + %span + = t('views.users.dossiers.dossiers_list.created_at', date: dossier.created_at.strftime('%d/%m/%Y')) + - if dossier.created_at != dossier.updated_at + = t('views.users.dossiers.dossiers_list.updated_at', date: dossier.updated_at.strftime('%d/%m/%Y %H:%M')) + - if dossier.invites.present? + %p.fr-icon--sm.fr-icon-shield-line + = t('views.users.dossiers.dossiers_list.shared_with') + = dossier.invites.map(&:email).join(', ') + + + .text-right + %p.fr-mb-0 + = t('views.users.dossiers.dossiers_list.n_dossier') + = dossier.id + + = status_badge(dossier.state, 'fr-mb-1w') + + - if dossier.pending_correction? + %br + = pending_correction_badge(:for_user) + + - if dossier.procedure.close? + = render Dsfr::AlertComponent.new(state: :info, size: 'small', extra_class_names: "fr-mb-2w") do |c| + - c.body do + %p + = t('views.users.dossiers.dossiers_list.procedure_closed') + + - if dossier.pending_correction? + = render Dsfr::AlertComponent.new(state: :warning, size: 'small', extra_class_names: "fr-mb-2w") do |c| + - c.body do + %p + = t('views.users.dossiers.dossiers_list.pending_correction') + + - if dossier.transfer.present? + = render Dsfr::AlertComponent.new(state: :info, size: 'small', extra_class_names: "fr-mb-2w") do |c| + - c.body do + %p + = t('views.users.dossiers.transfers.sender_demande_en_cours', id: dossier.id, email: dossier.transfer.email) + %p + = link_to t('views.users.dossiers.transfers.revoke'), transfer_path(dossier.transfer), class: 'fr-link', method: :delete + + + .flex.justify-end + = render partial: 'dossier_actions', locals: { dossier: dossier } = paginate dossiers, views_prefix: 'shared' + - else - if filter.filter_params.present? .blank-tab diff --git a/config/locales/en.yml b/config/locales/en.yml index b91ccadad..b9f54df18 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -463,14 +463,17 @@ en: caption: My files procedure: "Procedure" n_dossier: "File n." - requester: "Requester" status: "Status" - updated: "Updated" - actions: "Actions" no_result_title: No files no_result_text_html: "To fill a procedure, contact your administration asking for the procedure link.
It should look like %{app_base}/commencer/xxx." no_result_text_with_filter: found with selected filters no_result_reset_filter: Reset filters + procedure_closed: This procedure has been closed, you will not be able to submit a file again from the procedure link, contact your administration for more information. + pending_correction: This procedure is awaiting your corrections. Correct the fields that are notified by an alert message in the form. + depose_at: First submission on %{date} + created_at: Created at %{date} + updated_at: updated at %{date} + shared_with: File shared with transfers: sender_demande_en_cours: "A transfer request is pending on file Nº %{id} to %{email}" receiver_demande_en_cours: "Transfer request on file Nº %{id} sent by %{email}" @@ -483,8 +486,9 @@ en: clone: "Duplicate the file" delete_dossier: "Delete the file" transfer_dossier: "Transfer the file" - edit_draft: "Edit the draft" + edit_draft: "Keep filling" actions: "Actions" + other_actions: "Other actions" sessions: new: sign_in: Sign in on %{application_name} diff --git a/config/locales/fr.yml b/config/locales/fr.yml index d8b4bb583..0f2351a25 100644 --- a/config/locales/fr.yml +++ b/config/locales/fr.yml @@ -465,22 +465,26 @@ fr: caption: Mes dossiers procedure: "Démarche" n_dossier: "Nº dossier" - requester: "Demandeur" status: "Statut" - updated: "Mis à jour" - actions: "Actions" no_result_title: Aucun dossier no_result_text_html: "Pour remplir une démarche, contactez votre administration en lui demandant le lien de la démarche.
Celui ci doit ressembler à %{app_base}/commencer/xxx." no_result_text_with_filter: ne correspond aux filtres sélectionnés no_result_reset_filter: Réinitialiser les filtres + procedure_closed: Cette démarche a été clôturée, vous ne pourrez pas redéposer de dossier à partir du lien de la démarche, contactez votre administration pour plus d’information. + pending_correction: Cette démarche est en attente de vos corrections. Corriger les champs qui sont notifiés par un message d’alerte dans le formulaire. + depose_at: Déposé le %{date} + created_at: Créé le %{date} + updated_at: modifié le %{date} + shared_with: Dossier partagé avec dossier_action: edit_dossier: "Modifier le dossier" start_other_dossier: "Commencer un autre dossier vide" clone: "Dupliquer ce dossier" delete_dossier: "Supprimer le dossier" transfer_dossier: "Transférer le dossier" - edit_draft: "Modifier le brouillon" + edit_draft: "Continuer à remplir" actions: "Actions" + other_actions: "Autres actions" transfers: sender_demande_en_cours: "Une demande de transfert est en cours sur le dossier Nº %{id} pour %{email}" receiver_demande_en_cours: "Demande de transfert pour le dossier Nº %{id} envoyé par %{email}"