Feat/upgrade daisy UI (#12)
* prune: remove daisyui config * upgrade daisyui and implement new themes * Update .env checksum
This commit is contained in:
@@ -6,22 +6,22 @@ import {
|
||||
onMounted,
|
||||
onUnmounted,
|
||||
toRefs,
|
||||
watch
|
||||
} from 'vue'
|
||||
watch,
|
||||
} from "vue"
|
||||
|
||||
import LiteLoading from '@/components/LiteLoading.vue'
|
||||
import StackedNote from '@/components/StackedNote.vue'
|
||||
import { useLinks } from '@/hooks/useLinks.hook'
|
||||
import { useMarkdown } from '@/hooks/useMarkdown.hook'
|
||||
import { useNoteView } from '@/hooks/useNoteView.hook'
|
||||
import { useRouteQueryStackedNotes } from '@/hooks/useRouteQueryStackedNotes.hook'
|
||||
import { useVisitRepo } from '@/modules/history/hooks/useVisitRepo.hook'
|
||||
import CacheAllNotes from '@/modules/note/components/CacheAllNote.vue'
|
||||
import { useUserRepoStore } from '@/modules/repo/store/userRepo.store'
|
||||
import { useUserSettings } from '@/modules/user/hooks/useUserSettings.hook'
|
||||
import LiteLoading from "@/components/LiteLoading.vue"
|
||||
import StackedNote from "@/components/StackedNote.vue"
|
||||
import { useLinks } from "@/hooks/useLinks.hook"
|
||||
import { useMarkdown } from "@/hooks/useMarkdown.hook"
|
||||
import { useNoteView } from "@/hooks/useNoteView.hook"
|
||||
import { useRouteQueryStackedNotes } from "@/hooks/useRouteQueryStackedNotes.hook"
|
||||
import { useVisitRepo } from "@/modules/history/hooks/useVisitRepo.hook"
|
||||
import CacheAllNotes from "@/modules/note/components/CacheAllNote.vue"
|
||||
import { useUserRepoStore } from "@/modules/repo/store/userRepo.store"
|
||||
import { useUserSettings } from "@/modules/user/hooks/useUserSettings.hook"
|
||||
|
||||
const HeaderNote = defineAsyncComponent(
|
||||
() => import('@/components/HeaderNote.vue')
|
||||
() => import("@/components/HeaderNote.vue"),
|
||||
)
|
||||
|
||||
const props = withDefaults(
|
||||
@@ -37,8 +37,8 @@ const props = withDefaults(
|
||||
content: null,
|
||||
parseContent: true,
|
||||
withContent: true,
|
||||
withHeader: true
|
||||
}
|
||||
withHeader: true,
|
||||
},
|
||||
)
|
||||
|
||||
const user = computed(() => props.user)
|
||||
@@ -49,17 +49,17 @@ const store = useUserRepoStore()
|
||||
useUserSettings()
|
||||
const { visitRepo } = useVisitRepo({ user: user, repo: repo })
|
||||
const { toHTML } = useMarkdown(repo)
|
||||
const { listenToClick } = useLinks('note-display')
|
||||
const { listenToClick } = useLinks("note-display")
|
||||
const { stackedNotes, scrollToTop } = useRouteQueryStackedNotes()
|
||||
|
||||
const { titles } = useNoteView('note-container')
|
||||
const { titles } = useNoteView("note-container")
|
||||
|
||||
const renderedContent = computed(() =>
|
||||
props.content !== null
|
||||
? props.parseContent
|
||||
? toHTML(props.content)
|
||||
: props.content
|
||||
: store.readme
|
||||
: store.readme,
|
||||
)
|
||||
|
||||
const hasContent = computed(() => !!renderedContent.value)
|
||||
@@ -71,7 +71,7 @@ watch(
|
||||
await nextTick()
|
||||
listenToClick()
|
||||
},
|
||||
{ immediate: true }
|
||||
{ immediate: true },
|
||||
)
|
||||
|
||||
watch(
|
||||
@@ -79,7 +79,7 @@ watch(
|
||||
() => {
|
||||
store.setUserRepo(props.user, props.repo)
|
||||
},
|
||||
{ immediate: true }
|
||||
{ immediate: true },
|
||||
)
|
||||
|
||||
onMounted(() => visitRepo())
|
||||
@@ -147,23 +147,23 @@ $header-height: 40px;
|
||||
h5,
|
||||
h6,
|
||||
strong {
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
color: var(--color-base-content);
|
||||
}
|
||||
|
||||
table {
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--color-base-content);
|
||||
background-color: var(--color-base-100);
|
||||
|
||||
thead {
|
||||
th {
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
color: var(--color-base-content);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--color-base-100);
|
||||
color: var(--color-base-content);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -233,7 +233,7 @@ $header-height: 40px;
|
||||
font-size: 0.8em;
|
||||
|
||||
a {
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
color: var(--color-base-content);
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -98,7 +98,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import ThemeSwap from '@/components/ThemeSwap.vue'
|
||||
import ThemeSwap from "@/components/ThemeSwap.vue"
|
||||
|
||||
defineProps<{ user: string; repo: string }>()
|
||||
</script>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue'
|
||||
import { computed } from "vue"
|
||||
|
||||
import { useBacklinks } from '@/hooks/useBacklinks.hook'
|
||||
import { useRouteQueryStackedNotes } from '@/hooks/useRouteQueryStackedNotes.hook'
|
||||
import { useBacklinks } from "@/hooks/useBacklinks.hook"
|
||||
import { useRouteQueryStackedNotes } from "@/hooks/useRouteQueryStackedNotes.hook"
|
||||
|
||||
const props = defineProps<{
|
||||
sha: string
|
||||
@@ -35,8 +35,8 @@ const emitNote = (sha: string) => {
|
||||
<style scoped lang="scss">
|
||||
.linked-notes {
|
||||
padding: 1rem;
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--color-base-100);
|
||||
color: var(--color-base-content);
|
||||
|
||||
.subtitle {
|
||||
font-style: italic;
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { useRegisterSW } from 'virtual:pwa-register/vue'
|
||||
import { ref } from 'vue'
|
||||
import { useRegisterSW } from "virtual:pwa-register/vue"
|
||||
import { ref } from "vue"
|
||||
|
||||
import LiteLoading from '@/components/LiteLoading.vue'
|
||||
import LiteLoading from "@/components/LiteLoading.vue"
|
||||
|
||||
const devMode = ref(false) // import.meta.env.DEV
|
||||
const isLoading = ref(false)
|
||||
@@ -57,8 +57,8 @@ const reload = () => {
|
||||
color: var(--primary-color);
|
||||
border: var(--primary-color) 2px solid;
|
||||
border-radius: 4px;
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--color-base-100);
|
||||
color: var(--color-base-content);
|
||||
}
|
||||
|
||||
.buttons {
|
||||
|
||||
@@ -5,28 +5,28 @@ import {
|
||||
nextTick,
|
||||
onMounted,
|
||||
ref,
|
||||
watch
|
||||
} from 'vue'
|
||||
watch,
|
||||
} from "vue"
|
||||
|
||||
import { useEditionMode } from '@/hooks/useEditionMode'
|
||||
import { useFile } from '@/hooks/useFile.hook'
|
||||
import { useGitHubContent } from '@/hooks/useGitHubContent.hook'
|
||||
import { useImages } from '@/hooks/useImages.hook'
|
||||
import { useLinks } from '@/hooks/useLinks.hook'
|
||||
import { useNoteOverlay } from '@/hooks/useNoteOverlay.hook'
|
||||
import { useRouteQueryStackedNotes } from '@/hooks/useRouteQueryStackedNotes.hook'
|
||||
import { useTitleNotes } from '@/hooks/useTitleNotes.hook'
|
||||
import { useUserRepoStore } from '@/modules/repo/store/userRepo.store'
|
||||
import { encodeUTF8ToBase64 } from '@/utils/decodeBase64ToUTF8'
|
||||
import { filenameToNoteTitle } from '@/utils/noteTitle'
|
||||
import { generateTweets } from '@/utils/twitter'
|
||||
import { useEditionMode } from "@/hooks/useEditionMode"
|
||||
import { useFile } from "@/hooks/useFile.hook"
|
||||
import { useGitHubContent } from "@/hooks/useGitHubContent.hook"
|
||||
import { useImages } from "@/hooks/useImages.hook"
|
||||
import { useLinks } from "@/hooks/useLinks.hook"
|
||||
import { useNoteOverlay } from "@/hooks/useNoteOverlay.hook"
|
||||
import { useRouteQueryStackedNotes } from "@/hooks/useRouteQueryStackedNotes.hook"
|
||||
import { useTitleNotes } from "@/hooks/useTitleNotes.hook"
|
||||
import { useUserRepoStore } from "@/modules/repo/store/userRepo.store"
|
||||
import { encodeUTF8ToBase64 } from "@/utils/decodeBase64ToUTF8"
|
||||
import { filenameToNoteTitle } from "@/utils/noteTitle"
|
||||
import { generateTweets } from "@/utils/twitter"
|
||||
|
||||
const LinkedNotes = defineAsyncComponent(
|
||||
() => import('@/components/LinkedNotes.vue')
|
||||
() => import("@/components/LinkedNotes.vue"),
|
||||
)
|
||||
|
||||
const EditNote = defineAsyncComponent(
|
||||
() => import('@/modules/note/components/EditNote.vue')
|
||||
() => import("@/modules/note/components/EditNote.vue"),
|
||||
)
|
||||
|
||||
const props = defineProps<{
|
||||
@@ -50,7 +50,7 @@ const {
|
||||
rawContent,
|
||||
getRawContent,
|
||||
saveCacheNote,
|
||||
getEditedSha
|
||||
getEditedSha,
|
||||
} = useFile(sha)
|
||||
const initialRawContent = ref<string | null>(null)
|
||||
const className = computed(() => `stacked-note-${props.index}`)
|
||||
@@ -62,12 +62,12 @@ const store = useUserRepoStore()
|
||||
const hasBacklinks = computed(() => store.userSettings?.backlink)
|
||||
|
||||
const { displayNoteOverlay } = useNoteOverlay(className.value, index)
|
||||
const displayedTitle = computed(() => filenameToNoteTitle(props.title ?? ''))
|
||||
const breadcrumbs = computed(() => displayedTitle.value.split(' / '))
|
||||
const displayedTitle = computed(() => filenameToNoteTitle(props.title ?? ""))
|
||||
const breadcrumbs = computed(() => displayedTitle.value.split(" / "))
|
||||
|
||||
const { updateFile } = useGitHubContent({
|
||||
user: user.value,
|
||||
repo: repo.value
|
||||
repo: repo.value,
|
||||
})
|
||||
|
||||
onMounted(async () => {
|
||||
@@ -90,13 +90,13 @@ watch([content, mode], () => {
|
||||
|
||||
watch(mode, async (newMode) => {
|
||||
const hasUserFinishedToEdit =
|
||||
newMode === 'read' && rawContent.value !== initialRawContent.value
|
||||
newMode === "read" && rawContent.value !== initialRawContent.value
|
||||
|
||||
if (!hasUserFinishedToEdit) {
|
||||
return
|
||||
}
|
||||
if (!path.value) {
|
||||
console.warn('no path found for this file')
|
||||
console.warn("no path found for this file")
|
||||
|
||||
return
|
||||
}
|
||||
@@ -105,17 +105,17 @@ watch(mode, async (newMode) => {
|
||||
const newSha = await updateFile({
|
||||
content: rawContent.value,
|
||||
path: path.value,
|
||||
sha: editedSha
|
||||
sha: editedSha,
|
||||
})
|
||||
|
||||
if (!newSha) {
|
||||
console.warn('no new SHA found for this file')
|
||||
console.warn("no new SHA found for this file")
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
await saveCacheNote(encodeUTF8ToBase64(rawContent.value), {
|
||||
editedSha: newSha
|
||||
editedSha: newSha,
|
||||
})
|
||||
initialRawContent.value = rawContent.value
|
||||
})
|
||||
@@ -127,7 +127,7 @@ watch(mode, async (newMode) => {
|
||||
:class="{
|
||||
[className]: true,
|
||||
overlay: displayNoteOverlay,
|
||||
[`note-${sha}`]: true
|
||||
[`note-${sha}`]: true,
|
||||
}"
|
||||
>
|
||||
<a
|
||||
@@ -177,7 +177,7 @@ watch(mode, async (newMode) => {
|
||||
v-if="false"
|
||||
:to="{
|
||||
name: 'ShareNotes',
|
||||
params: { user: user, repo: repo, note: sha }
|
||||
params: { user: user, repo: repo, note: sha },
|
||||
}"
|
||||
class="action"
|
||||
>
|
||||
@@ -243,8 +243,8 @@ $border-color: rgba(18, 19, 58, 0.2);
|
||||
|
||||
.stacked-note {
|
||||
padding: 0 1.5rem 1rem;
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--color-base-100);
|
||||
color: var(--color-base-content);
|
||||
|
||||
&.overlay {
|
||||
box-shadow: -3px 0 0.4em $border-color;
|
||||
@@ -262,7 +262,7 @@ $border-color: rgba(18, 19, 58, 0.2);
|
||||
}
|
||||
|
||||
a.title-stacked-note-link {
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
color: var(--color-base-content);
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
position: sticky;
|
||||
@@ -274,8 +274,8 @@ a.title-stacked-note-link {
|
||||
}
|
||||
|
||||
.title-stacked-note {
|
||||
background-color: var(--fallback-b1, oklch(var(--b1) / 1));
|
||||
color: var(--fallback-bc, oklch(var(--bc) / 1));
|
||||
background-color: var(--color-base-100);
|
||||
color: var(--color-base-content);
|
||||
font-size: 0.8em;
|
||||
overflow: visible;
|
||||
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { ref } from "vue"
|
||||
|
||||
const isDark = ref(JSON.parse(localStorage.getItem('is-dark') ?? 'false'))
|
||||
const isDark = ref(JSON.parse(localStorage.getItem("is-dark") ?? "false"))
|
||||
const toggle = (isChecked: boolean) => {
|
||||
localStorage.setItem('is-dark', isChecked ? 'true' : 'false')
|
||||
localStorage.setItem("is-dark", isChecked ? "true" : "false")
|
||||
}
|
||||
const darkMode = import.meta.env.VITE_DARK_MODE
|
||||
</script>
|
||||
@@ -14,7 +14,7 @@ const darkMode = import.meta.env.VITE_DARK_MODE
|
||||
<input
|
||||
type="checkbox"
|
||||
:value="darkMode"
|
||||
class="toggle theme-controller bg-base-content col-span-2 col-start-1 row-start-1"
|
||||
class="toggle theme-controller col-span-2 col-start-1 row-start-1"
|
||||
:checked="isDark"
|
||||
@click="
|
||||
(e) => {
|
||||
|
||||
Reference in New Issue
Block a user