frontend: add animation on/off setting
This commit is contained in:
parent
a725e46ff0
commit
e3b4e28428
2 changed files with 11 additions and 1 deletions
|
@ -1,7 +1,7 @@
|
||||||
<script>
|
<script>
|
||||||
import { quintInOut } from "svelte/easing";
|
import { quintInOut } from "svelte/easing";
|
||||||
import { AtSignIcon } from "svelte-feather-icons";
|
import { AtSignIcon } from "svelte-feather-icons";
|
||||||
import { overlayStore, userInfoStore, smallViewport, theme } from "../../stores";
|
import { overlayStore, userInfoStore, smallViewport, theme, doAnimations } from "../../stores";
|
||||||
import { logOut } from "../../auth";
|
import { logOut } from "../../auth";
|
||||||
import { maybeFade, maybeFly } from "../../animations";
|
import { maybeFade, maybeFly } from "../../animations";
|
||||||
|
|
||||||
|
@ -74,6 +74,14 @@
|
||||||
<button class="button selection-option full-width selected" class:selected="{ $theme === "dark" }" on:click="{ () => theme.set('dark') }">Dark</button>
|
<button class="button selection-option full-width selected" class:selected="{ $theme === "dark" }" on:click="{ () => theme.set('dark') }">Dark</button>
|
||||||
<button class="button selection-option full-width" class:selected="{ $theme === "light" }" on:click="{ () => theme.set('light') }">Light</button>
|
<button class="button selection-option full-width" class:selected="{ $theme === "light" }" on:click="{ () => theme.set('light') }">Light</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="separator" />
|
||||||
|
|
||||||
|
<span class="input-label">Animations</span>
|
||||||
|
<div class="horizontal-selections">
|
||||||
|
<button class="button selection-option full-width selected" class:selected="{ $doAnimations === false }" on:click="{ () => doAnimations.set(false) }">Disabled</button>
|
||||||
|
<button class="button selection-option full-width" class:selected="{ $doAnimations === true }" on:click="{ () => doAnimations.set(true) }">Enabled</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button class="button modal-secondary-action" on:click="{ close }">Close</button>
|
<button class="button modal-secondary-action" on:click="{ close }">Close</button>
|
||||||
|
|
|
@ -317,6 +317,7 @@ export const showSidebar = new Store(false, "showSidebar");
|
||||||
export const showChannelView = new Store(true, "showChannelView");
|
export const showChannelView = new Store(true, "showChannelView");
|
||||||
export const smallViewport = new Store(false, "smallViewport");
|
export const smallViewport = new Store(false, "smallViewport");
|
||||||
export const theme = new StorageItemStore("app:visual:theme");
|
export const theme = new StorageItemStore("app:visual:theme");
|
||||||
|
export const doAnimations = new StorageItemStore("app:behavior:doAnimations");
|
||||||
export const channels = new ChannelsStore();
|
export const channels = new ChannelsStore();
|
||||||
export const gatewayStatus = new GatewayStatusStore();
|
export const gatewayStatus = new GatewayStatusStore();
|
||||||
export const messagesStoreProvider = new MessagesStoreProvider();
|
export const messagesStoreProvider = new MessagesStoreProvider();
|
||||||
|
@ -329,6 +330,7 @@ export const allStores = {
|
||||||
showChannelView,
|
showChannelView,
|
||||||
smallViewport,
|
smallViewport,
|
||||||
theme,
|
theme,
|
||||||
|
doAnimations,
|
||||||
channels,
|
channels,
|
||||||
gatewayStatus,
|
gatewayStatus,
|
||||||
messagesStoreProvider,
|
messagesStoreProvider,
|
||||||
|
|
Loading…
Reference in a new issue