From d2eb5973804a441878328ad502cf9b4252012a78 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Wed, 4 Jul 2018 10:46:59 +0200 Subject: [PATCH 01/12] =?UTF-8?q?admin:=20fix=20Proc=C3=A9dures=20pluraliz?= =?UTF-8?q?ation=20and=20accent?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_left_panel_admin_procedurescontroller_index.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/layouts/left_panels/_left_panel_admin_procedurescontroller_index.html.haml b/app/views/layouts/left_panels/_left_panel_admin_procedurescontroller_index.html.haml index 362576da5..759b08b57 100644 --- a/app/views/layouts/left_panels/_left_panel_admin_procedurescontroller_index.html.haml +++ b/app/views/layouts/left_panels/_left_panel_admin_procedurescontroller_index.html.haml @@ -2,7 +2,7 @@ .en-cours %b = dossier_count = current_administrateur.procedures.count - = "Procedures".pluralize(dossier_count) + = "Procédure".pluralize(dossier_count) #action-block From 1fb1d92fe7f35be7597414064d8b8a526144a6b9 Mon Sep 17 00:00:00 2001 From: Mathieu Magnin Date: Mon, 9 Jul 2018 11:46:12 +0200 Subject: [PATCH 02/12] Temporary fix to allow users to download files with extensions --- app/views/shared/champs/piece_justificative/_pj_link.html.haml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/views/shared/champs/piece_justificative/_pj_link.html.haml b/app/views/shared/champs/piece_justificative/_pj_link.html.haml index d808058a4..9fd18ee30 100644 --- a/app/views/shared/champs/piece_justificative/_pj_link.html.haml +++ b/app/views/shared/champs/piece_justificative/_pj_link.html.haml @@ -1,7 +1,8 @@ - pj = champ.piece_justificative_file - if champ.virus_scan.present? - if champ.virus_scan.safe? - = link_to pj.filename.to_s, url_for(pj), target: '_blank' + #FIXME : use url_for(pj) and remove download attribute when Riak content_disposition bug is solved https://github.com/betagouv/tps/issues/2180 + = link_to pj.filename.to_s, pj.service_url(expires_in: 1.hour), target: '_blank', download: pj.filename.to_s - else = pj.filename.to_s - if champ.virus_scan.pending? From adab8e44ff24bc99c3d7673800ce4fdeb319aef5 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Mon, 9 Jul 2018 18:16:59 +0200 Subject: [PATCH 03/12] form: add spacing between paragraphs --- app/assets/stylesheets/new_design/forms.scss | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/new_design/forms.scss b/app/assets/stylesheets/new_design/forms.scss index b60b2ba5e..3f20293ea 100644 --- a/app/assets/stylesheets/new_design/forms.scss +++ b/app/assets/stylesheets/new_design/forms.scss @@ -25,6 +25,10 @@ @include notice-text-style; display: block; margin-top: $default-spacer; + + p { + margin-bottom: $default-spacer; + } } &.required { @@ -249,7 +253,10 @@ .explication { background-color: $light-grey; padding: $default-padding; - margin-bottom: 2 * $default-padding; + + p:not(:last-child) { + margin-bottom: $default-padding; + } } .send-wrapper { From c4bf47398e18e61eadf0de779959783b2dd44361 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Mon, 9 Jul 2018 18:18:42 +0200 Subject: [PATCH 04/12] form: add missing spacing after explanations --- app/assets/stylesheets/new_design/forms.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/new_design/forms.scss b/app/assets/stylesheets/new_design/forms.scss index 3f20293ea..c45075e7e 100644 --- a/app/assets/stylesheets/new_design/forms.scss +++ b/app/assets/stylesheets/new_design/forms.scss @@ -251,8 +251,9 @@ } .explication { - background-color: $light-grey; + margin-bottom: 2 * $default-padding; padding: $default-padding; + background-color: $light-grey; p:not(:last-child) { margin-bottom: $default-padding; From e5de401107aa1c0d93445f1f553c4484cab66409 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Mon, 9 Jul 2018 18:29:32 +0200 Subject: [PATCH 05/12] form: make the sample asterisk also red --- app/assets/stylesheets/new_design/forms.scss | 8 ++++---- app/views/shared/dossiers/_edit.html.haml | 18 +++++++++++------- 2 files changed, 15 insertions(+), 11 deletions(-) diff --git a/app/assets/stylesheets/new_design/forms.scss b/app/assets/stylesheets/new_design/forms.scss index c45075e7e..a984f5806 100644 --- a/app/assets/stylesheets/new_design/forms.scss +++ b/app/assets/stylesheets/new_design/forms.scss @@ -12,15 +12,15 @@ color: $grey; } + .mandatory { + color: $dark-red; + } + label { margin-bottom: $default-padding; display: block; font-weight: bold; - .mandatory { - color: $dark-red; - } - .notice { @include notice-text-style; display: block; diff --git a/app/views/shared/dossiers/_edit.html.haml b/app/views/shared/dossiers/_edit.html.haml index f67399e73..e03afa09e 100644 --- a/app/views/shared/dossiers/_edit.html.haml +++ b/app/views/shared/dossiers/_edit.html.haml @@ -1,19 +1,23 @@ .container = render partial: "shared/dossiers/submit_is_over", locals: { dossier: dossier } - - if notice_url(dossier.procedure).present? - %p - Pour vous aider à remplir votre dossier, vous pouvez consulter - = link_to 'le guide de cette démarche', notice_url(dossier.procedure), { target: '_blank' } - - %p.thanks Les champs avec une astérisque (*) sont obligatoires. - - if apercu - form_options = { url: '', method: :get, html: { class: 'form', multipart: true } } - else - form_options = { html: { class: 'form', multipart: true, novalidate: dossier.brouillon? } } = form_for dossier, form_options do |f| + + - if notice_url(dossier.procedure).present? + %p + Pour vous aider à remplir votre dossier, vous pouvez consulter + = link_to 'le guide de cette démarche', notice_url(dossier.procedure), { target: '_blank' } + + %p.thanks + Les champs avec une astérisque ( + %span.mandatory> * + ) sont obligatoires. + = f.fields_for :champs, dossier.champs do |champ_form| - champ = champ_form.object = render partial: "shared/dossiers/editable_champs/editable_champ", From d113ca6ae4dac5946edb6b6f4fe520d49db36e1b Mon Sep 17 00:00:00 2001 From: Mathieu Magnin Date: Wed, 11 Jul 2018 15:46:22 +0200 Subject: [PATCH 06/12] Revert "Temporary fix to allow users to download files with extensions" This reverts commit 1fb1d92fe7f35be7597414064d8b8a526144a6b9. --- app/views/shared/champs/piece_justificative/_pj_link.html.haml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/app/views/shared/champs/piece_justificative/_pj_link.html.haml b/app/views/shared/champs/piece_justificative/_pj_link.html.haml index 9fd18ee30..d808058a4 100644 --- a/app/views/shared/champs/piece_justificative/_pj_link.html.haml +++ b/app/views/shared/champs/piece_justificative/_pj_link.html.haml @@ -1,8 +1,7 @@ - pj = champ.piece_justificative_file - if champ.virus_scan.present? - if champ.virus_scan.safe? - #FIXME : use url_for(pj) and remove download attribute when Riak content_disposition bug is solved https://github.com/betagouv/tps/issues/2180 - = link_to pj.filename.to_s, pj.service_url(expires_in: 1.hour), target: '_blank', download: pj.filename.to_s + = link_to pj.filename.to_s, url_for(pj), target: '_blank' - else = pj.filename.to_s - if champ.virus_scan.pending? From 6d26024aa1efab4554a4089d265a9f10ee56973a Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Mon, 9 Jul 2018 12:54:58 +0200 Subject: [PATCH 07/12] patron: add missing icons --- app/assets/stylesheets/new_design/icons.scss | 24 ++++++++++++++++++++ app/views/root/patron.html.haml | 6 +++++ 2 files changed, 30 insertions(+) diff --git a/app/assets/stylesheets/new_design/icons.scss b/app/assets/stylesheets/new_design/icons.scss index 0dfbb1ec5..dca469649 100644 --- a/app/assets/stylesheets/new_design/icons.scss +++ b/app/assets/stylesheets/new_design/icons.scss @@ -60,4 +60,28 @@ &.printer { background-image: image-url("icons/printer.svg"); } + + &.account { + background-image: image-url("icons/account-circle.svg"); + } + + &.person { + background-image: image-url("icons/blue-person.svg"); + } + + &.super-admin { + background-image: image-url("icons/super-admin.svg"); + } + + &.mail { + background-image: image-url("icons/mail.svg"); + } + + &.search { + background-image: image-url("icons/search-blue.svg"); + } + + &.sign-out { + background-image: image-url("icons/sign-out.svg"); + } } diff --git a/app/views/root/patron.html.haml b/app/views/root/patron.html.haml index c40b7bd4c..90466b38a 100644 --- a/app/views/root/patron.html.haml +++ b/app/views/root/patron.html.haml @@ -16,6 +16,12 @@ %span.icon.attachment %span.icon.lock %span.icon.printer + %span.icon.account + %span.icon.person + %span.icon.super-admin + %span.icon.mail + %span.icon.search + %span.icon.sign-out %h1 Formulaires From defee1d2d5a4a985bd1505464b2acdf3936aed8a Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Mon, 9 Jul 2018 13:55:58 +0000 Subject: [PATCH 08/12] tests: refactor modifier.html.haml_spec.rb to use "subject" --- .../dossiers/modifier.html.haml_spec.rb | 25 ++++++++----------- 1 file changed, 11 insertions(+), 14 deletions(-) diff --git a/spec/views/new_user/dossiers/modifier.html.haml_spec.rb b/spec/views/new_user/dossiers/modifier.html.haml_spec.rb index d6ee1e0e4..3fbfa3d1f 100644 --- a/spec/views/new_user/dossiers/modifier.html.haml_spec.rb +++ b/spec/views/new_user/dossiers/modifier.html.haml_spec.rb @@ -1,7 +1,8 @@ require 'spec_helper' describe 'new_user/dossiers/modifier.html.haml', type: :view do - let(:dossier) { create(:dossier, :with_entreprise, :with_service, state: 'brouillon', procedure: create(:procedure, :with_api_carto, :with_two_type_de_piece_justificative, for_individual: true)) } + let(:procedure) { create(:procedure, :with_api_carto, :with_two_type_de_piece_justificative, :with_notice, for_individual: true) } + let(:dossier) { create(:dossier, :with_entreprise, :with_service, state: 'brouillon', procedure: procedure) } let(:footer) { view.content_for(:footer) } before do @@ -9,21 +10,17 @@ describe 'new_user/dossiers/modifier.html.haml', type: :view do assign(:dossier, dossier) end - context 'test de composition de la page' do - before do - render - end + subject! { render } - it 'affiche le libellé de la procédure' do - expect(rendered).to have_text(dossier.procedure.libelle) - end + it 'affiche le libellé de la procédure' do + expect(rendered).to have_text(dossier.procedure.libelle) + end - it 'affiche les boutons de validation' do - expect(rendered).to have_selector('.send-wrapper') - end + it 'affiche les boutons de validation' do + expect(rendered).to have_selector('.send-wrapper') + end - it 'prépare le footer' do - expect(footer).to have_selector('footer') - end + it 'prépare le footer' do + expect(footer).to have_selector('footer') end end From 97a92e279b25bf536bc0b4eac6fde1712eccdb90 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Wed, 11 Jul 2018 17:10:56 +0200 Subject: [PATCH 09/12] assets: add the info icon --- app/assets/images/icons/info-blue.svg | 1 + app/assets/stylesheets/new_design/icons.scss | 5 +++++ app/views/root/patron.html.haml | 1 + 3 files changed, 7 insertions(+) create mode 100644 app/assets/images/icons/info-blue.svg diff --git a/app/assets/images/icons/info-blue.svg b/app/assets/images/icons/info-blue.svg new file mode 100644 index 000000000..6e1db0579 --- /dev/null +++ b/app/assets/images/icons/info-blue.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/stylesheets/new_design/icons.scss b/app/assets/stylesheets/new_design/icons.scss index dca469649..c640357d0 100644 --- a/app/assets/stylesheets/new_design/icons.scss +++ b/app/assets/stylesheets/new_design/icons.scss @@ -84,4 +84,9 @@ &.sign-out { background-image: image-url("icons/sign-out.svg"); } + + &.info { + background-image: image-url("icons/info-blue.svg"); + object-fit: contain; + } } diff --git a/app/views/root/patron.html.haml b/app/views/root/patron.html.haml index 90466b38a..be4844693 100644 --- a/app/views/root/patron.html.haml +++ b/app/views/root/patron.html.haml @@ -22,6 +22,7 @@ %span.icon.mail %span.icon.search %span.icon.sign-out + %span.icon.info %h1 Formulaires From 2ef6f46ef4a1c5a351c46461fcef1d27da0c78c2 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Wed, 11 Jul 2018 17:11:19 +0200 Subject: [PATCH 10/12] style: add the styling for hr elements inside forms --- app/assets/stylesheets/new_design/forms.scss | 9 +++++++++ app/views/root/patron.html.haml | 2 ++ 2 files changed, 11 insertions(+) diff --git a/app/assets/stylesheets/new_design/forms.scss b/app/assets/stylesheets/new_design/forms.scss index a984f5806..11988feab 100644 --- a/app/assets/stylesheets/new_design/forms.scss +++ b/app/assets/stylesheets/new_design/forms.scss @@ -7,6 +7,15 @@ margin-bottom: 20px; } + hr { + width: 100%; + height: 0; + margin-top: $default-padding; + margin-bottom: 2 * $default-padding; + border: none; + border-bottom: 1px solid $border-grey; + } + @mixin notice-text-style { font-size: 14px; color: $grey; diff --git a/app/views/root/patron.html.haml b/app/views/root/patron.html.haml index be4844693..e2d3e5ad7 100644 --- a/app/views/root/patron.html.haml +++ b/app/views/root/patron.html.haml @@ -38,6 +38,8 @@ = f.submit 'Enregistrer un brouillon (formnovalidate)', formnovalidate: true, class: 'button send' = f.submit 'Envoyer', class: 'button send' + %hr + %h1 Boutons %p From 02829949908ae459d5f52a0ef2b7e107d302a244 Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Wed, 11 Jul 2018 17:11:44 +0200 Subject: [PATCH 11/12] form: move the procedure notice link to a button --- .../stylesheets/new_design/dossier-edit.scss | 17 +++++++++++++++-- app/views/shared/dossiers/_edit.html.haml | 19 +++++++++++-------- .../dossiers/modifier.html.haml_spec.rb | 9 +++++++++ 3 files changed, 35 insertions(+), 10 deletions(-) diff --git a/app/assets/stylesheets/new_design/dossier-edit.scss b/app/assets/stylesheets/new_design/dossier-edit.scss index a2bd0a6fb..cce0af864 100644 --- a/app/assets/stylesheets/new_design/dossier-edit.scss +++ b/app/assets/stylesheets/new_design/dossier-edit.scss @@ -15,7 +15,20 @@ } } - .thanks { - padding: (1.5 * $default-padding) 0; + .prologue { + margin: (1.5 * $default-padding) 0; + display: flex; + flex-wrap: wrap; + align-items: baseline; + + .mandatory-explanation { + flex-grow: 1; // Push the "notice" button to the right + flex-shrink: 1; // Allow the text to shrink + margin-bottom: $default-spacer; // Leave space when the "notice" button wraps under the text + } + + .button.notice { + flex-shrink: 0; // Display the button label on a single line + } } } diff --git a/app/views/shared/dossiers/_edit.html.haml b/app/views/shared/dossiers/_edit.html.haml index e03afa09e..83f4d2867 100644 --- a/app/views/shared/dossiers/_edit.html.haml +++ b/app/views/shared/dossiers/_edit.html.haml @@ -8,15 +8,18 @@ = form_for dossier, form_options do |f| - - if notice_url(dossier.procedure).present? - %p - Pour vous aider à remplir votre dossier, vous pouvez consulter - = link_to 'le guide de cette démarche', notice_url(dossier.procedure), { target: '_blank' } + .prologue + .mandatory-explanation + Les champs avec une astérisque ( + %span.mandatory> * + ) sont obligatoires. - %p.thanks - Les champs avec une astérisque ( - %span.mandatory> * - ) sont obligatoires. + - if notice_url(dossier.procedure).present? + = link_to notice_url(dossier.procedure), class: 'button notice', title: "Pour vous aider à remplir votre dossier, vous pouvez consulter le guide de cette démarche." do + %span.icon.info> + Guide de la démarche + + %hr = f.fields_for :champs, dossier.champs do |champ_form| - champ = champ_form.object diff --git a/spec/views/new_user/dossiers/modifier.html.haml_spec.rb b/spec/views/new_user/dossiers/modifier.html.haml_spec.rb index 3fbfa3d1f..7db3fce4e 100644 --- a/spec/views/new_user/dossiers/modifier.html.haml_spec.rb +++ b/spec/views/new_user/dossiers/modifier.html.haml_spec.rb @@ -16,6 +16,10 @@ describe 'new_user/dossiers/modifier.html.haml', type: :view do expect(rendered).to have_text(dossier.procedure.libelle) end + it 'affiche un lien vers la notice' do + expect(rendered).to have_link("Guide de la démarche", href: url_for(procedure.notice)) + end + it 'affiche les boutons de validation' do expect(rendered).to have_selector('.send-wrapper') end @@ -23,4 +27,9 @@ describe 'new_user/dossiers/modifier.html.haml', type: :view do it 'prépare le footer' do expect(footer).to have_selector('footer') end + + context 'quand la procédure ne comporte pas de notice' do + let(:procedure) { create(:procedure) } + it { is_expected.not_to have_link("Guide de la démarche") } + end end From da0a505cbc15709b571d035f955e3bfaf23aa1db Mon Sep 17 00:00:00 2001 From: Pierre de La Morinerie Date: Wed, 11 Jul 2018 15:24:22 +0000 Subject: [PATCH 12/12] form: add folder icon next to the procedure title --- app/assets/stylesheets/new_design/dossier-edit.scss | 4 ++++ app/views/new_user/dossiers/modifier.html.haml | 4 +++- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/new_design/dossier-edit.scss b/app/assets/stylesheets/new_design/dossier-edit.scss index cce0af864..cfea3941d 100644 --- a/app/assets/stylesheets/new_design/dossier-edit.scss +++ b/app/assets/stylesheets/new_design/dossier-edit.scss @@ -12,6 +12,10 @@ h1 { font-size: 22px; + + .icon.folder { + vertical-align: -3px; + } } } diff --git a/app/views/new_user/dossiers/modifier.html.haml b/app/views/new_user/dossiers/modifier.html.haml index 169aca13c..f7fd7a58f 100644 --- a/app/views/new_user/dossiers/modifier.html.haml +++ b/app/views/new_user/dossiers/modifier.html.haml @@ -4,6 +4,8 @@ .dossier-edit .dossier-header .container - %h1= @dossier.procedure.libelle + %h1 + %span.icon.folder + = @dossier.procedure.libelle = render partial: "shared/dossiers/edit", locals: { dossier: @dossier, apercu: false }