Replace absolute image paths

This commit is contained in:
adilallo
2025-08-20 12:30:59 -06:00
parent 6e274124c3
commit e871c9de4b
100 changed files with 90292 additions and 62 deletions
+38 -38
View File
@@ -33,9 +33,9 @@ export const Default = {
},
render: (args) => (
<AvatarContainer {...args}>
<Avatar size={args.size} src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size={args.size} src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size={args.size} src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size={args.size} src="assets/Avatar_1.png" alt="User 1" />
<Avatar size={args.size} src="assets/Avatar_2.png" alt="User 2" />
<Avatar size={args.size} src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
),
};
@@ -47,36 +47,36 @@ export const Sizes = {
<div>
<h3 className="text-white font-semibold mb-3">Small Size</h3>
<AvatarContainer size="small">
<Avatar size="small" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="small" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="small" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="small" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="small" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="small" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">Medium Size</h3>
<AvatarContainer size="medium">
<Avatar size="medium" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="medium" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="medium" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="medium" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="medium" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="medium" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">Large Size</h3>
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">XLarge Size</h3>
<AvatarContainer size="xlarge">
<Avatar size="xlarge" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="xlarge" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="xlarge" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="xlarge" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="xlarge" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="xlarge" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
</div>
</div>
@@ -98,38 +98,38 @@ export const DifferentGroupSizes = {
<div>
<h3 className="text-white font-semibold mb-3">2 Users</h3>
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">3 Users</h3>
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">4 Users</h3>
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 4" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 4" />
</AvatarContainer>
</div>
<div>
<h3 className="text-white font-semibold mb-3">5 Users</h3>
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 4" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 5" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 4" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 5" />
</AvatarContainer>
</div>
</div>
@@ -158,9 +158,9 @@ export const InContext = {
<h3 className="text-white font-semibold mb-4">Team Members</h3>
<div className="flex items-center space-x-4">
<AvatarContainer size="medium">
<Avatar size="medium" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="medium" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="medium" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="medium" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="medium" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="medium" src="assets/Avatar_3.png" alt="User 3" />
</AvatarContainer>
<span className="text-white">3 team members</span>
</div>
@@ -172,10 +172,10 @@ export const InContext = {
</h3>
<div className="flex items-center space-x-4">
<AvatarContainer size="large">
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="/assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="/assets/Avatar_1.png" alt="User 4" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="large" src="assets/Avatar_2.png" alt="User 2" />
<Avatar size="large" src="assets/Avatar_3.png" alt="User 3" />
<Avatar size="large" src="assets/Avatar_1.png" alt="User 4" />
</AvatarContainer>
<span className="text-white">4 contributors</span>
</div>
@@ -185,8 +185,8 @@ export const InContext = {
<h3 className="text-white font-semibold mb-4">Small Team</h3>
<div className="flex items-center space-x-4">
<AvatarContainer size="small">
<Avatar size="small" src="/assets/Avatar_1.png" alt="User 1" />
<Avatar size="small" src="/assets/Avatar_2.png" alt="User 2" />
<Avatar size="small" src="assets/Avatar_1.png" alt="User 1" />
<Avatar size="small" src="assets/Avatar_2.png" alt="User 2" />
</AvatarContainer>
<span className="text-white">2 members</span>
</div>