- drop Bulma and Font Awesome, plain CSS built on charte.css - dashboard: GitHub-like calendar grouped by year, selected day panel (sticky side column on desktop, bottom bar on mobile), keyboard navigation - public page: today's mood and last months fit in one screen, journal hidden - day log page: mode picker as pills, illustration follows the chosen mode - login, password and invitation screens in French, global flash messages - add User#current_mode_since Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
38 lines
2.1 KiB
Text
38 lines
2.1 KiB
Text
<% content_for :title, "Charte Kluk" %>
|
||
<article class="texte">
|
||
<h1>Charte graphique Kluk</h1>
|
||
<p><em>Les composants de la charte, rendus par les partials de app/views/charte.</em></p>
|
||
|
||
<p>Texte courant en Atkinson Hyperlegible Next, avec <a href="#">un lien souligné de vert</a>, du <strong>gras</strong>, de l’<em>italique</em> et du <code>code</code>.</p>
|
||
|
||
<p><%= render "charte/bouton", texte: "Bouton principal", href: "#" %></p>
|
||
<p><%= render "charte/bouton", texte: "Petit bouton", href: "#", petit: true %></p>
|
||
|
||
<%= render "charte/tasses" %>
|
||
|
||
<h2>Intertitre de section</h2>
|
||
<p>Les intertitres ménagent un grand espace au-dessus d’eux pour découper la page en respirations.</p>
|
||
|
||
<%= render "charte/exergue", texte: "Une phrase mise en exergue, en serif, soulignée d’un trait orange." %>
|
||
|
||
<%= render "charte/photo", src: "croisiere.jpg", alt: "Photo d’exemple", legende: "Légende facultative sous la photo." %>
|
||
<%= render "charte/photo_attente", description: "Description de la photo attendue." %>
|
||
|
||
<%= render "charte/calendrier", jours: "vvovvvg vvvvovv ovvrvvv vvgvvvo ovvvvvv rrovrrr rorrvvo gvggggg gggvggg gogggvg ggoggvg vvgvvvv ovvvovv vrvvvov vvvvovv ovvgvvv vvovvrv vvvovvv vgvvvvo vvvvovv" %>
|
||
|
||
<%= form_with url: "#", class: "formulaire", data: { turbo: false } do |f| %>
|
||
<%= render "charte/champ", form: f, attribut: :email, libelle: "Votre adresse mail", precision: "(obligatoire)" do %>
|
||
<%= f.email_field :email, autocomplete: "email" %>
|
||
<% end %>
|
||
<%= render "charte/champ", form: f, attribut: :mot_de_passe, libelle: "Mot de passe" do %>
|
||
<%= f.password_field :mot_de_passe %>
|
||
<% end %>
|
||
<%= render "charte/champ", form: f, attribut: :message, libelle: "Un mot, une idée, une question ?", precision: "(facultatif)" do %>
|
||
<%= f.text_area :message, rows: 5 %>
|
||
<% end %>
|
||
<%= render "charte/formulaire_erreur", messages: ["Message d’erreur du formulaire."] %>
|
||
<%= f.submit "Envoyer", class: "bouton" %>
|
||
<% end %>
|
||
|
||
<%= render "charte/note", texte: "Une note discrète en fin de page." %>
|
||
</article>
|