lib/Highlight: add button to disable slicing

This commit is contained in:
mei (ckie) 2024-10-05 22:19:47 +03:00
parent d985dadfe9
commit e41c15ae6c
Signed by: ckie
GPG key ID: 13E79449C0525215
2 changed files with 14 additions and 2 deletions

View file

@ -8,10 +8,18 @@
export let alt;
let renderedCode;
$: renderedCode = slice ? code.replace(/#<hidden>[^]*?#<\/hidden>/, "") : code;;
$: renderedCode = slice ? code.replace(/#<hidden>[^]*?#<\/hidden>/, "") : code;
</script>
<p class="sr-only">{alt}</p>
<div class="whitespace-pre-wrap font-mono" aria-hidden title={alt}>
<div class="whitespace-pre-wrap font-mono relative" aria-hidden title={alt}>
<Highlight {language} code={renderedCode} />
<button
class="top-0 right-0 absolute font-sans text-xs font-bold"
class:text-blue-500={slice}
on:click={() => { slice = !slice }}
>
({slice ? "show" : "hide"} full)
</button>
</div>

View file

@ -17,5 +17,9 @@ with import <nixpkgs> { }; nixos
enable = true;
settings.PermitRootLogin = "yes";
};
# run with:
# nix-build vm.nix -A vm && (rm nixos.qcow2 ; QEMU_NET_OPTS='hostfwd=tcp::3000-:80' ./result/bin/run-nixos-vm)
# xdg-open http://localhost:3000
#</hidden>
}