50 lines
1.3 KiB
HTML
50 lines
1.3 KiB
HTML
<:Head>
|
||
<title>Pinafore – General Settings</title>
|
||
</:Head>
|
||
|
||
<Layout page='settings'>
|
||
<SettingsLayout page='settings/general' label="General">
|
||
<h1>General Settings</h1>
|
||
|
||
<h2>UI Settings</h2>
|
||
<form class="ui-settings" aria-label="UI settings">
|
||
<div class="setting-group">
|
||
<input type="checkbox" id="choice-autoplay-gif"
|
||
bind:checked="$autoplayGifs" on:change="store.save()">
|
||
<label for="choice-autoplay-gif">Autoplay GIFs</label>
|
||
</div>
|
||
<div class="setting-group">
|
||
<input type="checkbox" id="choice-mark-media-sensitive"
|
||
bind:checked="$markMediaAsSensitive" on:change="store.save()">
|
||
<label for="choice-mark-media-sensitive">Always mark media as sensitive</label>
|
||
</div>
|
||
</form>
|
||
|
||
</SettingsLayout>
|
||
</Layout>
|
||
|
||
<style>
|
||
.ui-settings {
|
||
background: var(--form-bg);
|
||
border: 1px solid var(--main-border);
|
||
border-radius: 4px;
|
||
padding: 20px;
|
||
line-height: 2em;
|
||
}
|
||
.setting-group {
|
||
padding: 5px 0;
|
||
}
|
||
</style>
|
||
<script>
|
||
import Layout from '../_components/Layout.html';
|
||
import SettingsLayout from './_components/SettingsLayout.html'
|
||
import { store } from '../_store/store'
|
||
|
||
export default {
|
||
components: {
|
||
Layout,
|
||
SettingsLayout
|
||
},
|
||
store: () => store
|
||
};
|
||
</script> |