Less home code more F3

This commit is contained in:
julien
2026-03-30 00:00:03 +02:00
parent d71cf304a9
commit fac7f60190
30 changed files with 818 additions and 1552 deletions

View File

@@ -14,8 +14,8 @@
<include href="partials/csrf_field.html" />
<label class="field">
<span class="field-label">Nouvelle image</span>
<input class="control" type="file" name="image" accept="image/jpeg,image/png,image/webp" required>
<span class="field-help">Formats acceptés : JPG, PNG, WebP. Limite : 10 Mo, 8000 × 8000 px et 40 mégapixels.</span>
<input class="control" type="file" name="image" accept="image/jpeg,image/png" required>
<span class="field-help">Formats acceptés : JPG et PNG. Limite : 10 Mo. Les fichiers sont stockés tels quels, sans transformation.</span>
</label>
<button class="button" type="submit">Envoyer</button>
</form>

View File

@@ -10,7 +10,6 @@
<div class="editor-layout" data-editor-layout>
<form class="panel stack editor-form" method="post" action="{{ @formAction }}">
<include href="partials/csrf_field.html" />
<input type="hidden" name="cover_media_id" value="{{ @post.cover_media_id }}" data-cover-input>
<label class="field">
<span class="field-label">Titre</span>
@@ -24,38 +23,11 @@
<span class="char-counter"><span data-char-count-value>0</span> / {{ @excerptMax }}</span>
</label>
<section class="field cover-field">
<div class="field-head">
<div>
<h2 class="field-label">Image de couverture</h2>
<p class="field-help">Choisis une image si tu veux une couverture.</p>
</div>
</div>
<div class="cover-picker">
<check if="{{ @coverPreview }}">
<true>
<img class="media-frame media-frame--large cover-preview" data-cover-preview src="{{ @coverPreview.url }}" alt="">
<div class="media-frame media-frame--large media-frame--placeholder is-hidden" data-cover-placeholder>Aucune image</div>
</true>
<false>
<div class="media-frame media-frame--large media-frame--placeholder" data-cover-placeholder>Aucune image</div>
<img class="media-frame media-frame--large cover-preview is-hidden" data-cover-preview alt="Aperçu couverture">
</false>
</check>
<div class="button-row">
<button class="button button--ghost" type="button" data-media-picker-open="cover">Choisir une image</button>
<button class="button button--ghost" type="button" data-cover-clear {{ @post.cover_media_id ? '' : 'disabled' }}>Retirer</button>
</div>
</div>
</section>
<section class="field">
<div class="field-head">
<div>
<h2 class="field-label">Contenu</h2>
<p class="field-help">Markdown simple, avec insertion dimage au curseur.</p>
<p class="field-help">Markdown simple, avec insertion dimage au curseur. La première image sert aussi de vignette sur les cartes darticle.</p>
</div>
</div>
@@ -67,10 +39,11 @@
<button class="tool-button" type="button" data-md-action="quote">Citation</button>
<button class="tool-button" type="button" data-md-action="link">Lien</button>
<button class="tool-button" type="button" data-md-action="code">Code</button>
<button class="tool-button" type="button" data-media-picker-open="markdown">Image</button>
<button class="tool-button" type="button" data-media-picker-open>Image</button>
</div>
<textarea class="control editor-textarea" name="body_markdown" rows="18" required data-markdown-editor>{{ @post.body_markdown }}</textarea>
<p class="field-help">Astuce : avec le parseur Markdown de F3, laisse une ligne vide entre deux blocs (titre, liste, citation, image, code) pour un rendu fiable.</p>
</section>
<button class="button" type="submit">Enregistrer</button>
@@ -79,8 +52,8 @@
<aside class="media-picker is-hidden" data-media-picker>
<div class="media-picker__head">
<div>
<strong data-media-picker-title>Choisir une image</strong>
<p class="field-help" data-media-picker-help>Choisis une image de la médiathèque.</p>
<strong data-media-picker-title>Insérer une image</strong>
<p class="field-help" data-media-picker-help>Clique sur une image pour linsérer dans larticle.</p>
</div>
<button class="button button--ghost button--small" type="button" data-media-picker-close>Fermer</button>
</div>
@@ -89,7 +62,7 @@
<true>
<div class="media-picker__grid">
<repeat group="{{ @mediaItems }}" value="{{ @item }}">
<button class="media-picker__item" type="button" data-media-picker-select data-media-id="{{ @item.id }}" data-media-url="{{ @item.url }}" data-media-markdown="{{ @item.markdown }}">
<button class="media-picker__item" type="button" data-media-picker-select data-media-markdown="{{ @item.markdown }}">
<img class="media-frame media-frame--square" src="{{ @item.url }}" alt="">
</button>
</repeat>