First commit

app/Views/admin/dashboard.html

@@ -0,0 +1,27 @@
+<section class="stack-lg" aria-labelledby="dashboard-title">
+  <header class="page-header">
+    <h1 class="page-title" id="dashboard-title">Tableau de bord</h1>
+
+    <div class="page-actions">
+      <a class="button" href="{{ @BASE }}/dashboard/posts/create">Nouvel article</a>
+      <a class="button button--ghost" href="{{ @BASE }}/dashboard/media">Médiathèque</a>
+    </div>
+  </header>
+
+  <check if="{{ @posts }}">
+    <true>
+      <div class="card-grid">
+        <repeat group="{{ @posts }}" value="{{ @post }}">
+          <include href="partials/post_card_admin.html" />
+        </repeat>
+      </div>
+      <include href="partials/pagination.html" />
+    </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>
+      </section>
+    </false>
+  </check>
+</section>

app/Views/admin/media.html

@@ -0,0 +1,35 @@
+<section class="stack-lg" aria-labelledby="media-title">
+  <header class="page-header">
+    <h1 class="page-title" id="media-title">Médiathèque</h1>
+
+    <div class="page-actions">
+      <a class="button button--ghost" href="{{ @BASE }}/dashboard">Retour</a>
+    </div>
+  </header>
+
+  <form class="panel stack" method="post" action="{{ @BASE }}/dashboard/media" enctype="multipart/form-data">
+    <input type="hidden" name="csrf_token" value="{{ @csrfToken }}">
+    <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.</span>
+    </label>
+    <button class="button" type="submit">Envoyer</button>
+  </form>
+
+  <check if="{{ @items }}">
+    <true>
+      <div class="card-grid">
+        <repeat group="{{ @items }}" value="{{ @item }}">
+          <include href="partials/media_card.html" />
+        </repeat>
+      </div>
+    </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>
+      </section>
+    </false>
+  </check>
+</section>

app/Views/admin/post_form.html

@@ -0,0 +1,107 @@
+<section class="stack-lg" aria-labelledby="post-form-title">
+  <header class="page-header">
+    <h1 class="page-title" id="post-form-title">{{ @pageTitle }}</h1>
+
+    <div class="page-actions">
+      <a class="button button--ghost" href="{{ @BASE }}/dashboard">Retour</a>
+    </div>
+  </header>
+
+  <div class="editor-layout" data-editor-layout>
+    <form class="panel stack editor-form" method="post" action="{{ @formAction }}">
+      <input type="hidden" name="csrf_token" value="{{ @csrfToken }}">
+      <input type="hidden" name="cover_media_id" value="{{ @post.cover_media_id }}" data-cover-input>
+
+      <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>
+
+      <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 d’image au curseur.</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="markdown">Image</button>
+        </div>
+
+        <textarea class="control editor-textarea" name="body_markdown" rows="18" required data-markdown-editor>{{ @post.body_markdown }}</textarea>
+      </section>
+
+      <button class="button" type="submit">Enregistrer</button>
+    </form>
+
+    <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>
+        </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-id="{{ @item.id }}" data-media-url="{{ @item.url }}" data-media-markdown="{{ @item.markdown }}">
+                <img class="media-frame media-frame--square" src="{{ @item.url }}" alt="">
+              </button>
+            </repeat>
+          </div>
+        </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>
+</section>