73 lines
1.3 KiB
Svelte
73 lines
1.3 KiB
Svelte
<script>
|
|
import {
|
|
CodeIcon,
|
|
InfoIcon,
|
|
LanguagesIcon,
|
|
MapIcon,
|
|
PaintbrushIcon,
|
|
} from "@lucide/svelte";
|
|
import SidebarHeader from "../SidebarHeader.svelte";
|
|
import SettingsButton from "./SettingsButton.svelte";
|
|
import { getDeveloperToggle } from "./developer.svelte";
|
|
import { m } from "$lang/messages";
|
|
|
|
const dev = getDeveloperToggle();
|
|
</script>
|
|
|
|
<SidebarHeader>{m["sidebar.settings.header"]()}</SidebarHeader>
|
|
|
|
<div id="sections">
|
|
<section>
|
|
<h2>{m["sidebar.settings.general"]()}</h2>
|
|
<SettingsButton
|
|
icon={LanguagesIcon}
|
|
text={m["sidebar.language.header"]()}
|
|
view="language"
|
|
/>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>{m["sidebar.settings.map"]()}</h2>
|
|
<SettingsButton
|
|
icon={MapIcon}
|
|
text={m["sidebar.offline-maps.header"]()}
|
|
view="offline-maps"
|
|
/>
|
|
<SettingsButton
|
|
icon={PaintbrushIcon}
|
|
text={m["sidebar.map-style.header"]()}
|
|
disabled
|
|
/>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>{m["sidebar.about.header"]()}</h2>
|
|
{#if dev.current == "true"}
|
|
<SettingsButton
|
|
icon={CodeIcon}
|
|
text={m["sidebar.developer.header"]()}
|
|
view="dev-options"
|
|
/>
|
|
{/if}
|
|
<SettingsButton
|
|
icon={InfoIcon}
|
|
text={m["sidebar.about.header"]()}
|
|
view="about"
|
|
/>
|
|
</section>
|
|
</div>
|
|
|
|
<style>
|
|
section {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
#sections {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1rem;
|
|
}
|
|
</style>
|