sudacode/mokuro-reader
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Cleanup settings button

Browse Source
This commit is contained in:
ZXY101
2023-09-28 08:06:47 +02:00
parent d190264c86
commit 35bab3f86b
3 changed files with 21 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/lib/components/NavBar.svelte
View File

@@ -5,7 +5,6 @@
import { page } from '$app/stores'; import { page } from '$app/stores';
import Settings from './Settings/Settings.svelte'; import Settings from './Settings/Settings.svelte';
import UploadModal from './UploadModal.svelte'; import UploadModal from './UploadModal.svelte';
import { settings } from '$lib/settings';
import Icon from '$lib/assets/icon.webp'; import Icon from '$lib/assets/icon.webp';
let settingsHidden = true; let settingsHidden = true;
@@ -40,16 +39,6 @@
<UploadSolid class="hover:text-primary-700" on:click={() => (uploadModalOpen = true)} /> <UploadSolid class="hover:text-primary-700" on:click={() => (uploadModalOpen = true)} />
</div> </div>
</Navbar> </Navbar>
{#if isReader}
<button
on:click={openSettings}
class="hover:text-primary-700 fixed opacity-50 hover:opacity-100 right-10 top-5 p-10 m-[-2.5rem]"
>
<div style:background-color={$settings.backgroundColor} class="absolute">
<UserSettingsSolid class="mix-blend-difference" />
</div>
</button>
{/if}
</div> </div>
<Settings bind:hidden={settingsHidden} /> <Settings bind:hidden={settingsHidden} />

2
src/lib/components/Reader/Reader.svelte
View File

@@ -14,6 +14,7 @@
import { afterUpdate, onMount } from 'svelte'; import { afterUpdate, onMount } from 'svelte';
import Cropper from './Cropper.svelte'; import Cropper from './Cropper.svelte';
import { page as pageStore } from '$app/stores'; import { page as pageStore } from '$app/stores';
import SettingsButton from './SettingsButton.svelte';
$: volume = $catalog $: volume = $catalog
?.find((item) => item.id === $pageStore.params.manga) ?.find((item) => item.id === $pageStore.params.manga)
@@ -182,6 +183,7 @@
<svelte:head> <svelte:head>
<title>{volume?.mokuroData.volume || 'Volume'}</title> <title>{volume?.mokuroData.volume || 'Volume'}</title>
</svelte:head> </svelte:head>
<SettingsButton />
{#if volume && pages} {#if volume && pages}
<Cropper /> <Cropper />
<Popover placement="bottom-end" trigger="click" triggeredBy="#page-num" class="z-20"> <Popover placement="bottom-end" trigger="click" triggeredBy="#page-num" class="z-20">

19
src/lib/components/Reader/SettingsButton.svelte Normal file
View File

@@ -0,0 +1,19 @@
<script lang="ts">
import Settings from '$lib/components/Settings/Settings.svelte';
import { UserSettingsSolid } from 'flowbite-svelte-icons';
let settingsHidden = true;
function openSettings() {
settingsHidden = false;
}
</script>
<button
on:click={openSettings}
class="hover:text-primary-700 hover:mix-blend-normal mix-blend-difference z-10 fixed opacity-50 hover:opacity-100 right-10 top-5 p-10 m-[-2.5rem]"
>
<UserSettingsSolid />
</button>
<Settings bind:hidden={settingsHidden} />