zzstoatzz.io
+7
-10
frontend/src/routes/costs/+page.svelte
+7
-10
frontend/src/routes/costs/+page.svelte
···
51
51
};
52
52
};
53
53
support: {
54
-
kofi: string;
54
+
url: string;
55
55
message: string;
56
56
};
57
57
}
···
271
271
<h3>support {APP_NAME}</h3>
272
272
<p>{data.support.message}</p>
273
273
</div>
274
-
<a href={data.support.kofi} target="_blank" rel="noopener" class="kofi-button">
275
-
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
276
-
<path d="M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.586 2.672 2.586 2.672s8.267-.023 11.966-.049c2.438-.426 2.683-2.566 2.658-3.734 4.352.24 7.422-2.831 6.649-6.916zm-11.062 3.511c-1.246 1.453-4.011 3.976-4.011 3.976s-.121.119-.31.023c-.076-.057-.108-.09-.108-.09-.443-.441-3.368-3.049-4.034-3.954-.709-.965-1.041-2.7-.091-3.71.951-1.01 3.005-1.086 4.363.407 0 0 1.565-1.782 3.468-.963 1.904.82 1.832 3.011.723 4.311zm6.173.478c-.928.116-1.682.028-1.682.028V7.284h1.77s1.971.551 1.971 2.638c0 1.913-.985 2.667-2.059 3.015z"/>
277
-
</svg>
278
-
buy me a coffee
274
+
<a href={data.support.url} target="_blank" rel="noopener" class="support-button">
275
+
support
279
276
</a>
280
277
</div>
281
278
</section>
···
567
564
font-size: 0.9rem;
568
565
}
569
566
570
-
.kofi-button {
567
+
.support-button {
571
568
display: inline-flex;
572
569
align-items: center;
573
570
gap: 0.5rem;
574
571
padding: 0.75rem 1.5rem;
575
-
background: #ff5e5b;
572
+
background: var(--accent);
576
573
color: white;
577
574
border-radius: 8px;
578
575
text-decoration: none;
···
581
578
transition: transform 0.15s, box-shadow 0.15s;
582
579
}
583
580
584
-
.kofi-button:hover {
581
+
.support-button:hover {
585
582
transform: translateY(-2px);
586
-
box-shadow: 0 4px 12px rgba(255, 94, 91, 0.3);
583
+
box-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 30%, transparent);
587
584
}
588
585
589
586
/* footer */