Browse Source

feat: add size prop to avatar component and update logo component for size handling (#5684)

pull/5686/head
Netfan 11 months ago
committed by GitHub
parent
commit
e2a577de24
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 16
      packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue
  2. 3
      packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue

16
packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue

@ -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>

3
packages/@core/ui-kit/shadcn-ui/src/components/logo/logo.vue

@ -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…
Cancel
Save