74 lines
1.3 KiB
Text
74 lines
1.3 KiB
Text
|
---
|
||
|
|
interface Command {
|
||
|
|
name: string;
|
||
|
|
syntax: string;
|
||
|
|
description: string;
|
||
|
|
}
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
commands: Command[];
|
||
|
|
}
|
||
|
|
|
||
|
|
const { commands } = Astro.props;
|
||
|
|
---
|
||
|
|
|
||
|
|
<div class="command-table-wrapper">
|
||
|
|
<table class="command-table">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>Command</th>
|
||
|
|
<th>Syntax</th>
|
||
|
|
<th>Description</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
{commands.map((cmd) => (
|
||
|
|
<tr>
|
||
|
|
<td><code>{cmd.name}</code></td>
|
||
|
|
<td><code>{cmd.syntax}</code></td>
|
||
|
|
<td>{cmd.description}</td>
|
||
|
|
</tr>
|
||
|
|
))}
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.command-table-wrapper {
|
||
|
|
overflow-x: auto;
|
||
|
|
margin: 1rem 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.command-table {
|
||
|
|
width: 100%;
|
||
|
|
border-collapse: collapse;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.command-table th {
|
||
|
|
background: var(--sl-color-gray-6);
|
||
|
|
font-weight: 600;
|
||
|
|
text-align: left;
|
||
|
|
padding: 0.6rem 0.8rem;
|
||
|
|
border-bottom: 2px solid var(--sl-color-gray-5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.command-table td {
|
||
|
|
padding: 0.5rem 0.8rem;
|
||
|
|
border-bottom: 1px solid var(--sl-color-gray-5);
|
||
|
|
vertical-align: top;
|
||
|
|
}
|
||
|
|
|
||
|
|
.command-table tr:hover {
|
||
|
|
background: var(--sl-color-gray-7);
|
||
|
|
}
|
||
|
|
|
||
|
|
.command-table code {
|
||
|
|
font-size: 0.85em;
|
||
|
|
background: var(--sl-color-bg-inline-code);
|
||
|
|
padding: 0.1em 0.3em;
|
||
|
|
border-radius: 3px;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
</style>
|