Simplification
This commit is contained in:
@@ -19,8 +19,8 @@
|
||||
</true>
|
||||
<false>
|
||||
<section class="empty-state" aria-labelledby="dashboard-empty-title">
|
||||
<h2 class="card-title" id="dashboard-empty-title">Aucun article</h2>
|
||||
<p>Commence par créer un premier article.</p>
|
||||
<h2 class="card-title" id="dashboard-empty-title">Aucun article.</h2>
|
||||
<p>Crée un article pour commencer.</p>
|
||||
</section>
|
||||
</false>
|
||||
</check>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<header class="page-header">
|
||||
<div>
|
||||
<h1 class="page-title" id="media-title">Médiathèque</h1>
|
||||
<p class="field-help">Parcourir les images par page évite de charger toute la bibliothèque d'un coup.</p>
|
||||
<p class="field-help">Ajoute une image ou copie son Markdown pour l’insérer dans un article.</p>
|
||||
</div>
|
||||
|
||||
<div class="page-actions">
|
||||
@@ -13,11 +13,11 @@
|
||||
<form class="panel stack" method="post" action="{{ 'media_upload' | alias }}" enctype="multipart/form-data">
|
||||
<include href="partials/csrf_field.html" />
|
||||
<label class="field">
|
||||
<span class="field-label">Nouvelle image</span>
|
||||
<span class="field-label">Image</span>
|
||||
<input class="control" type="file" name="image" accept="image/jpeg,image/png" required>
|
||||
<span class="field-help">Formats : JPG, PNG. Taille maximale : 10 Mo.</span>
|
||||
</label>
|
||||
<button class="button" type="submit">Envoyer</button>
|
||||
<button class="button" type="submit">Ajouter</button>
|
||||
</form>
|
||||
|
||||
<check if="{{ @items }}">
|
||||
@@ -31,8 +31,8 @@
|
||||
</true>
|
||||
<false>
|
||||
<section class="empty-state" aria-labelledby="media-empty-title">
|
||||
<h2 class="card-title" id="media-empty-title">Aucune image</h2>
|
||||
<p>Ajoute ta première image.</p>
|
||||
<h2 class="card-title" id="media-empty-title">Aucune image.</h2>
|
||||
<p>Ajoute une image pour commencer.</p>
|
||||
</section>
|
||||
</false>
|
||||
</check>
|
||||
|
||||
@@ -7,79 +7,44 @@
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="editor-layout" data-editor-layout>
|
||||
<form class="panel stack editor-form" method="post" action="{{ @formAction }}">
|
||||
<include href="partials/csrf_field.html" />
|
||||
<form class="panel stack editor-form" method="post" action="{{ @formAction }}">
|
||||
<include href="partials/csrf_field.html" />
|
||||
|
||||
<label class="field">
|
||||
<span class="field-label">Titre</span>
|
||||
<input class="control" type="text" name="title" value="{{ @post.title }}" maxlength="{{ @titleMax }}" required data-char-count>
|
||||
<span class="char-counter"><span data-char-count-value>0</span> / {{ @titleMax }}</span>
|
||||
</label>
|
||||
<label class="field">
|
||||
<span class="field-label">Titre</span>
|
||||
<input class="control" type="text" name="title" value="{{ @post.title }}" maxlength="{{ @titleMax }}" required data-char-count>
|
||||
<span class="char-counter"><span data-char-count-value>0</span> / {{ @titleMax }}</span>
|
||||
</label>
|
||||
|
||||
<label class="field">
|
||||
<span class="field-label">Extrait</span>
|
||||
<textarea class="control" name="excerpt" rows="3" maxlength="{{ @excerptMax }}" required data-char-count>{{ @post.excerpt }}</textarea>
|
||||
<span class="char-counter"><span data-char-count-value>0</span> / {{ @excerptMax }}</span>
|
||||
</label>
|
||||
<label class="field">
|
||||
<span class="field-label">Extrait</span>
|
||||
<textarea class="control" name="excerpt" rows="3" maxlength="{{ @excerptMax }}" required data-char-count>{{ @post.excerpt }}</textarea>
|
||||
<span class="char-counter"><span data-char-count-value>0</span> / {{ @excerptMax }}</span>
|
||||
</label>
|
||||
|
||||
<section class="field">
|
||||
<div class="field-head">
|
||||
<div>
|
||||
<h2 class="field-label">Contenu</h2>
|
||||
<p class="field-help">Markdown avec insertion d’image au curseur. La première image du contenu est utilisée dans les cartes d’article.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="toolbar" role="toolbar" aria-label="Outils Markdown">
|
||||
<button class="tool-button" type="button" data-md-action="bold"><strong>Gras</strong></button>
|
||||
<button class="tool-button" type="button" data-md-action="italic"><em>Italique</em></button>
|
||||
<button class="tool-button" type="button" data-md-action="heading">Titre</button>
|
||||
<button class="tool-button" type="button" data-md-action="list">Liste</button>
|
||||
<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>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">Laisse une ligne vide entre deux blocs Markdown (titre, liste, citation, image, code).</p>
|
||||
</section>
|
||||
|
||||
<button class="button" type="submit">Enregistrer</button>
|
||||
</form>
|
||||
|
||||
<aside class="media-picker is-hidden" data-media-picker>
|
||||
<div class="media-picker__head">
|
||||
<section class="field">
|
||||
<div class="field-head">
|
||||
<div>
|
||||
<strong data-media-picker-title>Insérer une image</strong>
|
||||
<p class="field-help" data-media-picker-help>Clique sur une image pour l’insérer dans l’article.</p>
|
||||
<h2 class="field-label">Contenu</h2>
|
||||
<p class="field-help">Rédige en Markdown. La première image du contenu sert de visuel dans les listes d’articles.</p>
|
||||
</div>
|
||||
<button class="button button--ghost button--small" type="button" data-media-picker-close>Fermer</button>
|
||||
</div>
|
||||
|
||||
<check if="{{ @mediaItems }}">
|
||||
<true>
|
||||
<div class="media-picker__grid">
|
||||
<repeat group="{{ @mediaItems }}" value="{{ @item }}">
|
||||
<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>
|
||||
</div>
|
||||
<check if="{{ @mediaPickerTruncated }}">
|
||||
<true>
|
||||
<p class="field-help">Affichage limité aux {{ @mediaPickerLimit }} images les plus récentes sur {{ @mediaCount }}. Utilise la <a href="{{ 'media_index' | alias }}">médiathèque</a> pour parcourir toute la bibliothèque.</p>
|
||||
</true>
|
||||
</check>
|
||||
</true>
|
||||
<false>
|
||||
<section class="empty-state" aria-labelledby="media-picker-empty-title">
|
||||
<h2 class="card-title" id="media-picker-empty-title">Aucune image disponible</h2>
|
||||
<p>Ajoute une image depuis la médiathèque.</p>
|
||||
</section>
|
||||
</false>
|
||||
</check>
|
||||
</aside>
|
||||
</div>
|
||||
<div class="toolbar" role="toolbar" aria-label="Outils Markdown">
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="bold"><strong>Gras</strong></button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="italic"><em>Italique</em></button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="heading">Titre</button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="list">Liste</button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="quote">Citation</button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="link">Lien</button>
|
||||
<button class="button button--ghost button--small" type="button" data-md-action="code">Code</button>
|
||||
<a class="button button--ghost button--small" href="{{ 'media_index' | alias }}" target="_blank" rel="noopener">Ouvrir la médiathèque</a>
|
||||
</div>
|
||||
|
||||
<textarea class="control editor-textarea" name="body_markdown" rows="18" required data-markdown-editor>{{ @post.body_markdown }}</textarea>
|
||||
<p class="field-help">Laisse une ligne vide entre deux blocs. Pour ajouter une image, ouvre la médiathèque, copie le Markdown, puis colle-le ici.</p>
|
||||
</section>
|
||||
|
||||
<button class="button" type="submit">Enregistrer</button>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user