colin
/
sticky-notes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update UI.

This commit is contained in:
root 2024-12-04 16:03:33 +08:00
parent 83cba54bf5
commit 7c683d9d6f
3 changed files with 47 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/notes/note-card.svelte
View File

@ -3,7 +3,6 @@
import type { Note } from '$lib/stores/notes'; import type { Note } from '$lib/stores/notes';
import { notes, tags, themeUpperCase } from '$lib/stores'; import { notes, tags, themeUpperCase } from '$lib/stores';
import NoteColorPicker from './note-color-picker.svelte'; import NoteColorPicker from './note-color-picker.svelte';
import NoteTimestamp from './note-timestamp.svelte';
import NoteContent from './note-content.svelte'; import NoteContent from './note-content.svelte';
import NoteDeleteButton from './note-delete-button.svelte'; import NoteDeleteButton from './note-delete-button.svelte';
import NoteEditButton from './note-edit-button.svelte'; import NoteEditButton from './note-edit-button.svelte';
@ -39,7 +38,6 @@
{/if} {/if}
<NoteDeleteButton {note} {noteEditorStore} /> <NoteDeleteButton {note} {noteEditorStore} />
<div class="note-card__spacer" /> <div class="note-card__spacer" />
<NoteTimestamp {note} />
<NoteColorPicker {note} {noteEditorStore} /> <NoteColorPicker {note} {noteEditorStore} />
<NoteTagButton on:click={focusTags} /> <NoteTagButton on:click={focusTags} />
</div> </div>

2
src/lib/components/notes/note-delete-button.svelte
View File

@ -2,6 +2,7 @@
import FaTrash from '$icon/fa-trash.svelte'; import FaTrash from '$icon/fa-trash.svelte';
import Button from '../button.svelte'; import Button from '../button.svelte';
import { notes } from '$lib/stores'; import { notes } from '$lib/stores';
import NoteTimestamp from './note-timestamp.svelte';
import type { Note } from '$lib/stores/notes'; import type { Note } from '$lib/stores/notes';
import FaCircleXmark from '$icon/fa-circle-xmark.svelte'; import FaCircleXmark from '$icon/fa-circle-xmark.svelte';
import FaCircleCheck from '$icon/fa-circle-check.svelte'; import FaCircleCheck from '$icon/fa-circle-check.svelte';
@ -16,6 +17,7 @@
<Button plain icon label="Delete note" on:click={() => expand('delete')}> <Button plain icon label="Delete note" on:click={() => expand('delete')}>
<FaTrash /> <FaTrash />
</Button> </Button>
<NoteTimestamp {note} />
{:else} {:else}
<div class="note-delete-confirmation"> <div class="note-delete-confirmation">
<span>Delete?</span> <span>Delete?</span>

90
src/routes/+page.svelte
View File

@ -1,45 +1,45 @@
<script lang="ts"> <script lang="ts">
import AppHeader from '$lib/components/app-header.svelte'; import AppHeader from '$lib/components/app-header.svelte';
import AppUpdatePrompt from '$lib/components/app-update-prompt.svelte'; import AppUpdatePrompt from '$lib/components/app-update-prompt.svelte';
import FilterTags from '$lib/components/filter-tags.svelte'; import FilterTags from '$lib/components/filter-tags.svelte';
import NoteSearchButton from '$lib/components/notes/note-search-button.svelte'; import NoteSearchButton from '$lib/components/notes/note-search-button.svelte';
import SettingsButton from '$lib/components/settings/settings-button.svelte'; import SettingsButton from '$lib/components/settings/settings-button.svelte';
import NoteAddButton from '$lib/components/notes/note-add-button.svelte'; import NoteAddButton from '$lib/components/notes/note-add-button.svelte';
import NoteListPlaceholder from '$lib/components/notes/note-list-placeholder.svelte'; import NoteListPlaceholder from '$lib/components/notes/note-list-placeholder.svelte';
import NoteList from '$lib/components/notes/note-list.svelte'; import NoteList from '$lib/components/notes/note-list.svelte';
import SettingsModal from '$lib/components/settings/settings-modal.svelte'; import SettingsModal from '$lib/components/settings/settings-modal.svelte';
import WelcomeModal from '$lib/components/welcome-modal.svelte'; import WelcomeModal from '$lib/components/welcome-modal.svelte';
import { notes, tags } from '$lib/stores'; import { notes, tags } from '$lib/stores';
const notesCount = notes.count; const notesCount = notes.count;
</script> </script>
<AppHeader /> <AppHeader />
<main> <main>
<section hidden={$tags.length === 0}> <section hidden={$tags.length === 0}>
<FilterTags /> <FilterTags />
</section> </section>
<section> <section>
{#if $notesCount} {#if $notesCount}
<NoteList /> <NoteList />
{:else if $notesCount === 0} {:else if $notesCount === 0}
<NoteListPlaceholder /> <NoteListPlaceholder />
{/if} {/if}
<SettingsButton /> <SettingsButton />
<NoteSearchButton /> <NoteSearchButton />
<NoteAddButton /> <NoteAddButton />
</section> </section>
</main> </main>
<WelcomeModal /> <WelcomeModal />
<SettingsModal /> <SettingsModal />
<AppUpdatePrompt /> <AppUpdatePrompt />
<style lang="scss"> <style lang="scss">
main { main {
padding: 1.5rem 1.5rem 7.5rem; padding: 1.5rem 1.5rem 7.5rem;
} }
section:last-of-type { section:last-of-type {
margin: 0; margin: 0;
} }
</style> </style>