refactor(landings): with DSFR button & card components
This commit is contained in:
Colin Darie
parent
0e28a3870a
commit
b769def337
4 changed files with 47 additions and 66 deletions
15
app/components/dsfr/card_component.rb
Normal file
15
app/components/dsfr/card_component.rb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
class Dsfr::CardComponent < ApplicationComponent
|
||||
def footer_button(*args)
|
||||
@footer_buttons.push args
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def initialize(title: nil, desc: nil, footer_buttons: [])
|
||||
@title = title
|
||||
@desc = desc
|
||||
@footer_buttons = footer_buttons
|
||||
end
|
||||
|
||||
attr_reader :title, :desc, :footer_buttons
|
||||
end
|
||||
16
app/components/dsfr/card_component/card_component.html.haml
Normal file
16
app/components/dsfr/card_component/card_component.html.haml
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
.fr-card
|
||||
.fr-card__body
|
||||
.fr-card__content
|
||||
- if title
|
||||
%h1.fr-card__title
|
||||
= title
|
||||
- if desc
|
||||
%p.fr-card__desc
|
||||
= desc
|
||||
|
||||
- if footer_buttons.any?
|
||||
.fr-card__footer
|
||||
.fr-btns-group.fr-btns-group--inline-reverse.fr-btns-group--inline-lg
|
||||
%ul
|
||||
%li
|
||||
= render Dsfr::ButtonComponent.with_collection(footer_buttons)
|
||||
|
|
@ -20,17 +20,8 @@
|
|||
%h1.role-panel-title Est-ce fait pour mon administration ?
|
||||
%p.role-panel-explanation Découvrez notre outil et posez nous vos questions lors de notre démonstration en ligne ou lisez notre documentation
|
||||
|
||||
= link_to "Participer à notre démonstration en ligne",
|
||||
"https://app.livestorm.co/demarches-simplifiees/presentation-general-de-demarches-simplifieesfr",
|
||||
rel: "noopener noreferrer",
|
||||
target: "_blank",
|
||||
class: "fr-btn fr-btn--lg fr-mr-1w fr-mb-2w"
|
||||
|
||||
= link_to "Documentation",
|
||||
DOC_URL,
|
||||
rel: "noopener noreferrer",
|
||||
target: "_blank",
|
||||
class: "fr-btn fr-btn--secondary fr-btn--lg"
|
||||
= render Dsfr::ButtonComponent.new("Participer à notre démonstration en ligne", "https://app.livestorm.co/demarches-simplifiees/presentation-general-de-demarches-simplifieesfr", class: "fr-btn--lg frm-mr-1w fr-mb-2w", external: true)
|
||||
= render Dsfr::ButtonComponent.new("Documentation", DOC_URL, class: "fr-btn--secondary fr-btn--lg", external: true)
|
||||
|
||||
.role-panel-30.role-more-info-image.fr-mt-2w
|
||||
%img.role-image{ :src => image_url("landing/roles/usagers.svg"), alt: "" }
|
||||
|
|
@ -46,11 +37,8 @@
|
|||
%p.role-panel-explanation Créez un premier formulaire de test en quelques minutes
|
||||
|
||||
|
||||
= render Dsfr::ButtonComponent.new("Créer votre compte administrateur", DEMANDE_INSCRIPTION_ADMIN_PAGE_URL, class: "fr-btn--lg")
|
||||
|
||||
= link_to "Créer votre compte administrateur",
|
||||
DEMANDE_INSCRIPTION_ADMIN_PAGE_URL,
|
||||
class: "fr-btn fr-btn--lg",
|
||||
rel: "noopener noreferrer"
|
||||
%br
|
||||
%br
|
||||
%br
|
||||
|
|
@ -116,41 +104,16 @@
|
|||
.container
|
||||
.fr-grid-row.fr-grid-row--gutters.fr-py-5w
|
||||
.fr-col-md-6.fr-col-12
|
||||
.fr-card
|
||||
.fr-card__body
|
||||
.fr-card__content
|
||||
%h1.fr-card__title
|
||||
Vous êtes prêt pour dématérialiser ?
|
||||
%p.fr-card__desc
|
||||
Réduisez vos temps d’instruction de 50 %
|
||||
.fr-card__footer
|
||||
.fr-btns-group.fr-btns-group--inline-reverse.fr-btns-group--inline-lg
|
||||
.ul
|
||||
.li
|
||||
= link_to "Créer votre compte administrateur",
|
||||
DEMANDE_INSCRIPTION_ADMIN_PAGE_URL,
|
||||
rel: "noopener noreferrer",
|
||||
target: "_blank",
|
||||
class: "fr-btn"
|
||||
= render Dsfr::CardComponent.new(title: "Vous êtes prêt pour dématérialiser ?",
|
||||
desc: "Réduisez vos temps d’instruction de 50 %",
|
||||
footer_buttons: [{ url: DEMANDE_INSCRIPTION_ADMIN_PAGE_URL, label: "Créer votre compte administrateur", external: true }],
|
||||
)
|
||||
|
||||
.fr-col-md-6.fr-col-12
|
||||
.fr-card
|
||||
.fr-card__body
|
||||
.fr-card__content
|
||||
%h1.fr-card__title
|
||||
Vous voulez en savoir plus ?
|
||||
%p.fr-card__desc
|
||||
Participez à notre prochain Webinaire
|
||||
.fr-card__footer
|
||||
.fr-btns-group.fr-btns-group--inline-reverse.fr-btns-group--inline-lg
|
||||
.ul
|
||||
.li
|
||||
= link_to "Inscription à notre webinaire",
|
||||
"https://app.livestorm.co/demarches-simplifiees/presentation-general-de-demarches-simplifieesfr",
|
||||
rel: "noopener noreferrer",
|
||||
target: "_blank",
|
||||
class: "fr-btn"
|
||||
|
||||
= render Dsfr::CardComponent.new(title: "Vous voulez en savoir plus ?",
|
||||
desc: "Participez à notre prochain Webinaire",
|
||||
footer_buttons: [{ url: "https://app.livestorm.co/demarches-simplifiees/presentation-general-de-demarches-simplifieesfr", label: "Inscription à notre prochain webinaire", external: true }],
|
||||
)
|
||||
.landing-panel.cta-panel
|
||||
.container
|
||||
.cta-panel-wrapper
|
||||
|
|
@ -158,5 +121,4 @@
|
|||
%h1.cta-panel-title Une question, un problème ?
|
||||
%p.cta-panel-explanation Consultez notre FAQ
|
||||
%div
|
||||
%a.fr-btn.fr-btn--lg{ rel: 'noopener noreferrer', href:"#{ FAQ_URL }" }
|
||||
Voir la FAQ
|
||||
= render Dsfr::ButtonComponent.new("Voir la FAQ", FAQ_URL, external: true, class: "fr-btn--lg")
|
||||
|
|
|
|||
|
|
@ -26,15 +26,8 @@
|
|||
%h2.role-panel-title Vous souhaitez effectuer une demande auprès d’une administration ?
|
||||
%p.role-panel-explanation Réalisez vos demandes en toute simplicité et retrouvez vos dossiers en ligne
|
||||
|
||||
= link_to "Comment trouver ma démarche ?",
|
||||
COMMENT_TROUVER_MA_DEMARCHE_URL,
|
||||
target: "_blank",
|
||||
rel: "noopener noreferrer",
|
||||
class: "fr-btn fr-btn--lg fr-mr-1w fr-mb-2w"
|
||||
|
||||
= link_to "Se connecter",
|
||||
new_user_session_path,
|
||||
class: "fr-btn fr-btn--secondary fr-btn--lg"
|
||||
= render Dsfr::ButtonComponent.new("Comment trouver ma démarche ?", COMMENT_TROUVER_MA_DEMARCHE_URL, class: "fr-btn--lg fr-mr-1w fr-mb-2w", external: true)
|
||||
= render Dsfr::ButtonComponent.new("Se connecter", new_user_session_path, class: "fr-btn--secondary fr-btn--lg", external: true)
|
||||
|
||||
- cache "numbers-panel", :expires_in => 3.hours do
|
||||
.landing-panel
|
||||
|
|
@ -70,10 +63,7 @@
|
|||
%h2.cta-panel-title Une question, un problème ?
|
||||
%p.cta-panel-explanation La réponse est dans l’aide en ligne
|
||||
%div
|
||||
= link_to "Accéder à l’aide en ligne", FAQ_URL,
|
||||
class: "fr-btn fr-btn--lg",
|
||||
target: "_blank",
|
||||
rel: "noopener noreferrer"
|
||||
= render Dsfr::ButtonComponent.new "Accéder à l’aide en ligne", FAQ_URL, class: "fr-btn--lg", external: true
|
||||
-# 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
|
||||
|
|
@ -90,6 +80,4 @@
|
|||
%h2.cta-panel-title.grey Administration : vous voulez dématerialiser ?
|
||||
%p.cta-panel-explanation.grey Proposez à vos usagers de remplir leurs dossiers en ligne
|
||||
%div
|
||||
= link_to "Découvrez notre outil",
|
||||
administration_path,
|
||||
class: "fr-btn fr-btn--lg"
|
||||
= render Dsfr::ButtonComponent.new "Découvrez notre outil", administration_path, class: "fr-btn--lg"
|
||||
|
|
|
|||
Loading…
Reference in a new issue