MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat(style): render solid links the same as buttons

This commit is contained in:
ArneBo 2025-02-14 11:03:15 +01:00
parent cb4c879eda
commit b8d4cb2aba
1 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
front/src/components/ui/Link.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { computed, onMounted, ref } from 'vue'
import { computed, onMounted, ref, useSlots } from 'vue'
import { type RouterLinkProps } from 'vue-router'
import { type ColorProps, type DefaultProps, type VariantProps, color, isNoColors } from '~/composables/color';
@ -26,9 +26,11 @@ const isExternalLink = computed(() =>
typeof props.to === 'string' && (props.to.startsWith('http') || props.to.startsWith('./'))
)
const [fontWeight, activeFontWeight] = props.thickWhenActive ? [600, 900] : [400, 400]
const [fontWeight, activeFontWeight] = 'solid' in props || props.thickWhenActive ? [600, 900] : [400, 400]
const isIconOnly = computed(() => !!props.icon)
const slots = useSlots()
const isIconOnly = computed(() => !!props.icon && (!slots.default || 'square' in props && props.square || 'squareSmall' in props && props.squareSmall ))
const button = ref()
@ -39,10 +41,13 @@ onMounted(() => {
<template>
<component :is="isExternalLink ? 'a' : 'RouterLink'"
v-bind="color(props, ['interactive'])(
width(props, isNoColors(props) ? [] : ['normalHeight', 'auto'])(
align(props)(
)))"
v-bind="
color(props, ['interactive'])(
width(props,
isNoColors(props) ? [] : ['normalHeight', 'solid' in props ? 'buttonWidth' : 'auto']
)(
align(props, 'solid' in props ? {alignText: 'center'} : {})(
)))"
ref="button"
:autofocus="autofocus || undefined"
:class="[