mirror of
https://github.com/sharkdp/bat.git
synced 2025-08-15 18:53:12 +02:00
Add Svelte as a syntax
This commit is contained in:
57
tests/syntax-tests/source/Svelte/App.svelte
Normal file
57
tests/syntax-tests/source/Svelte/App.svelte
Normal file
@ -0,0 +1,57 @@
|
||||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
import List from './List.svelte';
|
||||
import Item from './Item.svelte';
|
||||
|
||||
let item;
|
||||
let page;
|
||||
|
||||
async function hashchange() {
|
||||
// the poor man's router!
|
||||
const path = window.location.hash.slice(1);
|
||||
|
||||
if (path.startsWith('/item')) {
|
||||
const id = path.slice(6);
|
||||
item = await fetch(`https://node-hnapi.herokuapp.com/item/${id}`).then(r => r.json());
|
||||
|
||||
window.scrollTo(0,0);
|
||||
} else if (path.startsWith('/top')) {
|
||||
page = +path.slice(5);
|
||||
item = null;
|
||||
} else {
|
||||
window.location.hash = '/top/1';
|
||||
}
|
||||
}
|
||||
|
||||
onMount(hashchange);
|
||||
</script>
|
||||
|
||||
<style>
|
||||
main {
|
||||
position: relative;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
min-height: 101vh;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
main :global(.meta) {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
main :global(a) {
|
||||
color: rgb(0,0,150);
|
||||
}
|
||||
</style>
|
||||
|
||||
<svelte:window on:hashchange={hashchange}/>
|
||||
|
||||
<main>
|
||||
{#if item}
|
||||
<Item {item} returnTo="#/top/{page}"/>
|
||||
{:else if page}
|
||||
<List {page}/>
|
||||
{/if}
|
||||
</main>
|
Reference in New Issue
Block a user