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

refactor: ♻️ Begin refactoring code to use new custom UI library

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-06-27 03:03:03 -10:00
parent 2e1cc99de4
commit 13faf840dd
No known key found for this signature in database
13 changed files with 196 additions and 78 deletions
Download patch file Download diff file Expand all files Collapse all files

7
components/buttons/button-dropdown.vue
View file

@ -1,13 +1,14 @@
<template>
<ButtonBase class="enabled:hover:bg-white/20 !rounded-sm !text-left flex flex-row gap-x-3 !ring-0 !p-4 sm:!p-2">
<iconify-icon :icon="icon" width="none" class="text-gray-200 size-5" aria-hidden="true" />
<ButtonBase class="enabled:hover:bg-white/20 !rounded-sm !ring-0 !p-4 sm:!p-2 !justify-start">
<Icon :icon="icon" />
<slot />
</ButtonBase>
</template>
<script lang="ts" setup>
import type { ButtonHTMLAttributes } from "vue";
import ButtonBase from "./button-base.vue";
import ButtonBase from "~/packages/ui/components/buttons/button.vue";
import Icon from "~/packages/ui/components/icons/icon.vue";
interface Props extends /* @vue-ignore */ ButtonHTMLAttributes {}

5
components/buttons/button-mobile-navbar.vue
View file

@ -1,13 +1,12 @@
<template>
<ButtonBase
class="hover:bg-white/5 text-xs max-w-full w-full gap-1 h-full !px-0 flex flex-col items-center justify-center">
class="hover:bg-white/5 text-xs max-w-full w-full h-full !p-0">
<iconify-icon :icon="icon" class="size-6" width="none" />
<span class="text-xs hidden md:inline">{{ text }}</span>
</ButtonBase>
</template>
<script lang="ts" setup>
import ButtonBase from "./button-base.vue";
import ButtonBase from "~/packages/ui/components/buttons/button.vue";
defineProps<{
icon: string;

5
components/buttons/button-primary.vue
View file

@ -1,5 +1,5 @@
<template>
<ButtonBase :loading="loading"
<ButtonBase
class="[--btn-border:theme(colors.primary.950/90%)] [--btn-bg:theme(colors.primary.600)] [--btn-hover-overlay:theme(colors.white/5%)] [--btn-icon:theme(colors.primary.400)] active:[--btn-icon:theme(colors.primary.300)] hover:[--btn-icon:theme(colors.primary.300)] after:shadow-[shadow:inset_0_1px_theme(colors.white/15%)] border border-white/5"
v-bind="$props">
<slot />
@ -8,7 +8,8 @@
<script lang="ts" setup>
import type { ButtonHTMLAttributes } from "vue";
import ButtonBase from "./button-base.vue";
import ButtonBase from "~/packages/ui/components/buttons/button.vue";
// import ButtonBase from "./button-base.vue";
interface Props extends /* @vue-ignore */ ButtonHTMLAttributes {}