diff --git a/app/assets/stylesheets/02_utils.scss b/app/assets/stylesheets/02_utils.scss index 0870552ae..d4d6f21ce 100644 --- a/app/assets/stylesheets/02_utils.scss +++ b/app/assets/stylesheets/02_utils.scss @@ -136,8 +136,9 @@ // who known .highlighted { - background: $orange-bg; - color: $black; + background-color: var(--background-contrast-yellow-moutarde); // from fr-badge--new + color: var(--text-action-high-grey); + background-clip: content-box; } .overflow-y-visible { diff --git a/app/assets/stylesheets/demande.scss b/app/assets/stylesheets/demande.scss index 52dd1ef07..aaced2911 100644 --- a/app/assets/stylesheets/demande.scss +++ b/app/assets/stylesheets/demande.scss @@ -1,25 +1,29 @@ @import "colors"; @import "constants"; -.container { +.dossier-show { @media (max-width: 48em) { .d-block-sm { display: block; } } -} -.champ-content { - padding: 0 0 ,5rem; + .champ-label { + font-weight: 600; + margin-bottom: 0; + color: var(--text-action-high-grey); + } - p { - padding: 0; - margin: 0; + .champ-content { + padding: 0 0 0.5rem; + + p { + padding: 0; + margin: 0; + } + } + + .top-bordered { + border-top: 1px solid var(--border-default-grey); } } - -.top-bordered { - border-top: 1px solid var(--border-default-grey); -} - - diff --git a/app/components/dossiers/champ_row_show_component/champ_row_show_component.html.haml b/app/components/dossiers/champ_row_show_component/champ_row_show_component.html.haml index f42cd694d..5c545958c 100644 --- a/app/components/dossiers/champ_row_show_component/champ_row_show_component.html.haml +++ b/app/components/dossiers/champ_row_show_component/champ_row_show_component.html.haml @@ -1,22 +1,25 @@ - @champs.each do |champ| .fr-px-4v.fr-my-2v - if champ.repetition? - = champ.libelle + %p.champ-label= "#{champ.libelle} :" - champ.rows.each do |row| = render Dossiers::ChampRowShowComponent.new(champs: row, demande_seen_at: @demande_seen_at, profile: @profile, repetition: true) - else .flex.d-block-sm - %p.flex-grow.fr-text-action-high--grey.fr-mb-0= "#{champ.libelle} :" - %p.champ-updated-at.fr-mb-0.fr-text--sm - - if updated_after_deposer?(champ) + %p.champ-label.flex-grow= "#{champ.libelle} :" + + - if updated_after_deposer?(champ) + %p.fr-mb-0.fr-text--sm %span{ class: highlight_if_unseen_class(@demande_seen_at, champ.updated_at) } = t(:updated_at, scope: [:views, :shared, :dossiers, :form], datetime: try_format_datetime(champ.updated_at)) + - if champ.blank? && ![TypeDeChamp.type_champs.fetch(:piece_justificative), TypeDeChamp.type_champs.fetch(:titre_identite)].include?(champ.type_champ) .champ-content.fr-text-mention--grey{ class: [highlight_if_unseen_class(@demande_seen_at, champ.updated_at), champ.type_champ] } - %p= t('.blank') + %p + %em= t('.blank') - else - .champ-content.fr-text-action-high--grey{ class: [highlight_if_unseen_class(@demande_seen_at, champ.updated_at), champ.type_champ] } + .champ-content{ class: [highlight_if_unseen_class(@demande_seen_at, champ.updated_at), champ.type_champ] } - case champ.type_champ - when TypeDeChamp.type_champs.fetch(:carte) = render partial: "shared/champs/carte/show", locals: { champ: champ } @@ -59,4 +62,5 @@ - when TypeDeChamp.type_champs.fetch(:number) %p= number_with_html_delimiter(champ.to_s) - else - %p= format_text_value(champ.to_s.strip) unless champ.blank? + - if champ.present? + = format_text_value(champ.to_s.strip) # format already wrap in p diff --git a/app/views/shared/dossiers/_champs.html.haml b/app/views/shared/dossiers/_champs.html.haml index 8ee1d2336..1491b8ed1 100644 --- a/app/views/shared/dossiers/_champs.html.haml +++ b/app/views/shared/dossiers/_champs.html.haml @@ -2,13 +2,13 @@ .fr-my-4v.fr-px-4v .flex - %p.flex-grow.fr-text-action-high--grey.fr-mb-0= dossier.procedure.routing_criteria_name - %p.champ-updated-at.fr-mb-0.fr-text--sm + %p.champ-label.flex-grow= dossier.procedure.routing_criteria_name + %p.fr-mb-0.fr-text--xs - if demande_seen_at&.<(dossier.groupe_instructeur_updated_at) %span{ class: highlight_if_unseen_class(demande_seen_at, dossier.groupe_instructeur_updated_at) } = t(:updated_at, scope: [:views, :shared, :dossiers, :form], datetime: try_format_datetime(dossier.updated_at)) - .champ-content.fr-text-action-high--grey{ class: highlight_if_unseen_class(demande_seen_at, dossier.groupe_instructeur_updated_at) } + .champ-content{ class: highlight_if_unseen_class(demande_seen_at, dossier.groupe_instructeur_updated_at) } %p= dossier.groupe_instructeur.label diff --git a/app/views/shared/dossiers/_demande.html.haml b/app/views/shared/dossiers/_demande.html.haml index 83f329e21..58f1c07e1 100644 --- a/app/views/shared/dossiers/_demande.html.haml +++ b/app/views/shared/dossiers/_demande.html.haml @@ -2,9 +2,9 @@ - content_for(:notice_info) do = render partial: "shared/dossiers/france_connect_informations_notice", locals: { user_information: dossier.france_connect_information } -.fr-container.counter-start-header-section - .fr-grid-row - .fr-col-12.fr-col-offset-lg-2.fr-col-lg-8 +.fr-container.counter-start-header-section.dossier-show + .fr-grid-row.fr-grid-row--center + .fr-col-12.fr-col-lg-10.fr-col-xl-8 %h2.fr-h6.fr-background-alt--grey.fr-mb-0 .flex-grow.fr-py-3v.fr-px-4v= t('views.shared.dossiers.demande.en_construction') @@ -13,7 +13,13 @@ .tab-title %h2.fr-h6.fr-background-alt--grey.fr-mb-0.flex - .flex-grow.fr-py-3v.fr-px-4v= t('views.shared.dossiers.demande.requester_identity') + .flex-grow.fr-py-3v.fr-px-4v + = t('views.shared.dossiers.demande.requester_identity') + + - if dossier.identity_updated_at.present? && demande_seen_at&.<(dossier.identity_updated_at) + %span.fr-badge.fr-badge--new.fr-badge--sm + = t('views.shared.dossiers.demande.requester_identity_updated_at', date: try_format_datetime(dossier.identity_updated_at)) + - if dossier.etablissement.present? && profile == 'usager' && !dossier.read_only? = link_to t('views.shared.dossiers.demande.edit_siret'), siret_dossier_path(dossier), class: 'fr-py-3v fr-btn fr-btn--tertiary-no-outline' @@ -21,11 +27,6 @@ = link_to t('views.shared.dossiers.demande.edit_identity'), identite_dossier_path(dossier), class: 'fr-py-3v fr-btn fr-btn--tertiary-no-outline' - - if dossier.identity_updated_at.present? && demande_seen_at&.<(dossier.identity_updated_at) - %span.highlighted - modifié le - = try_format_datetime(dossier.identity_updated_at) - .fr-my-4v.fr-px-4v = render partial: "shared/dossiers/user_infos", locals: { user_deleted: dossier.user_deleted?, email: dossier.user_email_for(:display) } diff --git a/app/views/shared/dossiers/_identite_entreprise.html.haml b/app/views/shared/dossiers/_identite_entreprise.html.haml index cc986b887..e94f3a946 100644 --- a/app/views/shared/dossiers/_identite_entreprise.html.haml +++ b/app/views/shared/dossiers/_identite_entreprise.html.haml @@ -6,46 +6,46 @@ %p Il nʼest pas possible dʼaccepter ou de refuser un dossier sans cette étape. .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 SIRET : - .champ-content.fr-text-action-high--grey + %p.champ-label SIRET : + .champ-content %p= etablissement.siret - else - if etablissement.diffusable_commercialement == false && profile != 'instructeur' .fr-my-2v - .champ-content.fr-text-action-high--grey + .champ-content %p= t('warning_for_private_info', scope: 'views.shared.dossiers.identite_entreprise', siret: pretty_siret(etablissement.siret)) - else .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Dénomination : - .champ-content.fr-text-action-high--grey + %p.champ-label Dénomination : + .champ-content %p= raison_sociale_or_name(etablissement) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 SIRET : - .champ-content.fr-text-action-high--grey + %p.champ-label SIRET : + .champ-content %p #{pretty_siret(etablissement.siret)} #{ render Dsfr::CopyButtonComponent.new(text: etablissement.siret, title: "Copier le siret dans le presse-papier", success: "Le siret a été copié dans le presse-papier") } - unless local_assigns[:short_identity] - if etablissement.siret != etablissement.entreprise.siret_siege_social .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 SIRET du siège social: - .champ-content.fr-text-action-high--grey + %p.champ-label SIRET du siège social: + .champ-content %p= etablissement.entreprise.siret_siege_social .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Forme juridique : - .champ-content.fr-text-action-high--grey + %p.champ-label Forme juridique : + .champ-content %p= sanitize(etablissement.entreprise.forme_juridique) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Libellé NAF : - .champ-content.fr-text-action-high--grey + %p.champ-label Libellé NAF : + .champ-content %p= etablissement.libelle_naf .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Code NAF : - .champ-content.fr-text-action-high--grey + %p.champ-label Code NAF : + .champ-content %p= etablissement.naf .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Date de création : - .champ-content.fr-text-action-high--grey + %p.champ-label Date de création : + .champ-content %p = try_format_date(etablissement.entreprise.date_creation) @@ -54,42 +54,42 @@ - if profile == 'instructeur' .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 + %p.champ-label Effectif mensuel = try_format_mois_effectif(etablissement) (URSSAF) : - .champ-content.fr-text-action-high--grey + .champ-content %p= etablissement.entreprise_effectif_mensuel .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 + %p.champ-label Effectif moyen annuel = etablissement.entreprise_effectif_annuel_annee (URSSAF) : - .champ-content.fr-text-action-high--grey + .champ-content %p= etablissement.entreprise_effectif_annuel .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Effectif de l'organisation (INSEE) : - .champ-content.fr-text-action-high--grey + %p.champ-label Effectif de l'organisation (INSEE) : + .champ-content %p = effectif(etablissement) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Numéro de TVA intracommunautaire : - .champ-content.fr-text-action-high--grey + %p.champ-label Numéro de TVA intracommunautaire : + .champ-content %p= etablissement.entreprise.numero_tva_intracommunautaire .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Adresse : - .champ-content.fr-text-action-high--grey + %p.champ-label Adresse : + .champ-content %p - etablissement.adresse.split("\n").each do |line| = line %br .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Capital social : - .champ-content.fr-text-action-high--grey + %p.champ-label Capital social : + .champ-content %p= pretty_currency(etablissement.entreprise.capital_social) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Chiffre d’affaires : - .champ-content.fr-text-action-high--grey + %p.champ-label Chiffre d’affaires : + .champ-content %p - if profile == 'instructeur' %details @@ -115,12 +115,12 @@ = render partial: 'shared/dossiers/identite_entreprise_bilan_detail', locals: { libelle: 'Besoin en fonds de roulement', key: 'besoin_en_fonds_de_roulement', etablissement: etablissement } .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 + %p.champ-label Chiffres financiers clés (Banque de France) = "en #{pretty_currency_unit(etablissement.entreprise_bilans_bdf_monnaie)} :" - if controller.is_a?(Instructeurs::AvisController) - .champ-content.fr-text-action-high--grey + .champ-content %p Les consulter = link_to "au format csv", bilans_bdf_instructeur_avis_path(@avis, format: 'csv') @@ -129,7 +129,7 @@ ou = link_to "au format ods", bilans_bdf_instructeur_avis_path(@avis, format: 'ods') - else - .champ-content.fr-text-action-high--grey + .champ-content %p Les consulter = link_to "au format csv", bilans_bdf_instructeur_dossier_path(procedure_id: @dossier.procedure.id, dossier_id: @dossier.id, format: 'csv') @@ -139,54 +139,54 @@ = link_to "au format ods", bilans_bdf_instructeur_dossier_path(procedure_id: @dossier.procedure.id, dossier_id: @dossier.id, format: 'ods') - else .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 + %p.champ-label Bilans Banque de France : - .champ-content.fr-text-action-high--grey + .champ-content %p Les 3 derniers bilans connus de votre entreprise par la Banque de France ont été joints à votre dossier. - if etablissement.entreprise_attestation_sociale.attached? .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Attestation sociale : + %p.champ-label Attestation sociale : - if profile == 'instructeur' - .champ-content.fr-text-action-high--grey + .champ-content %p= link_to "Consulter l'attestation", url_for(etablissement.entreprise_attestation_sociale) - else - .champ-content.fr-text-action-high--grey + .champ-content %p Une attestation de vigilance délivrée par l'ACOSS a été jointe à votre dossier. - if etablissement.entreprise_attestation_fiscale.attached? .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Attestation fiscale : + %p.champ-label Attestation fiscale : - if profile == 'instructeur' - .champ-content.fr-text-action-high--grey + .champ-content %p= link_to "Consulter l'attestation", url_for(etablissement.entreprise_attestation_fiscale) - else - .champ-content.fr-text-action-high--grey + .champ-content %p Une attestation fiscale délivrée par l'URSSAF a été jointe à votre dossier. - if etablissement.association? .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Numéro RNA : - .champ-content.fr-text-action-high--grey + %p.champ-label Numéro RNA : + .champ-content %p= etablissement.association_rna .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Titre : - .champ-content.fr-text-action-high--grey + %p.champ-label Titre : + .champ-content %p= etablissement.association_titre .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Objet : - .champ-content.fr-text-action-high--grey + %p.champ-label Objet : + .champ-content %p= etablissement.association_objet .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Date de création : - .champ-content.fr-text-action-high--grey + %p.champ-label Date de création : + .champ-content %p= try_format_date(etablissement.association_date_creation) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Date de publication : - .champ-content.fr-text-action-high--grey + %p.champ-label Date de publication : + .champ-content %p= try_format_date(etablissement.association_date_publication) .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Date de déclaration : - .champ-content.fr-text-action-high--grey + %p.champ-label Date de déclaration : + .champ-content %p= try_format_date(etablissement.association_date_declaration) - unless local_assigns[:short_identity] diff --git a/app/views/shared/dossiers/_identite_individual.html.haml b/app/views/shared/dossiers/_identite_individual.html.haml index 8532799d4..7a2f0748b 100644 --- a/app/views/shared/dossiers/_identite_individual.html.haml +++ b/app/views/shared/dossiers/_identite_individual.html.haml @@ -1,18 +1,18 @@ .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0= t('views.users.dossiers.identite.civility') - .champ-content.fr-text-action-high--grey + %p.champ-label= t('views.users.dossiers.identite.civility') + .champ-content %p= individual.gender .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0= t('views.users.dossiers.identite.first_name') - .champ-content.fr-text-action-high--grey + %p.champ-label= t('views.users.dossiers.identite.first_name') + .champ-content %p= individual.prenom .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0= t('views.users.dossiers.identite.last_name') - .champ-content.fr-text-action-high--grey + %p.champ-label= t('views.users.dossiers.identite.last_name') + .champ-content %p= individual.nom - if individual.birthdate.present? .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0= t('views.users.dossiers.identite.birthdate') - .champ-content.fr-text-action-high--grey + %p.champ-label= t('views.users.dossiers.identite.birthdate') + .champ-content %p= try_format_date(individual.birthdate) diff --git a/app/views/shared/dossiers/_infos_generales.html.haml b/app/views/shared/dossiers/_infos_generales.html.haml index 3f03d9639..1397a1107 100644 --- a/app/views/shared/dossiers/_infos_generales.html.haml +++ b/app/views/shared/dossiers/_infos_generales.html.haml @@ -1,27 +1,28 @@ %div - %p.fr-my-4v.fr-px-4v.fr-text-action-high--grey - = l(dossier.depose_at, format: '%d %B %Y %H:%m') + %p.fr-my-2w.fr-px-4v + = t(:submitted_at, scope: [:views, :shared, :dossiers, :form], datetime: l(dossier.depose_at)) + %br - if dossier.updated_at != dossier.depose_at - = t(:updated_at, scope: [:views, :shared, :dossiers, :form], datetime: l(dossier.updated_at, format: :long)) + = t(:updated_at, scope: [:views, :shared, :dossiers, :form], datetime: l(dossier.updated_at)) - if dossier.justificatif_motivation.attached? .fr-my-4v.fr-px-4v - %p.fr-text-action-high--grey.fr-mb-0 Justificatif : + %p.champ-label Justificatif : .champ-content.fr-text-action-high--grey .action = render Attachment::ShowComponent.new(attachment: dossier.justificatif_motivation.attachment) - if dossier.motivation.present? .fr-my-4v.fr-px-4v - %p.fr-text-action-high--grey.fr-mb-0 Motivation : + %p.champ-label Motivation : .champ-content.fr-text-action-high--grey .action = dossier.motivation - if dossier.attestation.present? .fr-my-4v.fr-px-4v - %p.fr-text-action-high--grey.fr-mb-0 Attestation : + %p.champ-label Attestation : .champ-content.fr-text-action-high--grey .action = link_to('Voir l’attestation', attestation_instructeur_dossier_path(dossier.procedure, dossier), target: '_blank', rel: 'noopener') diff --git a/app/views/shared/dossiers/_user_infos.html.haml b/app/views/shared/dossiers/_user_infos.html.haml index c52e9367d..381a157a7 100644 --- a/app/views/shared/dossiers/_user_infos.html.haml +++ b/app/views/shared/dossiers/_user_infos.html.haml @@ -1,4 +1,4 @@ .fr-my-2v - %p.fr-text-action-high--grey.fr-mb-0 Email : - .champ-content.fr-text-action-high--grey + %p.champ-label Email : + .champ-content %p= user_deleted ? "#{email} (l’usager a supprimé son compte)" : email diff --git a/app/views/users/dossiers/demande.html.haml b/app/views/users/dossiers/demande.html.haml index f6d81f1bf..e300ea4dd 100644 --- a/app/views/users/dossiers/demande.html.haml +++ b/app/views/users/dossiers/demande.html.haml @@ -3,21 +3,21 @@ - content_for :footer do = render partial: "users/procedure_footer", locals: { procedure: @dossier.procedure, dossier: @dossier } -.dossier-container.mb-4 +.dossier-container.fr-mb-4w = render partial: 'users/dossiers/show/header', locals: { dossier: @dossier } - if @dossier.en_construction? .fr-container .fr-grid-row.fr-grid-row--center - .fr-col-md-10.fr-col-lg-9 + .fr-col-md-10.fr-col-xl-9 = render Dossiers::EnConstructionNotSubmittedComponent.new(dossier: @dossier, user: current_user) = render partial: 'shared/dossiers/demande', locals: { dossier: @dossier, demande_seen_at: nil, profile: 'usager' } - .fr-container - .fr-grid-row - .fr-col-12.fr-col-offset-lg-2.fr-col-lg-8 + .fr-container.fr-mt-2w + .fr-grid-row.fr-grid-row--center + .fr-col-12.fr-col-lg-10.fr-col-xl-8 - if !@dossier.read_only? = link_to t('views.users.dossiers.demande.edit_dossier'), modifier_dossier_path(@dossier), class: 'fr-btn fr-btn-sm', 'title'=> "Modifier mon dossier tant qu'il n'est pas passé en instruction" .clearfix diff --git a/config/locales/en.yml b/config/locales/en.yml index 540124a72..ec9dd32bc 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -331,7 +331,8 @@ en: best_regards: Best Regards, dossiers: form: - updated_at: "updated at %{datetime}" + submitted_at: "Submitted on %{datetime}" + updated_at: "Updated on %{datetime}" edit: autosave: Your file is automatically saved after each modification. You can close the window at any time and pick up where you left off later. notice: "Download the notice of the procedure" @@ -344,6 +345,7 @@ en: write_message_to_administration_placeholder: "Write your message to the administration here" demande: requester_identity: "Identity of the requester" + requester_identity_updated_at: "updated on %{date}" my_identity: "My identity" form: "Form" edit_siret: "Edit SIRET" diff --git a/config/locales/fr.yml b/config/locales/fr.yml index 7779d584b..942a9404d 100644 --- a/config/locales/fr.yml +++ b/config/locales/fr.yml @@ -331,7 +331,8 @@ fr: best_regards: Bonne journée, dossiers: form: - updated_at: "modifié le %{datetime}" + submitted_at: "Déposé le %{datetime}" + updated_at: "Modifié le %{datetime}" edit: autosave: Votre dossier est enregistré automatiquement après chaque modification. Vous pouvez à tout moment fermer la fenêtre et reprendre plus tard là où vous en étiez. notice: Télécharger le guide de la démarche @@ -345,6 +346,7 @@ fr: demande: en_construction: "Date de dépôt du dossier" requester_identity: "Identité du demandeur" + requester_identity_updated_at: "modifiée le %{date}" my_identity: "Mon identité" form: "Sections du formulaire" edit_siret: "Modifier le SIRET"