Implement a help macro #22
Comments
|
For anyone looking for this I wipped up a quick poc. Plop this in your chevron folder <!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/full.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<div class="container mx-auto columns-1 ">
<h1 class="text-8xl font-extrabold text-slate-300">Macros Help</h1>
<table class="table mx-auto table-auto text-lg">
<thead>
<tr>
<th class="">Name</th>
<th class="">Triggers</th>
<th class="max-w-s text-center">Search?</th>
<th class="max-w-s text-center">Goto?</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script src="./config.js"></script>
<script>
const check = '<span class="text-green-400">✓</span>'
const cross = '<span class="text-red-400">x</span>'
const table = document.querySelector('tbody');
let prevCat = "";
for (const m of window.CONFIG.macros.sort(e => e.category)) {
if (m.category !== prevCat) {
prevCat = m.category;
const catTemplate = `
<td colspan="4" class="py-3 my-3 text-extrabold text-xl bg-zinc-900">${m.category}</td>
`
table.innerHTML += catTemplate;
}
const template = `
<tr>
<td>${m.name}</td>
<td><code>${m.triggers.join(", ")}</code></td>
<td class="text-center">${m.commands && m.commands.search ? check : cross}</td>
<td class="text-center">${m.commands && m.commands.go ? check : cross}</td>
</tr>
`
table.innerHTML += template;
}
</script>
</body>
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Default help macro that would redirect to a local view, which is a list of macros. It helps to keep in mind what macros we have.
It would just be an app that displays the macro dic in a fancy way
The text was updated successfully, but these errors were encountered: