Docs: refresh screenshots for 1.12.0

astro.config.mjs

@@ -44,12 +44,12 @@ export default defineConfig({
         { tag: 'link', attrs: { rel: 'apple-touch-icon', href: '/apple-touch-icon.png' } },
         { tag: 'link', attrs: { rel: 'manifest', href: '/manifest.webmanifest' } },
         { tag: 'meta', attrs: { name: 'theme-color', content: '#0d1117' } },
-        { tag: 'meta', attrs: { property: 'og:image', content: `${SITE}/img/og.jpg` } },
+        { tag: 'meta', attrs: { property: 'og:image', content: `${SITE}/img/og-7da9dc1a.jpg` } },
         { tag: 'meta', attrs: { property: 'og:image:width', content: '1200' } },
         { tag: 'meta', attrs: { property: 'og:image:height', content: '630' } },
         { tag: 'meta', attrs: { property: 'og:site_name', content: 'Stackyard' } },
         { tag: 'meta', attrs: { name: 'twitter:card', content: 'summary_large_image' } },
-        { tag: 'meta', attrs: { name: 'twitter:image', content: `${SITE}/img/og.jpg` } },
+        { tag: 'meta', attrs: { name: 'twitter:image', content: `${SITE}/img/og-7da9dc1a.jpg` } },
       ],
 
       expressiveCode: {

src/content/docs/docs/adding-services.md

@@ -12,7 +12,7 @@ Apps are added under **Dashboard** in the admin UI. Nothing here edits a file by
 Press <span class="sy-btn sy-btn--primary">Add</span>, then fill in the app.
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/app-edit-basics.png" alt="The app edit form, showing Name, URL, Icon and Color" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-basics-dark.png" alt="The app edit form, showing Name, URL, Icon and Color" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/app-edit-basics-b3c6980e.png" alt="The app edit form, showing Name, URL, Icon and Color" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-basics-dark-2910e8f5.png" alt="The app edit form, showing Name, URL, Icon and Color" loading="lazy">
   <figcaption>Name, URL, icon and tile colour. Icon takes a name, a URL, or an upload.</figcaption>
 </figure>
 
@@ -49,14 +49,14 @@ Create one from <span class="sy-btn sy-btn--primary">Add</span>, name it, then u
 The Dashboard list holds everything on the grid in one flat list. List order is grid order. Drag a row's handle, or use the arrows on the row, and the new order is saved straight away. There is nothing to confirm.
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/dashboard-list.png" alt="The Dashboard list, with drag handles, move arrows and an Edit button on each row" loading="lazy"><img class="sy-shot__dark" src="/img/admin/dashboard-list-dark.png" alt="The Dashboard list, with drag handles, move arrows and an Edit button on each row" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/dashboard-list-0d98d7b7.png" alt="The Dashboard list, with drag handles, move arrows and an Edit button on each row" loading="lazy"><img class="sy-shot__dark" src="/img/admin/dashboard-list-dark-e87991d0.png" alt="The Dashboard list, with drag handles, move arrows and an Edit button on each row" loading="lazy">
   <figcaption>Each row carries a drag handle, the move arrows, and Edit.</figcaption>
 </figure>
 
 Rows are tagged with what is configured on them.
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/dashboard-apps.png" alt="The list filtered to apps, showing Dock and Badge tags" loading="lazy"><img class="sy-shot__dark" src="/img/admin/dashboard-apps-dark.png" alt="The list filtered to apps, showing Dock and Badge tags" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/dashboard-apps-3dd6a50c.png" alt="The list filtered to apps, showing Dock and Badge tags" loading="lazy"><img class="sy-shot__dark" src="/img/admin/dashboard-apps-dark-34e8c0e1.png" alt="The list filtered to apps, showing Dock and Badge tags" loading="lazy">
   <figcaption>Filtered to apps. The move arrows are hidden while a filter is on, so reordering is disabled until you clear it.</figcaption>
 </figure>
 

src/content/docs/docs/badges.md

@@ -31,7 +31,7 @@ A badge is the small pill on the corner of an app tile. It carries context witho
 Each kind is turned on per app, in that app's edit form under Badge.
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/app-edit-badge.png" alt="The Badge section of an app's edit form: Health Check, Fixed Label and Live Activity" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-badge-dark.png" alt="The Badge section of an app's edit form: Health Check, Fixed Label and Live Activity" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/app-edit-badge-8cf6ea34.png" alt="The Badge section of an app's edit form: Health Check, Fixed Label and Live Activity" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-badge-dark-48e1e5f8.png" alt="The Badge section of an app's edit form: Health Check, Fixed Label and Live Activity" loading="lazy">
   <figcaption>The three kinds, each with its own toggle. Live Activity opens the API fields when it is on.</figcaption>
 </figure>
 
@@ -75,7 +75,7 @@ Enter the API URL and press <span class="sy-btn sy-btn--ghost">Fetch</span>. Sta
 One poll can feed several labels. Each names one number from the response and carries its own text, colour, unit and threshold.
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/app-edit-labels.png" alt="Two label cards in an app's edit form, each with Value, Label Text, Color, Unit and Show From, above the Add Label button" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-labels-dark.png" alt="Two label cards in an app's edit form, each with Value, Label Text, Color, Unit and Show From, above the Add Label button" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/app-edit-labels-27443940.png" alt="Two label cards in an app's edit form, each with Value, Label Text, Color, Unit and Show From, above the Add Label button" loading="lazy"><img class="sy-shot__dark" src="/img/admin/app-edit-labels-dark-4998668a.png" alt="Two label cards in an app's edit form, each with Value, Label Text, Color, Unit and Show From, above the Add Label button" loading="lazy">
   <figcaption>Press Add Label for another. Drag a card by its handle to reorder it, or use the arrows.</figcaption>
 </figure>
 

src/content/docs/docs/customization.md

@@ -19,7 +19,7 @@ Browsers only allow Keep Screen Awake over HTTPS. On a plain HTTP address the to
 
 
 <figure class="sy-shot">
-  <img class="sy-shot__light" src="/img/admin/appearance.png" alt="The Appearance section of the admin UI" loading="lazy"><img class="sy-shot__dark" src="/img/admin/appearance-dark.png" alt="The Appearance section of the admin UI" loading="lazy">
+  <img class="sy-shot__light" src="/img/admin/appearance-d7bb5b62.png" alt="The Appearance section of the admin UI" loading="lazy"><img class="sy-shot__dark" src="/img/admin/appearance-dark-e18f071b.png" alt="The Appearance section of the admin UI" loading="lazy">
   <figcaption>Appearance, in the admin UI.</figcaption>
 </figure>
 

src/content/docs/docs/index.md

@@ -7,7 +7,7 @@ Stackyard is a self-hosted dashboard for the services on your network: a launche
 
 Most dashboards are a wall of numbers and charts. Stackyard is built to be glanced at a hundred times a day without feeling cluttered.
 
-<img src="/img/dashboard-c33a4d22.jpg" width="1800" height="1125" alt="The Stackyard dashboard, showing widgets, app tiles, a folder and the dock." />
+<img src="/img/dashboard-c1303e4c.jpg" width="1800" height="1125" alt="The Stackyard dashboard, showing widgets, app tiles, a folder and the dock." />
 
 That is the whole interface. Widgets across the top, apps and folders below, a dock at the bottom, and everything on it added through the web UI.
 

src/pages/index.astro

@@ -10,7 +10,7 @@ const description =
 
 const site = Astro.site?.href.replace(/\/$/, '') ?? '';
 const canonical = `${site}/`;
-const ogImage = `${site}/img/og.jpg`;
+const ogImage = `${site}/img/og-7da9dc1a.jpg`;
 
 const publisher = {
   '@type': 'Organization',