warehack.ing/mcqemu
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make the hero caption human readable and align the feature cards

Browse Source 
The caption named an API call, which meant nothing to a first-time reader;
it now describes what the picture actually shows, in prose rather than
monospace.

The cards were offset because CardGrid was using the stagger prop, which
deliberately drops alternate columns down the page. Removed, so the four
cards sit in an even grid.
This commit is contained in:
Ryan Malloy 2026-08-18 12:34:01 -06:00
parent 2becca7704
commit 3e0ec930ef
2 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
docs-site/src/content/docs/index.mdx
View File

@ -21,7 +21,8 @@ hero:
decoding="async" decoding="async"
/> />
<figcaption class="vm-frame__caption"> <figcaption class="vm-frame__caption">
vm_screenshot(name="kolibri") &rarr; PNG A live capture of the guest's screen, taken while KolibriOS was
playing a game of Tetris.
</figcaption> </figcaption>
</figure> </figure>
actions: actions:
@ -37,7 +38,7 @@ hero:
import { Card, CardGrid } from '@astrojs/starlight/components'; import { Card, CardGrid } from '@astrojs/starlight/components';
<CardGrid stagger> <CardGrid>
<Card title="Disposable sandboxes" icon="rocket"> <Card title="Disposable sandboxes" icon="rocket">
One call gives you a copy-on-write clone of a base image, booted, with the One call gives you a copy-on-write clone of a base image, booted, with the
guest agent answering. One more call destroys it. The base image is never guest agent answering. One more call destroys it. The base image is never

7
docs-site/src/styles/theme.css
View File

@ -97,12 +97,13 @@
} }
.vm-frame__caption { .vm-frame__caption {
padding: 0.5rem 0.75rem; padding: 0.55rem 0.8rem;
background: var(--sl-color-gray-6); background: var(--sl-color-gray-6);
border-top: 1px solid var(--sl-color-gray-5); border-top: 1px solid var(--sl-color-gray-5);
color: var(--sl-color-gray-3); color: var(--sl-color-gray-3);
font-family: var(--sl-font-mono); font-size: 0.8rem;
font-size: 0.75rem; line-height: 1.45;
text-wrap: pretty;
} }
/* Starlight's staggered CardGrid rotates card icon backgrounds through a /* Starlight's staggered CardGrid rotates card icon backgrounds through a