diff --git a/src/lib/components/ring.svelte b/src/lib/components/ring.svelte
index a96366c..6da2030 100644
--- a/src/lib/components/ring.svelte
+++ b/src/lib/components/ring.svelte
@@ -8,7 +8,8 @@
listLink,
prevSymbol,
nextSymbol,
- highlightEmoji,
+ highlightEmojiLeft,
+ highlightEmojiRight,
}: {
ringName: string;
ringLink: string;
@@ -18,14 +19,22 @@
listLink?: string;
prevSymbol: string;
nextSymbol: string;
- highlightEmoji: string;
+
+ // Emoji to be used as highlight next to the title
+ highlightEmojiLeft: string;
+
+ /**
+ * Emoji to be used as highlight to the right of the title. If
+ * not set, will default to highlightEmojiLeft.
+ */
+ highlightEmojiRight?: string;
} = $props();
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 65ef67d..75273d8 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -89,7 +89,7 @@
randLink="https://webring.bucketfish.me/redirect.html?to=random&name=denizk0461"
prevSymbol="⥼"
nextSymbol="⥽"
- highlightEmoji="🏳️🌈" />
+ highlightEmojiLeft="🏳️🌈" />
+ highlightEmojiLeft="👾"
+ highlightEmojiRight="🎮" />
+
+
+
@@ -139,6 +152,8 @@
align-items: center;
justify-content: center;
margin: 16px 0;
+ flex-wrap: wrap;
+ gap: 8px;
}
.gradient-title {
@@ -152,11 +167,4 @@
-webkit-text-fill-color: transparent;
padding-bottom: 12px;
}
-
- @media screen and (max-width: 700px) {
- .webring-container {
- flex-direction: column;
- gap: 16px;
- }
- }
\ No newline at end of file
diff --git a/static/background/20240524_230638.jpg b/static/background/20240524_230638.jpg
new file mode 100755
index 0000000..481764e
Binary files /dev/null and b/static/background/20240524_230638.jpg differ