versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-03-13 03:29:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: ♻️ Rewrite sidebar with shadcn

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-11-30 00:58:04 +01:00
parent a7b570905a
commit 9ced2c98e4
No known key found for this signature in database
109 changed files with 2261 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

4
components/social-elements/notes/interactions/row.vue
View file

@ -9,9 +9,9 @@
</InteractionButton>
<InteractionButton @click="likeFn" :disabled="!identity">
<iconify-icon width="1.25rem" height="1.25rem" icon="tabler:heart" v-if="!note.favourited"
class="size-5 text-gray-200 group-hover:group-enabled:text-primary-600" aria-hidden="true" />
class="size-5 text-gray-200 group-hover:group-enabled:text-primary2-600" aria-hidden="true" />
<iconify-icon width="1.25rem" height="1.25rem" icon="tabler:heart-filled" v-else
class="size-5 text-primary-600 group-hover:group-enabled:text-gray-200" aria-hidden="true" />
class="size-5 text-primary2-600 group-hover:group-enabled:text-gray-200" aria-hidden="true" />
<span class="text-gray-400 mt-0.5 ml-2" v-if="note.favourites_count">{{ numberFormat(note.favourites_count) }}</span>
</InteractionButton>
<InteractionButton @click="reblogFn" :disabled="!identity">

2
components/social-elements/notes/mention.vue
View file

@ -1,6 +1,6 @@
<template>
<a :href="`/@${account.acct}`" target="_blank"
class="shrink break-all rounded bg-dark-200 ring-1 ring-white/5 ring-inset text-primary-200 px-2 py-1 not-prose font-semibold cursor-pointer [&:not(:last-child)]:mr-1 duration-200 hover:bg-primary-600/30">
class="shrink break-all rounded bg-dark-200 ring-1 ring-white/5 ring-inset text-primary2-200 px-2 py-1 not-prose font-semibold cursor-pointer [&:not(:last-child)]:mr-1 duration-200 hover:bg-primary2-600/30">
<img class="size-[1em] rounded ring-1 ring-white/5 !inline align-middle mb-1 mr-1" :src="account.avatar"
:alt="`${account.acct}'s avatar'`" />
{{ account.display_name || account.acct }}

2
components/social-elements/notes/note.vue
View file

@ -15,7 +15,7 @@
<!-- Overlay that blocks clicks for disabled notes -->
<div v-if="disabled" class="absolute z-10 inset-0 hover:cursor-not-allowed">
</div>
<div v-if="reblog" class="mb-4 flex flex-row gap-2 items-center text-primary-400">
<div v-if="reblog" class="mb-4 flex flex-row gap-2 items-center text-primary2-400">
<Skeleton :enabled="!loaded" shape="rect" class="!h-6" :min-width="40" :max-width="100"
width-unit="%">
<iconify-icon width="1.5rem" height="1.5rem" icon="tabler:repeat" class="size-6"

2
components/social-elements/users/Account.vue
View file

@ -86,7 +86,7 @@
<div v-if="!skeleton && fields && fields.length > 0" class="mt-4 px-4 flex-col flex space-y-3">
<div v-for="field of fields" :key="field.name ?? ''" class="flex flex-col gap-1">
<span class="text-primary-500 font-semibold" v-html="field.name"></span>
<span class="text-primary2-500 font-semibold" v-html="field.name"></span>
<span class="text-gray-200 prose prose-invert break-all" v-html="field.value"></span>
</div>
</div>

4
components/social-elements/users/Badge.vue
View file

@ -1,7 +1,7 @@
<template>
<Tooltip.Root @update:open="(o) => open = o" :open="open" :open-delay="0">
<Tooltip.Trigger><span
class="inline-flex items-center px-2 py-1 gap-x-2 rounded text-sm font-medium bg-dark-300 text-primary-200 ring-white/5 ring-1">
class="inline-flex items-center px-2 py-1 gap-x-2 rounded text-sm font-medium bg-dark-300 text-primary2-200 ring-white/5 ring-1">
<svg viewBox="0 0 22 22" v-if="verified" aria-label="Verified account" role="img"
class="size-4 fill-primary-500">
<g>
@ -11,7 +11,7 @@
</g>
</svg>
<img v-else-if="img" :src="img" alt="" class="size-4 rounded-sm" />
<iconify-icon v-else-if="icon" :icon="icon" width="none" class="text-primary-200 size-4"
<iconify-icon v-else-if="icon" :icon="icon" width="none" class="text-primary2-200 size-4"
aria-hidden="true" />
<span>{{ name }}</span>
</span></Tooltip.Trigger>

2
components/social-elements/users/UserCard.vue
View file

@ -71,7 +71,7 @@
<div v-if="fields && fields.length > 0" class="mt-4 px-4 flex-col flex space-y-3">
<div v-for="field of fields" :key="field.name ?? ''" class="flex flex-col gap-1">
<span class="text-primary-500 font-semibold" v-html="field.name"></span>
<span class="text-primary2-500 font-semibold" v-html="field.name"></span>
<span class="text-gray-200 prose prose-invert prose-sm break-all"
v-html="field.value"></span>
</div>