Skip to content

Commit ce8b580

Browse files
ZengLiangYiZengLiangYi
committed
refactor(site): redesign landing page per design audit
- Replace purple palette with indigo scheme matching logo (#5A5FD6) - Add sticky header with nav anchors and language switcher - Add prefers-reduced-motion support and scroll-animation fallback - Add color-scheme meta tag and Chinese font stack - Fix brand logos: Claude spark mark, correct OpenAI logomark - Use official brand colors instead of custom overrides - Replace Unicode copy icons with proper SVGs - Internationalize LocalFirst "Your machine" text - Fix Hero video poster to respect current locale - Improve footer touch targets to 44px minimum - Add bento layout variation to feature grid Co-Authored-By: Rayner Zeng <1361209507@qq.com>
1 parent 0a3b0d3 commit ce8b580

15 files changed

Lines changed: 157 additions & 63 deletions

File tree

‎site/public/favicon.svg‎

Lines changed: 2 additions & 2 deletions
Loading

‎site/src/components/CliShowcase.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export default function CliShowcase({ t, basePath }: Props) {
2525
}, []);
2626

2727
return (
28-
<section className="py-24">
28+
<section id="cli" className="py-24">
2929
<div className="mx-auto max-w-4xl px-6">
3030
<h2 className="text-3xl font-bold text-center mb-12">
3131
{t.cli.heading}

‎site/src/components/FeatureBento.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,15 @@ function VideoCard({ src }: { src: string }) {
5252
);
5353
}
5454

55+
// Cards 0 (Semantic Search) and 2 (MCP Integration) span 2 columns on large screens
56+
const spanClasses: Record<number, string> = {
57+
0: 'lg:col-span-2',
58+
2: 'lg:col-span-2',
59+
};
60+
5561
export default function FeatureBento({ t, lang, basePath }: Props) {
5662
return (
57-
<section className="py-24">
63+
<section id="features" className="py-24">
5864
<div className="mx-auto max-w-6xl px-6">
5965
<h2 className="text-3xl font-bold text-center mb-16">
6066
{t.features.heading}
@@ -70,7 +76,7 @@ export default function FeatureBento({ t, lang, basePath }: Props) {
7076
whileInView={{ opacity: 1, y: 0 }}
7177
viewport={{ once: true, margin: '-50px' }}
7278
transition={{ delay: i * 0.08, duration: 0.5 }}
73-
className="rounded-xl border border-white/10 bg-white/5 overflow-hidden"
79+
className={`rounded-xl border border-white/10 bg-white/5 overflow-hidden ${spanClasses[i] ?? ''}`}
7480
>
7581
<div className="bg-[var(--color-terminal-bg)]">
7682
{asset.type === 'video' ? (

‎site/src/components/Footer.astro‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,16 @@ const altHref = lang === 'en' ? '/ChatCrystal/zh/' : '/ChatCrystal/';
2424
</div>
2525

2626
<!-- Center: Links -->
27-
<nav class="flex gap-6 md:justify-center">
28-
<a href="https://github.com/ZengLiangYi/ChatCrystal" target="_blank" rel="noopener" class="text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.github}</a>
29-
<a href="https://www.npmjs.com/package/chatcrystal" target="_blank" rel="noopener" class="text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.npm}</a>
30-
<a href="https://github.com/ZengLiangYi/ChatCrystal#readme" target="_blank" rel="noopener" class="text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.docs}</a>
31-
<a href="https://github.com/ZengLiangYi/ChatCrystal/releases" target="_blank" rel="noopener" class="text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.releases}</a>
27+
<nav class="flex flex-wrap gap-2 md:justify-center">
28+
<a href="https://github.com/ZengLiangYi/ChatCrystal" target="_blank" rel="noopener" class="inline-flex items-center px-3 py-2 min-h-[44px] text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.github}</a>
29+
<a href="https://www.npmjs.com/package/chatcrystal" target="_blank" rel="noopener" class="inline-flex items-center px-3 py-2 min-h-[44px] text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.npm}</a>
30+
<a href="https://github.com/ZengLiangYi/ChatCrystal#readme" target="_blank" rel="noopener" class="inline-flex items-center px-3 py-2 min-h-[44px] text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.docs}</a>
31+
<a href="https://github.com/ZengLiangYi/ChatCrystal/releases" target="_blank" rel="noopener" class="inline-flex items-center px-3 py-2 min-h-[44px] text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.footer.releases}</a>
3232
</nav>
3333

3434
<!-- Right: Language switch -->
3535
<div class="md:text-right">
36-
<a href={altHref} class="inline-flex items-center gap-1.5 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">
36+
<a href={altHref} class="inline-flex items-center gap-1.5 px-3 py-2 min-h-[44px] text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">
3737
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M2 12h20"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
3838
{altLabel}
3939
</a>

‎site/src/components/Header.astro‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
import type { Translations } from '@/i18n';
3+
4+
interface Props {
5+
t: Translations;
6+
lang: 'en' | 'zh';
7+
basePath: string;
8+
}
9+
10+
const { t, lang, basePath } = Astro.props;
11+
const altLang = lang === 'en' ? 'zh' : 'en';
12+
const altLabel = lang === 'en' ? '中文' : 'EN';
13+
const altHref = lang === 'en' ? `${basePath}/zh/` : `${basePath}/`;
14+
---
15+
16+
<header class="fixed top-0 left-0 right-0 z-50 border-b border-white/10 bg-[var(--color-bg)]/80 backdrop-blur-md">
17+
<div class="mx-auto max-w-6xl px-6 flex items-center justify-between h-14">
18+
<!-- Left: Logo -->
19+
<a href={lang === 'en' ? `${basePath}/` : `${basePath}/zh/`} class="flex items-center gap-2.5">
20+
<img src={`${basePath}/logo.png`} alt="ChatCrystal" class="w-7 h-7" />
21+
<span class="font-semibold text-[var(--color-white)]">ChatCrystal</span>
22+
</a>
23+
24+
<!-- Center: Nav links -->
25+
<nav class="hidden md:flex items-center gap-1">
26+
<a href="#features" class="px-3 py-2 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.nav.features}</a>
27+
<a href="#how-it-works" class="px-3 py-2 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.nav.howItWorks}</a>
28+
<a href="#cli" class="px-3 py-2 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">{t.nav.cli}</a>
29+
</nav>
30+
31+
<!-- Right: Actions -->
32+
<div class="flex items-center gap-3">
33+
<a href={altHref} class="px-3 py-2 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors">
34+
{altLabel}
35+
</a>
36+
<a
37+
href="https://github.com/ZengLiangYi/ChatCrystal"
38+
target="_blank"
39+
rel="noopener"
40+
class="inline-flex items-center gap-1.5 px-3 py-2 text-sm text-[var(--color-dim-white)] hover:text-[var(--color-white)] transition-colors"
41+
>
42+
<svg viewBox="0 0 16 16" fill="currentColor" class="w-4 h-4"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
43+
{t.nav.github}
44+
</a>
45+
</div>
46+
</div>
47+
</header>

‎site/src/components/Hero.tsx‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import type { Translations } from '@/i18n';
44

55
interface Props {
66
t: Translations;
7+
lang: 'en' | 'zh';
78
basePath: string;
89
}
910

@@ -16,7 +17,7 @@ const stagger = {
1617
visible: { transition: { staggerChildren: 0.12 } },
1718
};
1819

19-
export default function Hero({ t, basePath }: Props) {
20+
export default function Hero({ t, lang, basePath }: Props) {
2021
const [copied, setCopied] = useState(false);
2122

2223
const handleCopy = async () => {
@@ -37,7 +38,7 @@ export default function Hero({ t, basePath }: Props) {
3738
>
3839
<motion.span
3940
variants={fadeUp}
40-
className="inline-flex self-start rounded-full border border-[var(--color-purple)]/40 bg-[var(--color-purple)]/10 px-4 py-1.5 text-xs font-medium text-[var(--color-lavender)]"
41+
className="inline-flex self-start rounded-full border border-[var(--color-primary)]/40 bg-[var(--color-primary)]/10 px-4 py-1.5 text-xs font-medium text-[var(--color-accent)]"
4142
>
4243
{t.hero.badge}
4344
</motion.span>
@@ -60,12 +61,16 @@ export default function Hero({ t, basePath }: Props) {
6061
<motion.div variants={fadeUp} className="flex flex-col sm:flex-row gap-3">
6162
<button
6263
onClick={handleCopy}
63-
className="group inline-flex items-center gap-2 rounded-lg bg-[var(--color-purple)] px-5 py-3 font-mono text-sm font-medium text-white hover:bg-[var(--color-deep-purple)] transition-colors cursor-pointer"
64+
className="group inline-flex items-center gap-2 rounded-lg bg-[var(--color-primary)] px-5 py-3 font-mono text-sm font-medium text-white hover:bg-[var(--color-primary-deep)] transition-colors cursor-pointer"
6465
>
6566
<span className="opacity-50">$</span>
6667
<span>{t.hero.installCmd}</span>
6768
<span className="ml-1 text-white/60 group-hover:text-white transition-colors">
68-
{copied ? '✓' : '⎘'}
69+
{copied ? (
70+
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
71+
) : (
72+
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>
73+
)}
6974
</span>
7075
</button>
7176

@@ -83,7 +88,7 @@ export default function Hero({ t, basePath }: Props) {
8388
<motion.div variants={fadeUp}>
8489
<a href="https://github.com/ZengLiangYi/ChatCrystal" target="_blank" rel="noopener">
8590
<img
86-
src="https://img.shields.io/github/stars/ZengLiangYi/ChatCrystal?style=flat&logo=github&color=7B4DAA"
91+
src="https://img.shields.io/github/stars/ZengLiangYi/ChatCrystal?style=flat&logo=github&color=5A5FD6"
8792
alt="GitHub stars"
8893
loading="lazy"
8994
/>
@@ -103,12 +108,12 @@ export default function Hero({ t, basePath }: Props) {
103108
loop
104109
muted
105110
playsInline
106-
poster={`${basePath}/screenshots/en/conversations.png`}
111+
poster={`${basePath}/screenshots/${lang}/conversations.png`}
107112
className="w-full"
108113
>
109114
<source src={`${basePath}/demos/hero.webm`} type="video/webm" />
110115
<source src={`${basePath}/demos/hero.mp4`} type="video/mp4" />
111-
<img src={`${basePath}/screenshots/en/conversations.png`} alt="ChatCrystal" />
116+
<img src={`${basePath}/screenshots/${lang}/conversations.png`} alt="ChatCrystal" />
112117
</video>
113118
</motion.div>
114119
</div>

‎site/src/components/HowItWorks.astro‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,14 @@ import type { Translations } from '@/i18n';
33
44
interface Props {
55
t: Translations;
6+
basePath: string;
67
}
78
8-
const { t } = Astro.props;
9+
const { t, basePath } = Astro.props;
910
const steps = t.howItWorks.steps;
1011
---
1112

12-
<section class="py-24">
13+
<section id="how-it-works" class="py-24">
1314
<div class="mx-auto max-w-5xl px-6">
1415
<h2 class="text-3xl font-bold text-center mb-16 animate-on-scroll">
1516
{t.howItWorks.heading}
@@ -18,15 +19,15 @@ const steps = t.howItWorks.steps;
1819
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 relative stagger-children">
1920
{steps.map((step, i) => (
2021
<div class="relative text-center">
21-
<div class="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-[var(--color-deep-purple)]">
22+
<div class="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-[var(--color-primary-deep)]">
2223
{i === 0 && (
23-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="var(--color-lavender)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
24+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
2425
)}
2526
{i === 1 && (
26-
<img src="/ChatCrystal/logo.png" alt="Crystallize" class="w-7 h-7" />
27+
<img src={`${basePath}/logo.png`} alt="Crystallize" class="w-7 h-7" />
2728
)}
2829
{i === 2 && (
29-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="var(--color-lavender)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
30+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
3031
)}
3132
</div>
3233

‎site/src/components/IntegrationStrip.astro‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,19 +25,22 @@ const sources = [
2525
return (
2626
<div class="flex items-center gap-3 rounded-xl border border-white/10 bg-white/5 px-6 py-4 backdrop-blur-sm">
2727
<div class="w-8 h-8 flex-shrink-0" style={`color: ${s.color}`}>
28+
{/* Claude — official spark mark */}
2829
{s.key === 'claudeCode' && (
2930
<svg viewBox="0 0 24 24" fill="currentColor" class="w-8 h-8">
30-
<path d="M17.3041 3.541h-3.6718l6.696 16.918H24Zm-10.6082 0L0 20.459h3.7442l1.3693-3.5527h7.0052l1.3693 3.5528h3.7442L10.5363 3.5409Zm-.3712 10.2232 2.2914-5.9456 2.2914 5.9456Z" />
31+
<path d="m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z" />
3132
</svg>
3233
)}
34+
{/* Cursor — official logomark */}
3335
{s.key === 'cursor' && (
3436
<svg viewBox="0 0 24 24" fill="currentColor" class="w-8 h-8">
3537
<path d="M11.503.131 1.891 5.678a.84.84 0 0 0-.42.726v11.188c0 .3.162.575.42.724l9.609 5.55a1 1 0 0 0 .998 0l9.61-5.55a.84.84 0 0 0 .42-.724V6.404a.84.84 0 0 0-.42-.726L12.497.131a1.01 1.01 0 0 0-.996 0M2.657 6.338h18.55c.263 0 .43.287.297.515L12.23 22.918c-.062.107-.229.064-.229-.06V12.335a.59.59 0 0 0-.295-.51l-9.11-5.257c-.109-.063-.064-.23.061-.23" />
3638
</svg>
3739
)}
40+
{/* OpenAI — official logomark (for Codex CLI) */}
3841
{s.key === 'codex' && (
39-
<svg viewBox="0 0 16 16" fill="currentColor" class="w-8 h-8">
40-
<path d="M14.949 6.547a3.94 3.94 0 0 0-.348-3.273 4.11 4.11 0 0 0-4.4-1.934A4.1 4.1 0 0 0 8.423.2 4.15 4.15 0 0 0 6.305.086a4.1 4.1 0 0 0-1.891.948 4.04 4.04 0 0 0-1.158 1.753 4.1 4.1 0 0 0-1.563.679A4 4 0 0 0 .554 4.72a3.99 3.99 0 0 0 .502 4.731 3.94 3.94 0 0 0 .346 3.274 4.11 4.11 0 0 0 4.402 1.933c.382.425.852.764 1.377.995.526.231 1.095.35 1.67.346 1.78.002 3.358-1.132 3.901-2.804a4.1 4.1 0 0 0 1.563-.68 4 4 0 0 0 1.14-1.253 3.99 3.99 0 0 0-.506-4.716m-6.097 8.406a3.05 3.05 0 0 1-1.945-.694l.096-.054 3.23-1.838a.53.53 0 0 0 .265-.455v-4.49l1.366.778q.02.011.025.035v3.722c-.003 1.653-1.361 2.992-3.037 2.996m-6.53-2.75a2.95 2.95 0 0 1-.36-2.01l.095.057L5.29 12.09a.53.53 0 0 0 .527 0l3.949-2.246v1.555a.05.05 0 0 1-.022.041L6.473 13.3c-1.454.826-3.311.335-4.15-1.098m-.85-6.94A3.02 3.02 0 0 1 3.07 3.949v3.785a.51.51 0 0 0 .262.451l3.93 2.237-1.366.779a.05.05 0 0 1-.048 0L2.585 9.342a2.98 2.98 0 0 1-1.113-4.094zm11.216 2.571L8.747 5.576l1.362-.776a.05.05 0 0 1 .048 0l3.265 1.86a3 3 0 0 1 1.173 1.207 2.96 2.96 0 0 1-.27 3.2 3.05 3.05 0 0 1-1.36.997V8.279a.52.52 0 0 0-.276-.445m1.36-2.015-.097-.057-3.226-1.855a.53.53 0 0 0-.53 0L6.249 6.153V4.598a.04.04 0 0 1 .019-.04L9.533 2.7a3.07 3.07 0 0 1 3.257.139c.474.325.843.778 1.066 1.303.223.526.289 1.103.191 1.664zM5.503 8.575 4.139 7.8a.05.05 0 0 1-.026-.037V4.049c0-.57.166-1.127.476-1.607s.752-.864 1.275-1.105a3.08 3.08 0 0 1 3.234.41l-.096.054-3.23 1.838a.53.53 0 0 0-.265.455zm.742-1.577 1.758-1 1.762 1v2l-1.755 1-1.762-1z" />
42+
<svg viewBox="0 0 24 24" fill="currentColor" class="w-8 h-8">
43+
<path d="M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z" />
4144
</svg>
4245
)}
4346
</div>

0 commit comments

Comments
 (0)