demarches-normaliennes/app/views/root/patron.html.haml

351 lines
10 KiB
Text
Raw Normal View History

2017-06-14 14:42:09 +02:00
.patron
.container
2019-10-23 12:07:21 +02:00
%h1 Icônes
2017-07-27 16:16:14 +02:00
%span.icon.follow
%span.icon.unfollow
%span.icon.archive
%span.icon.unarchive
%span.icon.folder
2019-03-26 17:55:40 +01:00
%span.icon.new-folder
%span.icon.accept
%span.icon.refuse
%span.icon.without-continuation
%span.icon.edit
%span.icon.in-progress
%span.icon.bubble
%span.icon.attached
%span.icon.lock
%span.icon.add
%span.icon.justificatif
%span.icon.printer
2018-07-09 12:54:58 +02:00
%span.icon.account
%span.icon.person
%span.icon.super-admin
%span.icon.mail
%span.icon.reply
2018-07-09 12:54:58 +02:00
%span.icon.search
%span.icon.sign-out
2018-07-11 17:10:56 +02:00
%span.icon.info
2019-03-11 17:26:44 +01:00
%span.icon.delete
%span.icon.help
%span.icon.phone
%span.icon.clock
%span.icon.preview
%span.icon.retry
%span.icon.download
%span.icon.download-white
%span.icon.move-handle
2018-08-08 17:37:41 +02:00
%span.icon.frown
%span.icon.meh
%span.icon.smile
2017-07-27 16:16:14 +02:00
2017-07-18 15:39:21 +02:00
%h1 Formulaires
2017-06-14 17:39:46 +02:00
2017-06-20 11:13:24 +02:00
%form.form
2017-08-02 14:56:08 +02:00
= form_for @dossier, url: '', html: { class: 'form' } do |f|
= f.fields_for :champs_public do |champ_form|
= render EditableChamp::EditableChampComponent.new champ: champ_form.object, form: champ_form
2017-08-02 14:56:08 +02:00
.editable-champ.editable-champ-text
%label Mot de passe
%input{ type: "password", value: "12345678" }
%h3.header-subsection Bouton radio verticaux
.radios.vertical
= f.label :archived, value: true do
= f.radio_button :archived, true
Option A
%p.notice Une option tout à fait valable.
= f.label :archived, value: false do
= f.radio_button :archived, false
Option B
%p.notice Une autre option, pas mal non plus.
2019-10-23 12:07:21 +02:00
%h3.header-subsection Interrupteur
%label.toggle-switch
= f.check_box :archived, class: 'toggle-switch-checkbox'
%span.toggle-switch-control.round
%span.toggle-switch-label.on Activé
%span.toggle-switch-label.off Désactivé
2017-08-02 14:56:08 +02:00
.send-wrapper
= f.submit 'Enregistrer un brouillon (formnovalidate)', formnovalidate: true, class: 'button send'
= f.submit 'Envoyer', class: 'button send primary'
2017-06-14 17:39:46 +02:00
%hr
2017-07-18 15:39:21 +02:00
%h1 Boutons
2017-06-14 14:42:09 +02:00
.patron-section
2017-06-20 11:13:24 +02:00
= link_to ".button", "#", class: "button"
2017-06-14 14:42:09 +02:00
2017-06-20 11:13:24 +02:00
= link_to ".button.primary", "#", class: "button primary"
2017-06-14 14:42:09 +02:00
2017-06-26 11:40:28 +02:00
= link_to ".button.secondary", "#", class: "button secondary"
= link_to ".button.danger", "#", class: "button danger"
2017-12-12 14:53:36 +01:00
= link_to "#", class: "button" do
%span.icon.follow
= "Bouton avec icone et texte"
= link_to "#", class: "button icon-only" do
%span.icon.follow
.patron-section
%button.button{ disabled: true } .button.disabled
%button.button.primary{ disabled: true } .button.primary.disabled
%button.button.secondary{ disabled: true } .button.secondary.disabled
%button.button.danger{ disabled: true } .button.danger.disabled
.patron-section
2018-07-24 17:43:07 +02:00
= link_to ".button.accepted", "#", class: "button accepted"
= link_to ".button.refused", "#", class: "button refused"
= link_to ".button.without-continuation", "#", class: "button without-continuation"
.patron-section
= link_to ".button.small", "#", class: "button small"
= link_to ".button.small.primary", "#", class: "button small primary"
.patron-section
2017-06-20 11:13:24 +02:00
= link_to ".button.large", "#", class: "button large"
2017-06-14 14:42:09 +02:00
2017-06-20 11:13:24 +02:00
= link_to ".button.large.primary", "#", class: "button large primary"
2017-06-14 14:57:30 +02:00
.patron-section
2017-06-20 11:13:24 +02:00
= link_to ".button.primary.expand", "#", class: "button primary expand"
2019-03-12 14:38:29 +01:00
%h1 Dropdown
.dropdown
.button.primary.dropdown-button .button.primary.dropdown-button
.dropdown-content.fade-in-down
%ul.dropdown-items
%li .dropdown-content ul.dropdown-items li
%li .dropdown-content ul.dropdown-items li
.dropdown
.button.dropdown-button .button.dropdown-button
.dropdown-content.fade-in-down
%ul.dropdown-items
%li
%a{ href: '#' }
%span.icon.mail
.dropdown-description
%h4 Action
%p Explanation
%li
%a{ href: '#' }
%span.icon.edit
.dropdown-description
%h4 Other action
%p Explanation
2019-03-12 14:38:29 +01:00
.dropdown
.button.dropdown-button .button.dropdown-button (left)
.dropdown-content.fade-in-down.left-aligned
%ul.dropdown-items
%li .dropdown-content.left-aligned ul.dropdown-items li
%li .dropdown-content.left-aligned ul.dropdown-items li
2017-07-18 15:39:21 +02:00
%h1 Labels
2017-07-03 16:29:29 +02:00
%span.label .label
2018-03-29 10:39:43 +02:00
%span.label.brouillon .label.brouillon
2017-07-27 14:53:18 +02:00
%span.label.instruction .label.instruction
%span.label.construction .label.construction
%span.label.accepted .label.accepted
2017-07-27 14:53:18 +02:00
%span.label.refused .label.refused
%span.label.without-continuation .label.without-continuation
2017-07-03 16:29:29 +02:00
2017-09-20 15:47:57 +02:00
%h1 Badges
%span.badge 1
%span.badge.warning 1
2017-07-18 15:39:21 +02:00
%h1 Cards
2017-07-06 15:49:29 +02:00
.card
.card-title
Titre de la carte
%p Et voici le contenu de la carte
2017-07-06 15:49:29 +02:00
.card.featured
.card-title
Titre de la carte mise en avant
%p Et voici le contenu de la carte
2017-07-06 15:49:29 +02:00
.card.warning
.card-title
Titre de la carte davertissement
%p Et voici le contenu de la carte
2018-06-26 17:00:01 +02:00
.card.feedback
.card-title
Titre de la carte pour demander un avis
%p Utilisez cette carte pour informer dune nouveauté produit ou demander lavis des utilisateurs.
2018-06-26 17:00:01 +02:00
2017-07-18 15:39:21 +02:00
%h1 Table
2017-07-06 16:25:51 +02:00
2017-07-27 16:02:35 +02:00
%table.table
%thead
%tr
%th Header 1
%th Header 2
%tbody
%tr
%td Table Data 1
%td Table Data 2
%tr
2017-07-27 16:27:29 +02:00
%td Table Data 3
%td Table Data 4
%h2 Hoverable (.table.hoverable)
%table.table.hoverable
%thead
%tr
%th Header 1
%th Header 2
%tbody
%tr
%td Table Data 1
%td Table Data 2
%tr
2017-07-27 16:02:35 +02:00
%td Table Data 3
%td Table Data 4
%h2 Vertical layout (.table.vertical)
%table.table.vertical
2017-07-06 16:25:51 +02:00
%tbody
%tr
%th Header 1
%td Table Data 1
%tr
%th Header 2
%td Table Data 2
2017-07-11 16:50:29 +02:00
%tr
%th.header-section{ colspan: 2 } Header section
2017-07-06 16:25:51 +02:00
%tr
%th Header 3
%td Table Data 3
2017-07-18 15:39:21 +02:00
%h1 Header
.sub-header
2017-07-18 15:03:04 +02:00
.container
Titre
2021-12-24 18:10:50 +01:00
%nav.tabs
%ul
= tab_item("Onglet actif", "#", active: true)
= tab_item("Onglet inactif", "#")
= tab_item("Onglet avec badge", "#", badge: 2)
= tab_item("Onglet avec notification", "#", notification: true)
2017-07-18 15:03:04 +02:00
.container
2017-07-18 15:39:21 +02:00
%h1 Breadcrumbs
2017-07-18 15:38:31 +02:00
%ul.breadcrumbs
%li
2018-09-05 14:48:42 +02:00
= link_to "Démarche 123", "#"
2017-07-18 15:38:31 +02:00
%li
= "Dossier n° 38"
2017-07-18 15:39:21 +02:00
%h1 Layout deux colonnes
2017-06-20 11:13:24 +02:00
.two-columns
.columns-container
.column
Insérer ici le contenu de la colonne 1
.column
Insérer ici le contenu de la colonne 2
.container
%section.ask-avis
%h1 Inviter une personne à donner son avis
2021-05-26 15:16:30 +02:00
%p.avis-notice Linvité pourra consulter, donner un avis sur le dossier et contribuer au fil de messagerie, mais il ne pourra le modifier.
= form_for Avis.new, url: '/', html: { class: 'form' } do |f|
= f.email_field :email, placeholder: 'Adresse email', required: true
= f.text_area :introduction, rows: 3, value: 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true
.send-wrapper
= f.submit 'Demander un avis', class: 'button send'
%section.list-avis
%h1.title
Avis des invités
%span.fr-badge 1
%ul
%li.one-avis
%h2.claimant
Vous
2021-05-26 15:16:30 +02:00
%span.date Demande davis envoyée le 12/01/2012
%p Bonjour, merci de me donner votre avis sur ce dossier.
.answer.flex.align-start
2017-10-16 18:29:40 +02:00
.icon.bubble.avis-icon
.width-100
%h2.instructeur
2018-05-31 15:43:57 +02:00
= CONTACT_EMAIL
%span.date Réponse donnée le 13/01/2012
%p Je donne un avis favorable
.container
%h2.empty-text Aucun dossier
%p.empty-text-details Vous navez commencé aucune démarche pour linstant.
.container
%h1 Dsfr::CalloutComponent
%p= link_to "Documentation DSFR Mis en avant (callout)", "https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/mise-en-avant", **external_link_attributes
= render Dsfr::CalloutComponent.new(title: "Information minimale") do |c|
- c.with_body do
%p Ceci est le minimum pour afficher un callout.
= render Dsfr::CalloutComponent.new(title: "Information importante ou avertissement", theme: :warning) do |c|
- c.with_body do
Le contenu de cette description est libre.
- c.with_bottom do
%button.fr-btn Call to action
= render Dsfr::CalloutComponent.new(title: "Titre d'une information positive", theme: :success, icon: "fr-icon-message-2-fill") do |c|
- c.with_body do
%p
N'importe quelle icône
= link_to("du jeu d'icônes", "https://www.systeme-de-design.gouv.fr/elements-d-interface/fondamentaux-techniques/icones", **external_link_attributes)
peut être utilisée.
%h1 Dsfr::CardVerticalComponent
%p= link_to "Documentation DSFR Carte", "https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/carte", **external_link_attributes
.fr-grid-row.fr-grid-row--gutters.fr-py-5w
.fr-col-md-6.fr-col-12
= render Dsfr::CardVerticalComponent.new(title: "Optional title", desc: "Optional description")
.fr-col-md-6.fr-col-12
= render Dsfr::CardVerticalComponent.new(title: "With footer buttons") do |c|
- c.with_footer_button do
= link_to "Button 1", "#", class: "fr-btn", **external_link_attributes
- c.with_footer_button do
= button_tag "Button 2", class: "fr-btn fr-btn--secondary"
2022-09-14 15:32:56 +02:00
%h1 Dsfr::NoticeComponent
%p= link_to "Documentation DSFR Bandeau d'information", "https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/bandeau-d-information-importante", **external_link_attributes
2022-09-14 15:32:56 +02:00
.my-3
= render Dsfr::NoticeComponent.new(closable: true) do |c|
- c.with_title do
Titre de cette notice
= link_to "avec un lien optionnel.", "#"
Des marges verticales ont ici été rajoutées.