tcjlj/OpenFlare
1
0
Fork 0
mirror of https://github.com/Rain-kl/OpenFlare.git synced 2026-10-13 18:36:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

prettier

Browse Source
This commit is contained in:
ryan
2026-07-13 15:08:40 +08:00
parent 08e8eea932
commit 1eff7878a1
441 changed files with 26491 additions and 18405 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/layout/avater-style/NewYear.tsx
+135 -48
View File
@@ -25,42 +25,107 @@
* ```
*/
import {cn} from "@/lib/utils"
import {FireworksEffect} from "@/components/ui/fireworks-effect"
import { cn } from '@/lib/utils';
import { FireworksEffect } from '@/components/ui/fireworks-effect';
/**
* 红灯笼组件 - 默认头像装饰
*/
export const Lantern = ({ className }: { className?: string }) => (
<svg
viewBox="0 0 1024 1024"
fill="none"
xmlns="http://www.w3.org/2000/svg"
viewBox='0 0 1024 1024'
fill='none'
xmlns='http://www.w3.org/2000/svg'
className={className}
>
<path d="M512 80V160" stroke="#FFD700" strokeWidth="32" strokeLinecap="round" />
<path
d='M512 80V160'
stroke='#FFD700'
strokeWidth='32'
strokeLinecap='round'
/>
<ellipse cx="512" cy="420" rx="300" ry="260" fill="#D92424" />
<ellipse cx="512" cy="420" rx="300" ry="260" stroke="#961C1C" strokeWidth="10" />
<ellipse cx='512' cy='420' rx='300' ry='260' fill='#D92424' />
<ellipse
cx='512'
cy='420'
rx='300'
ry='260'
stroke='#961C1C'
strokeWidth='10'
/>
<path d="M340 180H684C700 180 712 192 712 208V220H312V208C312 192 324 180 340 180Z" fill="#FFD700" />
<path d="M340 620H684C700 620 712 632 712 648V660H312V648C312 632 324 620 340 620Z" fill="#FFD700" />
<path
d='M340 180H684C700 180 712 192 712 208V220H312V208C312 192 324 180 340 180Z'
fill='#FFD700'
/>
<path
d='M340 620H684C700 620 712 632 712 648V660H312V648C312 632 324 620 340 620Z'
fill='#FFD700'
/>
<path d="M512 160C512 160 620 250 620 420C620 590 512 680 512 680" stroke="#FFD700" strokeWidth="20" strokeLinecap="round" strokeOpacity="0.4" />
<path d="M512 160C512 160 404 250 404 420C404 590 512 680 512 680" stroke="#FFD700" strokeWidth="20" strokeLinecap="round" strokeOpacity="0.4" />
<path d="M512 160V680" stroke="#FFD700" strokeWidth="20" strokeOpacity="0.4" />
<path
d='M512 160C512 160 620 250 620 420C620 590 512 680 512 680'
stroke='#FFD700'
strokeWidth='20'
strokeLinecap='round'
strokeOpacity='0.4'
/>
<path
d='M512 160C512 160 404 250 404 420C404 590 512 680 512 680'
stroke='#FFD700'
strokeWidth='20'
strokeLinecap='round'
strokeOpacity='0.4'
/>
<path
d='M512 160V680'
stroke='#FFD700'
strokeWidth='20'
strokeOpacity='0.4'
/>
<circle cx="512" cy="420" r="80" fill="#FFD700" fillOpacity="0.9" />
<text x="512" y="450" fontSize="80" fill="#D92424" textAnchor="middle" fontWeight="bold" fontFamily="serif">福</text>
<circle cx='512' cy='420' r='80' fill='#FFD700' fillOpacity='0.9' />
<text
x='512'
y='450'
fontSize='80'
fill='#D92424'
textAnchor='middle'
fontWeight='bold'
fontFamily='serif'
>
福
</text>
<path d="M512 660V720" stroke="#FFD700" strokeWidth="20" />
<path d="M480 720H544" stroke="#D92424" strokeWidth="40" strokeLinecap="round" />
<path d='M512 660V720' stroke='#FFD700' strokeWidth='20' />
<path
d='M480 720H544'
stroke='#D92424'
strokeWidth='40'
strokeLinecap='round'
/>
<path d="M492 740V900" stroke="#D92424" strokeWidth="16" strokeLinecap="round" />
<path d="M512 740V940" stroke="#D92424" strokeWidth="16" strokeLinecap="round" />
<path d="M532 740V900" stroke="#D92424" strokeWidth="16" strokeLinecap="round" />
<path
d='M492 740V900'
stroke='#D92424'
strokeWidth='16'
strokeLinecap='round'
/>
<path
d='M512 740V940'
stroke='#D92424'
strokeWidth='16'
strokeLinecap='round'
/>
<path
d='M532 740V900'
stroke='#D92424'
strokeWidth='16'
strokeLinecap='round'
/>
</svg>
)
);
/**
* "福"字挂件 - 点击出现的装饰
@@ -68,46 +133,68 @@ export const Lantern = ({ className }: { className?: string }) => (
*/
export const FuCharacter = ({
className,
show = true
show = true,
}: {
className?: string
show?: boolean
className?: string;
show?: boolean;
}) => (
<svg
viewBox="0 0 100 100"
fill="none"
xmlns="http://www.w3.org/2000/svg"
viewBox='0 0 100 100'
fill='none'
xmlns='http://www.w3.org/2000/svg'
className={cn(
"transition-all duration-500 ease-out origin-center",
show ? "opacity-100 scale-100 rotate-0" : "opacity-0 scale-50 rotate-[-15deg]",
className
'transition-all duration-500 ease-out origin-center',
show
? 'opacity-100 scale-100 rotate-0'
: 'opacity-0 scale-50 rotate-[-15deg]',
className,
)}
>
<path d="M50 0V15" stroke="#F59E0B" strokeWidth="2" />
<g transform="rotate(25 50 50)">
<rect x="20" y="20" width="60" height="60" rx="2" fill="#D92424" stroke="#F59E0B" strokeWidth="1.5" />
<rect x="23" y="23" width="54" height="54" rx="1" stroke="#F59E0B" strokeWidth="1" strokeOpacity="0.5" strokeDasharray="4 2" fill="none" />
<path d='M50 0V15' stroke='#F59E0B' strokeWidth='2' />
<g transform='rotate(25 50 50)'>
<rect
x='20'
y='20'
width='60'
height='60'
rx='2'
fill='#D92424'
stroke='#F59E0B'
strokeWidth='1.5'
/>
<rect
x='23'
y='23'
width='54'
height='54'
rx='1'
stroke='#F59E0B'
strokeWidth='1'
strokeOpacity='0.5'
strokeDasharray='4 2'
fill='none'
/>
<text
x="50"
y="60"
fontSize="32"
fill="#FFD700"
textAnchor="middle"
fontWeight="bold"
x='50'
y='60'
fontSize='32'
fill='#FFD700'
textAnchor='middle'
fontWeight='bold'
fontFamily="'YouYuan', 'Yuanti SC', 'STYuanti', 'HanyiYuanti', 'Comic Sans MS', sans-serif"
style={{ letterSpacing: "0px" }}
transform="rotate(130 50 50)"
style={{ letterSpacing: '0px' }}
transform='rotate(130 50 50)'
>
福
</text>
</g>
<path d="M50 85V95" stroke="#D92424" strokeWidth="3" />
<circle cx="50" cy="95" r="2" fill="#F59E0B" />
<path d="M50 95L47 100M50 95L53 100" stroke="#D92424" strokeWidth="1" />
<path d='M50 85V95' stroke='#D92424' strokeWidth='3' />
<circle cx='50' cy='95' r='2' fill='#F59E0B' />
<path d='M50 95L47 100M50 95L53 100' stroke='#D92424' strokeWidth='1' />
</svg>
)
);
/**
* 元旦/新年装饰集合
@@ -116,6 +203,6 @@ export const NewYearDecorations = {
Lantern,
Fu: FuCharacter,
FireworksEffect,
}
};
export default NewYearDecorations
export default NewYearDecorations;