CommunityRule/community-rule
2
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Cleanup assets

Browse Source
This commit is contained in:
adilallo
2026-05-21 22:56:34 -06:00
parent f3b73527fc
commit 28de8ef3bc
83 changed files with 506 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stories/asset/Avatar.stories.js
+17 -17
View File
@@ -36,7 +36,7 @@ export default {
export const Default = {
args: {
src: "assets/Avatar_1.png",
src: "assets/marketing/avatar-1.svg",
alt: "User Avatar",
size: "medium",
},
@@ -44,7 +44,7 @@ export const Default = {
export const Sizes = {
args: {
src: "assets/Avatar_1.png",
src: "assets/marketing/avatar-1.svg",
alt: "User Avatar",
},
render: (args) => (
@@ -73,9 +73,9 @@ export const DifferentAvatars = {
render: (args) => (
<div className="space-y-4">
<div className="space-x-4">
<Avatar {...args} src="assets/Avatar_1.png" alt="User 1" />
<Avatar {...args} src="assets/Avatar_2.png" alt="User 2" />
<Avatar {...args} src="assets/Avatar_3.png" alt="User 3" />
<Avatar {...args} src="assets/marketing/avatar-1.svg" alt="User 1" />
<Avatar {...args} src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar {...args} src="assets/marketing/avatar-3.svg" alt="User 3" />
</div>
</div>
),
@@ -95,36 +95,36 @@ export const AllSizesWithDifferentAvatars = {
<div>
<h3 className="text-white font-semibold mb-3">Small Size</h3>
<div className="space-x-4">
<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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="small" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="small" src="assets/marketing/avatar-3.svg" alt="User 3" />
</div>
</div>
<div>
<h3 className="text-white font-semibold mb-3">Medium Size</h3>
<div className="space-x-4">
<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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="medium" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="medium" src="assets/marketing/avatar-3.svg" alt="User 3" />
</div>
</div>
<div>
<h3 className="text-white font-semibold mb-3">Large Size</h3>
<div className="space-x-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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" alt="User 3" />
</div>
</div>
<div>
<h3 className="text-white font-semibold mb-3">XLarge Size</h3>
<div className="space-x-4">
<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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="xlarge" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="xlarge" src="assets/marketing/avatar-3.svg" alt="User 3" />
</div>
</div>
</div>
stories/asset/AvatarContainer.stories.js
+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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size={args.size} src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size={args.size} src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="small" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="small" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="medium" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="medium" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="xlarge" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="xlarge" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" alt="User 3" />
<Avatar size="large" src="assets/marketing/avatar-1.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" alt="User 3" />
<Avatar size="large" src="assets/marketing/avatar-1.svg" alt="User 4" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="medium" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="medium" src="assets/marketing/avatar-3.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.svg" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.svg" alt="User 3" />
<Avatar size="large" src="assets/marketing/avatar-1.svg" 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/marketing/avatar-1.svg" alt="User 1" />
<Avatar size="small" src="assets/marketing/avatar-2.svg" alt="User 2" />
</AvatarContainer>
<span className="text-white">2 members</span>
</div>