39 lines
739 B
Svelte
39 lines
739 B
Svelte
|
|
<script lang="ts">
|
||
|
|
import { bookmark_del, bookmarks_store } from "lib/Bookmarks";
|
||
|
|
import { highlight_current_page } from "lib/HighlightCurrentPage";
|
||
|
|
</script>
|
||
|
|
|
||
|
|
{#each $bookmarks_store as bookmark}
|
||
|
|
<div class="row">
|
||
|
|
<a class="button" href="/d/{bookmark.id}" use:highlight_current_page>
|
||
|
|
<i class="icon">{bookmark.icon}</i>
|
||
|
|
<span class="hide_small">{bookmark.label}</span>
|
||
|
|
</a>
|
||
|
|
<button on:click={() => bookmark_del(bookmark.id)}>
|
||
|
|
<i class="icon">delete</i>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
{/each}
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.row {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
.row>a {
|
||
|
|
flex: 1 1 auto;
|
||
|
|
}
|
||
|
|
.row>button {
|
||
|
|
flex: 0 0 auto;
|
||
|
|
}
|
||
|
|
.button {
|
||
|
|
background: none;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
@media(max-width: 1000px) {
|
||
|
|
.hide_small {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|