Replace Create-rule header portraits with real PNGs so the circles paint.

The old SVG wrappers nested corrupt PNGs, so browsers fetched the files but showed empty rings.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilalloandCursor committed 2026-11-03 16:04:57 -07:00
1 parent 33cdaf135c
commit ea85be2287
13 files changed
+68 -74

No files matched your search

+17 -17
View File
@@ -55,7 +55,7 @@ export default {
export const Default = {
args: {
src: "assets/marketing/avatar-1.svg",
src: "assets/marketing/avatar-1.png",
alt: "User Avatar",
size: "medium",
},
@@ -63,7 +63,7 @@ export const Default = {
export const Sizes = {
args: {
src: "assets/marketing/avatar-1.svg",
src: "assets/marketing/avatar-1.png",
alt: "User Avatar",
},
render: (args) => (
@@ -146,9 +146,9 @@ export const DifferentAvatars = {
render: (args) => (
<div className="space-y-4">
<div className="space-x-4">
<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" />
<Avatar {...args} src="assets/marketing/avatar-1.png" alt="User 1" />
<Avatar {...args} src="assets/marketing/avatar-2.png" alt="User 2" />
<Avatar {...args} src="assets/marketing/avatar-3.png" alt="User 3" />
</div>
</div>
),
@@ -168,36 +168,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/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" />
<Avatar size="small" src="assets/marketing/avatar-1.png" alt="User 1" />
<Avatar size="small" src="assets/marketing/avatar-2.png" alt="User 2" />
<Avatar size="small" src="assets/marketing/avatar-3.png" 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/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" />
<Avatar size="medium" src="assets/marketing/avatar-1.png" alt="User 1" />
<Avatar size="medium" src="assets/marketing/avatar-2.png" alt="User 2" />
<Avatar size="medium" src="assets/marketing/avatar-3.png" 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/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.png" alt="User 1" />
<Avatar size="large" src="assets/marketing/avatar-2.png" alt="User 2" />
<Avatar size="large" src="assets/marketing/avatar-3.png" 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/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" />
<Avatar size="xlarge" src="assets/marketing/avatar-1.png" alt="User 1" />
<Avatar size="xlarge" src="assets/marketing/avatar-2.png" alt="User 2" />
<Avatar size="xlarge" src="assets/marketing/avatar-3.png" alt="User 3" />
</div>
</div>
</div>