arthur/website
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/website.git synced 2026-02-02 05:08:01 +01:00
Code Issues Packages Projects Releases Wiki Activity

Implement back bookmarks

Browse Source
This commit is contained in:
Arthur Danjou
2024-02-22 22:35:27 +01:00
parent 00fb3355e4
commit a7ed17240c
4 changed files with 38 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/middleware/redirect.global.ts
View File

@@ -1,6 +1,6 @@
/* eslint-disable node/prefer-global/process */ /* eslint-disable node/prefer-global/process */
export default defineNuxtRouteMiddleware((to) => { export default defineNuxtRouteMiddleware((to) => {
if (to.path === '/bookmarks' || to.path === '/writing' && process.env.NODE_ENV !== 'development') { if (to.path === '/writing' && process.env.NODE_ENV !== 'development') {
return navigateTo('/', { return navigateTo('/', {
redirectCode: 301, redirectCode: 301,
}) })

70
src/pages/bookmarks.vue
View File

@@ -99,49 +99,47 @@ function getColor() {
</template> </template>
</UPopover> </UPopover>
</div> </div>
<div v-if="bookmarks && getCategories" class="mt-8 md:mt-16"> <div v-if="bookmarks && getCategories" class="mt-8">
<div v-if="bookmarks.length > 0 && !pending" class="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5"> <div v-if="bookmarks.length > 0 && !pending" class="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 md:grid-cols-3">
<div <div
v-for="bookmark in bookmarks" v-for="bookmark in bookmarks"
:key="bookmark.name.toLowerCase().trim()" :key="bookmark.name.toLowerCase().trim()"
class="group relative flex flex-col justify-between" class="group relative flex justify-between items-center"
> >
<div class="flex"> <div class="flex flex-col gap-y-1">
<div class="flex gap-6 items-center"> <div class="flex gap-6 items-center">
<div> <h2 class="text-base font-semibold text-zinc-800 dark:text-zinc-100">
<h2 class="text-base font-semibold text-zinc-800 dark:text-zinc-100"> <div class="absolute -inset-y-2 md:-inset-y-4 -inset-x-4 z-0 scale-95 bg-zinc-50 opacity-0 transition group-hover:scale-100 group-hover:opacity-100 dark:bg-zinc-800/50 sm:-inset-x-6 sm:rounded-2xl" />
<div class="absolute -inset-y-6 -inset-x-4 z-0 scale-95 bg-zinc-50 opacity-0 transition group-hover:scale-100 group-hover:opacity-100 dark:bg-zinc-800/50 sm:-inset-x-6 sm:rounded-2xl" /> <NuxtLink
<NuxtLink :href="bookmark.website"
:href="bookmark.website" external
external target="_blank"
target="_blank" >
> <span class="absolute -inset-y-2 md:-inset-y-4 -inset-x-4 z-20 sm:-inset-x-6 sm:rounded-2xl" />
<span class="absolute -inset-y-6 -inset-x-4 z-20 sm:-inset-x-6 sm:rounded-2xl" /> <div class="flex gap-2 items-center">
<div class="flex gap-2 items-center"> <h1 class="relative z-10">
<h1 class="relative z-10"> {{ bookmark.name }}
{{ bookmark.name }} </h1>
</h1> <UTooltip v-if="bookmark.favorite" text="You can set the filter to only show favorites.">
<UTooltip v-if="bookmark.favorite" text="You can set the filter to only show favorites."> <UIcon name="i-ic-round-star" class="z-20 text-amber-500 text-xl font-bold hover:rotate-[143deg] duration-300" />
<UIcon name="i-ic-round-star" class="z-20 text-amber-500 text-xl font-bold hover:rotate-[143deg] duration-300" /> </UTooltip>
</UTooltip> </div>
</div> </NuxtLink>
</NuxtLink> </h2>
</h2> </div>
</div> <div class="flex gap-2 z-10">
<UBadge
v-for="category in bookmark.categories"
:key="category.category.slug"
color="primary"
variant="soft"
size="xs"
>
{{ category.category.name }}
</UBadge>
</div> </div>
</div> </div>
<div class="flex gap-2 z-10"> <p class="relative z-10 flex text-sm font-medium items-center" :class="getColor()">
<UBadge
v-for="category in bookmark.categories"
:key="category.category.slug"
color="primary"
variant="soft"
size="xs"
>
{{ category.category.name }}
</UBadge>
</div>
<p class="relative z-10 mt-4 flex text-sm font-medium items-center" :class="getColor()">
<UIcon name="i-ph-link-bold" /> <UIcon name="i-ph-link-bold" />
<span class="ml-2">{{ bookmark.website.replace('https://', '') }}</span> <span class="ml-2">{{ bookmark.website.replace('https://', '') }}</span>
</p> </p>

2
src/pages/talents.vue
View File

@@ -190,7 +190,7 @@ async function suggest() {
</UPopover> </UPopover>
</div> </div>
<UDivider class="my-2" /> <UDivider class="my-2" />
<div v-if="talents && getCategories" class="mt-8 md:mt-16"> <div v-if="talents && getCategories" class="mt-8">
<div v-if="talents.length > 0 && !pending" class="grid grid-cols-1 gap-y-4 md:gap-x-12 md:gap-y-16 sm:grid-cols-2 lg:grid-cols-3"> <div v-if="talents.length > 0 && !pending" class="grid grid-cols-1 gap-y-4 md:gap-x-12 md:gap-y-16 sm:grid-cols-2 lg:grid-cols-3">
<div <div
v-for="talent in talents" v-for="talent in talents"

4
types.ts
View File

@@ -104,11 +104,11 @@ export const otherTab = [
to: '/guestbook', to: '/guestbook',
icon: 'i-material-symbols-book-2-outline', icon: 'i-material-symbols-book-2-outline',
}, },
/* { {
label: 'Bookmarks', label: 'Bookmarks',
to: '/bookmarks', to: '/bookmarks',
icon: 'i-material-symbols-bookmark-add-outline-rounded', icon: 'i-material-symbols-bookmark-add-outline-rounded',
}, */ },
], ],
] ]