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

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

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

90
src/routes/+page.svelte
View File

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