aboutsummaryrefslogtreecommitdiff
path: root/lib/components/MenuButton.svelte
diff options
context:
space:
mode:
authorBobby <[email protected]>2026-04-22 08:10:30 +0530
committerBobby <[email protected]>2026-04-22 08:10:30 +0530
commit0bb36660ec4bceeb4bd9b18cf47a30ba8eded427 (patch)
treef94aa2de99dcb7ee87639a3f60539fd376577bb9 /lib/components/MenuButton.svelte
parente72162b34bddbf04998eea934335e9496b8649f8 (diff)
downloadhollowdark-0bb36660ec4bceeb4bd9b18cf47a30ba8eded427.tar.xz
hollowdark-0bb36660ec4bceeb4bd9b18cf47a30ba8eded427.zip
Rename ui-lib to lib, split Begin into smaller components, add Credits, bump version to 1.0 from package.json
Diffstat (limited to 'lib/components/MenuButton.svelte')
-rw-r--r--lib/components/MenuButton.svelte51
1 files changed, 51 insertions, 0 deletions
diff --git a/lib/components/MenuButton.svelte b/lib/components/MenuButton.svelte
new file mode 100644
index 0000000..1753155
--- /dev/null
+++ b/lib/components/MenuButton.svelte
@@ -0,0 +1,51 @@
+<script lang="ts">
+ type Variant = 'primary' | 'secondary' | 'tertiary'
+
+ interface Props {
+ variant?: Variant
+ onclick: () => void
+ children: import('svelte').Snippet
+ }
+
+ let { variant = 'primary', onclick, children }: Props = $props()
+</script>
+
+<button class="menu-button {variant}" {onclick}>
+ {@render children()}
+</button>
+
+<style>
+ .menu-button {
+ font-family: var(--font-body);
+ letter-spacing: 0.3px;
+ transition: color var(--transition-fast);
+ }
+
+ .primary {
+ font-size: var(--text-lg);
+ color: var(--color-accent);
+ letter-spacing: 0.5px;
+ }
+
+ .primary:hover {
+ color: var(--color-text);
+ }
+
+ .secondary {
+ font-size: 15px;
+ color: var(--color-text-secondary);
+ }
+
+ .secondary:hover {
+ color: var(--color-text);
+ }
+
+ .tertiary {
+ font-size: 13px;
+ color: var(--color-text-tertiary);
+ }
+
+ .tertiary:hover {
+ color: var(--color-text-secondary);
+ }
+</style>