feat: add size prop to avatar component and update logo component for size handling (#5684)
This commit is contained in:
parent
89d963c81a
commit
e2a577de24
@ -16,6 +16,7 @@ interface Props extends AvatarFallbackProps, AvatarImageProps, AvatarRootProps {
|
||||
class?: ClassType;
|
||||
dot?: boolean;
|
||||
dotClass?: ClassType;
|
||||
size?: number;
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
@ -32,10 +33,23 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
const text = computed(() => {
|
||||
return props.alt.slice(-2).toUpperCase();
|
||||
});
|
||||
|
||||
const rootStyle = computed(() => {
|
||||
return props.size !== undefined && props.size > 0
|
||||
? {
|
||||
height: `${props.size}px`,
|
||||
width: `${props.size}px`,
|
||||
}
|
||||
: {};
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div :class="props.class" class="relative flex flex-shrink-0 items-center">
|
||||
<div
|
||||
:class="props.class"
|
||||
:style="rootStyle"
|
||||
class="relative flex flex-shrink-0 items-center"
|
||||
>
|
||||
<Avatar :class="props.class" class="size-full">
|
||||
<AvatarImage :alt="alt" :src="src" />
|
||||
<AvatarFallback>{{ text }}</AvatarFallback>
|
||||
|
@ -52,7 +52,8 @@ withDefaults(defineProps<Props>(), {
|
||||
v-if="src"
|
||||
:alt="text"
|
||||
:src="src"
|
||||
class="relative w-8 rounded-none bg-transparent"
|
||||
:size="logoSize"
|
||||
class="relative rounded-none bg-transparent"
|
||||
/>
|
||||
<span
|
||||
v-if="!collapsed"
|
||||
|
Loading…
Reference in New Issue
Block a user