You've already forked obsidian-visualiser
Add user deletion, ProseA hover cards, Canvas
This commit is contained in:
@@ -1,50 +1,60 @@
|
||||
<template>
|
||||
<span class="text-accent-blue inline-flex items-center cursor-pointer hover:text-opacity-85"><slot v-bind="$attrs"></slot></span>
|
||||
<!-- <Suspense suspensible>
|
||||
<NuxtLink no-prefetch class="text-accent-blue inline-flex items-center" v-if="data && data[0]"
|
||||
:to="{ path: `/explorer/${project}/${data[0].path}`, hash: hash }" :class="class">
|
||||
<PreviewContent :project="project" :path="data[0].path" :anchor="hash">
|
||||
<template #default>
|
||||
<slot v-bind="$attrs"></slot>
|
||||
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'Markdown'" :height="20" :width="20"
|
||||
:icon="`icons/link-${data[0].type.toLowerCase()}`" />
|
||||
<NuxtLink no-prefetch class="text-accent-blue inline-flex items-center" v-if="data && data[0]"
|
||||
:to="{ name: 'explore-path', params: { path: data[0].path }, hash: hash }" :class="class">
|
||||
<HoverCard class="max-w-[600px] max-h-[600px] w-full overflow-auto z-[45]" :class="{'overflow-hidden !p-0': data[0].type === 'canvas'}">
|
||||
<template #content>
|
||||
<template v-if="data[0].type === 'markdown'">
|
||||
<div class="px-10">
|
||||
<Markdown :content="data[0].content" />
|
||||
</div>
|
||||
</template>
|
||||
</PreviewContent>
|
||||
</NuxtLink>
|
||||
<NuxtLink no-prefetch v-else-if="href" :to="href" :class="class" class="text-accent-blue inline-flex items-center">
|
||||
<slot v-bind="$attrs"></slot>
|
||||
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'Markdown'" :height="20" :width="20"
|
||||
:icon="`icons/link-${data[0].type.toLowerCase()}`" />
|
||||
</NuxtLink>
|
||||
<slot :class="class" v-else v-bind="$attrs"></slot>
|
||||
</Suspense> -->
|
||||
<template v-else-if="data[0].type === 'canvas'">
|
||||
<div class="w-[600px] h-[600px] relative">
|
||||
<Canvas :canvas="JSON.parse(data[0].content)" />
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
<template #default>
|
||||
<slot v-bind="$attrs"></slot>
|
||||
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'markdown'" :icon="iconByType[data[0].type]" />
|
||||
</template>
|
||||
</HoverCard>
|
||||
</NuxtLink>
|
||||
<NuxtLink no-prefetch v-else-if="href" :to="href" :class="class" class="text-accent-blue inline-flex items-center">
|
||||
<slot v-bind="$attrs"></slot>
|
||||
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'markdown'" :height="20" :width="20"
|
||||
:icon="`icons/link-${data[0].type.toLowerCase()}`" />
|
||||
</NuxtLink>
|
||||
<slot :class="class" v-else v-bind="$attrs"></slot>
|
||||
</template>
|
||||
<!--<script setup lang="ts">
|
||||
|
||||
<script setup lang="ts">
|
||||
import { parseURL } from 'ufo';
|
||||
import { Icon } from '@iconify/vue/dist/iconify.js';
|
||||
|
||||
const props = defineProps({
|
||||
href: {
|
||||
type: String,
|
||||
required: false,
|
||||
},
|
||||
class: {
|
||||
type: String,
|
||||
required: false,
|
||||
}
|
||||
});
|
||||
const iconByType: Record<string, string> = {
|
||||
'folder': 'circum:folder-on',
|
||||
'canvas': 'ph:graph-light',
|
||||
'file': 'radix-icons:file',
|
||||
}
|
||||
const { href } = defineProps<{
|
||||
href: string
|
||||
class?: string
|
||||
}>();
|
||||
|
||||
const route = useRoute();
|
||||
const { hash, pathname, protocol } = parseURL(props.href);
|
||||
const project = computed(() => parseInt(Array.isArray(route.params.projectId) ? '0' : route.params.projectId));
|
||||
const data = ref();
|
||||
const { hash, pathname, protocol } = parseURL(href);
|
||||
const data = ref(), loading = ref(false);
|
||||
|
||||
if(!!pathname && !protocol)
|
||||
{
|
||||
data.value = await $fetch(`/api/project/${project.value}/file`, {
|
||||
query: {
|
||||
search: `%${pathname}`
|
||||
},
|
||||
ignoreResponseError: true,
|
||||
});
|
||||
loading.value = true;
|
||||
try {
|
||||
data.value = await $fetch(`/api/file`, {
|
||||
query: {
|
||||
search: `%${pathname}`
|
||||
},
|
||||
});
|
||||
} catch(e) { }
|
||||
loading.value = false;
|
||||
}
|
||||
</script>-->
|
||||
</script>
|
||||
@@ -162,17 +162,14 @@ blockquote:empty
|
||||
@apply w-6;
|
||||
@apply h-6;
|
||||
@apply stroke-2;
|
||||
}
|
||||
.callout-title
|
||||
{
|
||||
@apply flex;
|
||||
@apply items-center;
|
||||
@apply gap-2;
|
||||
@apply float-start;
|
||||
@apply me-2;
|
||||
}
|
||||
.callout-title-inner
|
||||
{
|
||||
@apply inline-block;
|
||||
@apply block;
|
||||
@apply font-bold;
|
||||
@apply ps-8;
|
||||
}
|
||||
.callout > p
|
||||
{
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<h2 :id="parseId(id)" class="text-4xl font-semibold mt-3 mb-6 ms-1 first:pt-0 pt-2 relative sm:right-8 right-4">
|
||||
<h2 :id="parseId(id)" class="text-4xl font-semibold mt-3 mb-6 ms-1 first:pt-0 pt-2 relative sm:right-4 right-2">
|
||||
<slot />
|
||||
</h2>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user