feat: SEO

This commit is contained in:
Face 2025-05-30 13:15:00 +03:00
parent 070d70e3ec
commit 919ae0bc37
17 changed files with 226 additions and 91 deletions

View file

@ -3,7 +3,22 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" /> <link rel="icon" href="%sveltekit.assets%/favicon.png" />
<link rel="apple-touch-icon" href="%sveltekit.assets%/placeholder_logo.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Rugplay</title>
<!-- Global Meta Tags -->
<meta name="application-name" content="Rugplay" />
<meta name="theme-color" content="#fb2c36" />
<meta name="apple-mobile-web-app-title" content="Rugplay" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
<meta name="format-detection" content="telephone=no" />
<!-- Preconnect to external domains for performance -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover"> <body data-sveltekit-preload-data="hover">

View file

@ -0,0 +1,81 @@
<script lang="ts">
import { page } from '$app/stores';
let {
title = 'Rugplay',
description = 'Experience realistic cryptocurrency trading simulation game with AI-powered markets, rug pull mechanics, and virtual currencies. Learn crypto trading without financial risk in this educational game.',
type = 'website',
image = '/placeholder_logo.png',
imageAlt = 'Rugplay Logo',
keywords = '',
author = 'Outpoot',
canonicalUrl = '',
noindex = false
}: {
title?: string;
description?: string;
type?: 'website' | 'article' | 'profile';
image?: string | null;
imageAlt?: string;
keywords?: string;
author?: string;
canonicalUrl?: string;
noindex?: boolean;
} = $props();
let currentUrl = $derived($page?.url?.href || '');
let canonical = $derived(canonicalUrl || currentUrl);
let fullImageUrl = $derived(
image?.startsWith('http') ? image : `${$page?.url?.origin || 'https://rugplay.com'}${image}`
);
let defaultKeywords =
'cryptocurrency simulation, trading game, crypto simulator, virtual trading, rug pull simulation, defi game, blockchain simulation, bitcoin simulator, ethereum game, trading simulator, educational game, crypto learning';
let allKeywords = $derived(keywords ? `${defaultKeywords}, ${keywords}` : defaultKeywords);
</script>
<svelte:head>
<!-- Basic Meta Tags -->
<title>{title}</title>
<meta name="description" content={description} />
<meta name="keywords" content={allKeywords} />
<meta name="author" content={author} />
{#if noindex}
<meta name="robots" content="noindex, nofollow" />
{:else}
<meta name="robots" content="index, follow" />
{/if}
<!-- Canonical URL -->
{#if canonical}
<link rel="canonical" href={canonical} />
{/if}
<!-- Open Graph Meta Tags -->
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:type" content={type} />
<meta property="og:url" content={currentUrl} />
<meta property="og:image" content={fullImageUrl} />
<meta property="og:image:alt" content={imageAlt} />
<meta property="og:site_name" content="Rugplay" />
<meta property="og:locale" content="en_US" />
<!-- Twitter Card Meta Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
<meta name="twitter:image" content={fullImageUrl} />
<meta name="twitter:image:alt" content={imageAlt} />
<meta name="twitter:site" content="@facedevstuff" />
<meta name="twitter:creator" content="@facedevstuff" />
<!-- Additional Meta Tags -->
<meta name="theme-color" content="#fb2c36" />
<meta name="application-name" content="Rugplay" />
<meta name="apple-mobile-web-app-title" content="Rugplay" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
</svelte:head>

View file

@ -7,6 +7,7 @@
import CoinIcon from '$lib/components/self/CoinIcon.svelte'; import CoinIcon from '$lib/components/self/CoinIcon.svelte';
import DataTable from '$lib/components/self/DataTable.svelte'; import DataTable from '$lib/components/self/DataTable.svelte';
import HomeSkeleton from '$lib/components/self/skeletons/HomeSkeleton.svelte'; import HomeSkeleton from '$lib/components/self/skeletons/HomeSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
@ -76,6 +77,12 @@
]; ];
</script> </script>
<SEO
title="Rugplay"
description="Experience realistic cryptocurrency trading simulation with AI-powered markets, rug pull mechanics, and virtual currencies. Learn crypto trading without financial risk in this educational trading game."
keywords="crypto simulation game, trading practice game, rug pull simulation, virtual cryptocurrency game"
/>
<SignInConfirmDialog bind:open={shouldSignIn} /> <SignInConfirmDialog bind:open={shouldSignIn} />
<div class="container mx-auto p-6"> <div class="container mx-auto p-6">

View file

@ -25,6 +25,7 @@
import { fetchPortfolioData } from '$lib/stores/portfolio-data'; import { fetchPortfolioData } from '$lib/stores/portfolio-data';
import { getPublicUrl, getTimeframeInSeconds } from '$lib/utils.js'; import { getPublicUrl, getTimeframeInSeconds } from '$lib/utils.js';
import { websocketController, type PriceUpdate, isConnectedStore } from '$lib/stores/websocket'; import { websocketController, type PriceUpdate, isConnectedStore } from '$lib/stores/websocket';
import SEO from '$lib/components/self/SEO.svelte';
const { data } = $props(); const { data } = $props();
const coinSymbol = data.coinSymbol; const coinSymbol = data.coinSymbol;
@ -329,9 +330,19 @@
} }
</script> </script>
<svelte:head> <SEO
<title>{coin ? `${coin.name} (${coin.symbol})` : 'Loading...'} - Rugplay</title> title={coin
</svelte:head> ? `${coin.name} (*${coin.symbol}) - Rugplay`
: `Loading ${coinSymbol.toUpperCase()} - Rugplay Game`}
description={coin
? `Trade ${coin.name} (*${coin.symbol}) in the Rugplay simulation game. Current price: $${formatPrice(coin.currentPrice)}, Market cap: ${formatMarketCap(coin.marketCap)}, 24h change: ${coin.change24h >= 0 ? '+' : ''}${coin.change24h.toFixed(2)}%.`
: `Virtual cryptocurrency trading page for ${coinSymbol.toUpperCase()} in the Rugplay simulation game.`}
keywords={coin
? `${coin.name} cryptocurrency game, *${coin.symbol} virtual trading, ${coin.symbol} price simulation, cryptocurrency trading game, virtual coin ${coin.symbol}`
: `${coinSymbol} virtual cryptocurrency, crypto trading simulation, virtual coin trading`}
image={coin?.icon ? getPublicUrl(coin.icon) : '/placeholder_logo.png'}
imageAlt={coin ? `${coin.name} (${coin.symbol}) logo` : `${coinSymbol} cryptocurrency logo`}
/>
{#if coin} {#if coin}
<TradeModal bind:open={buyModalOpen} type="BUY" {coin} onSuccess={handleTradeSuccess} /> <TradeModal bind:open={buyModalOpen} type="BUY" {coin} onSuccess={handleTradeSuccess} />

View file

@ -11,6 +11,7 @@
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { CREATION_FEE, INITIAL_LIQUIDITY, TOTAL_COST } from '$lib/data/constants'; import { CREATION_FEE, INITIAL_LIQUIDITY, TOTAL_COST } from '$lib/data/constants';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
import SEO from '$lib/components/self/SEO.svelte';
let name = $state(''); let name = $state('');
let symbol = $state(''); let symbol = $state('');
@ -113,9 +114,11 @@
} }
</script> </script>
<svelte:head> <SEO
<title>Create Coin - Rugplay</title> title="Create Coin - Rugplay"
</svelte:head> description="Launch your own virtual cryptocurrency in the Rugplay simulation game. Create coins with custom names, symbols, and icons."
keywords="create virtual cryptocurrency, coin creation game, launch crypto simulation, virtual token creation, cryptocurrency game creator"
/>
<div class="container mx-auto max-w-5xl px-4 py-6"> <div class="container mx-auto max-w-5xl px-4 py-6">
<div class="grid grid-cols-1 gap-6 lg:grid-cols-3"> <div class="grid grid-cols-1 gap-6 lg:grid-cols-3">

View file

@ -7,6 +7,7 @@
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
import SignInConfirmDialog from '$lib/components/self/SignInConfirmDialog.svelte'; import SignInConfirmDialog from '$lib/components/self/SignInConfirmDialog.svelte';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
import SEO from '$lib/components/self/SEO.svelte';
let shouldSignIn = $state(false); let shouldSignIn = $state(false);
let balance = $state(0); let balance = $state(0);
@ -36,11 +37,15 @@
}); });
</script> </script>
<SEO
title="Gambling - Rugplay"
description="Play virtual gambling games with simulated currency in Rugplay. Try coinflip and slots games using virtual money with no real-world value - purely for entertainment."
keywords="virtual gambling simulation, coinflip game, slots game, virtual casino, simulated gambling, entertainment games"
/>
<SignInConfirmDialog bind:open={shouldSignIn} /> <SignInConfirmDialog bind:open={shouldSignIn} />
<svelte:head>
<title>Gambling - Rugplay</title>
</svelte:head>
<div class="container mx-auto max-w-4xl p-6"> <div class="container mx-auto max-w-4xl p-6">
<h1 class="mb-6 text-center text-3xl font-bold">Gambling</h1> <h1 class="mb-6 text-center text-3xl font-bold">Gambling</h1>

View file

@ -7,10 +7,10 @@
import { Input } from '$lib/components/ui/input'; import { Input } from '$lib/components/ui/input';
import { Label } from '$lib/components/ui/label'; import { Label } from '$lib/components/ui/label';
import { Badge } from '$lib/components/ui/badge'; import { Badge } from '$lib/components/ui/badge';
import { Skeleton } from '$lib/components/ui/skeleton';
import * as Avatar from '$lib/components/ui/avatar'; import * as Avatar from '$lib/components/ui/avatar';
import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte'; import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte';
import HopiumSkeleton from '$lib/components/self/skeletons/HopiumSkeleton.svelte'; import HopiumSkeleton from '$lib/components/self/skeletons/HopiumSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { import {
TrendingUp, TrendingUp,
TrendingDown, TrendingDown,
@ -19,8 +19,6 @@
Sparkles, Sparkles,
Globe, Globe,
Loader2, Loader2,
CheckCircle,
XCircle,
CheckIcon, CheckIcon,
XIcon XIcon
} from 'lucide-svelte'; } from 'lucide-svelte';
@ -124,13 +122,11 @@
}); });
</script> </script>
<svelte:head> <SEO
<title>Hopium - Prediction Market | Rugplay</title> title="Hopium - Rugplay"
<meta description="AI-powered prediction markets in the Rugplay simulation game. Create yes/no questions, bet on outcomes with virtual currency, and test your forecasting skills."
name="description" keywords="AI prediction markets game, virtual betting simulation, cryptocurrency prediction game, forecasting game, virtual currency betting"
content="Create and bet on prediction markets with AI-powered resolution" />
/>
</svelte:head>
<!-- Create Question Dialog --> <!-- Create Question Dialog -->
<Dialog.Root bind:open={showCreateDialog}> <Dialog.Root bind:open={showCreateDialog}>

View file

@ -9,6 +9,7 @@
import * as Avatar from '$lib/components/ui/avatar'; import * as Avatar from '$lib/components/ui/avatar';
import { Separator } from '$lib/components/ui/separator'; import { Separator } from '$lib/components/ui/separator';
import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte'; import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { import {
Loader2, Loader2,
Calculator, Calculator,
@ -194,14 +195,15 @@
); );
</script> </script>
<svelte:head> <SEO
{#if question} title={question
<title>{question.question} - Rugplay</title> ? `${question.question} - Hopium - Rugplay`
<meta name="description" content={question.description || question.question} /> : 'Loading Question - Hopium - Rugplay'}
{:else} description={question
<title>Hopium - Rugplay</title> ? `Bet on "${question.question}" in Rugplay's AI-powered prediction market. Current odds: ${question.yesPercentage.toFixed(1)}% YES, ${question.noPercentage.toFixed(1)}% NO. Total volume: $${question.totalAmount.toFixed(2)}.`
{/if} : 'AI-powered prediction market question in the Rugplay simulation game.'}
</svelte:head> keywords="AI prediction market question, virtual betting, cryptocurrency prediction game, yes no betting, forecasting simulation"
/>
<div class="container mx-auto max-w-7xl p-6"> <div class="container mx-auto max-w-7xl p-6">
{#if loading} {#if loading}
@ -591,8 +593,12 @@
> >
</Avatar.Root> </Avatar.Root>
<div> <div>
<div class="font-semibold hover:underline">{bet.user?.name || "Deleted User"}</div> <div class="font-semibold hover:underline">
<div class="text-muted-foreground text-sm">@{bet.user?.username || "deleted_user"}</div> {bet.user?.name || 'Deleted User'}
</div>
<div class="text-muted-foreground text-sm">
@{bet.user?.username || 'deleted_user'}
</div>
</div> </div>
</button> </button>
</HoverCard.Trigger> </HoverCard.Trigger>

View file

@ -1,15 +1,14 @@
<script lang="ts"> <script lang="ts">
import * as Card from '$lib/components/ui/card'; import * as Card from '$lib/components/ui/card';
import * as Avatar from '$lib/components/ui/avatar';
import { Badge } from '$lib/components/ui/badge';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
import DataTable from '$lib/components/self/DataTable.svelte'; import DataTable from '$lib/components/self/DataTable.svelte';
import LeaderboardSkeleton from '$lib/components/self/skeletons/LeaderboardSkeleton.svelte'; import LeaderboardSkeleton from '$lib/components/self/skeletons/LeaderboardSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { Trophy, TrendingDown, Crown, Skull, Target, RefreshCw } from 'lucide-svelte'; import { TrendingDown, Crown, Skull, Target, RefreshCw, Trophy } from 'lucide-svelte';
import { getPublicUrl, formatValue } from '$lib/utils'; import { formatValue } from '$lib/utils';
let leaderboardData = $state<any>(null); let leaderboardData = $state<any>(null);
let loading = $state(true); let loading = $state(true);
@ -197,9 +196,11 @@
]; ];
</script> </script>
<svelte:head> <SEO
<title>Leaderboard - Rugplay</title> title="Leaderboard - Rugplay"
</svelte:head> description="View top performers in the Rugplay cryptocurrency simulation game. See rankings for biggest profits, losses, cash holders, and portfolio values in our virtual trading game."
keywords="crypto game leaderboard, trading simulation rankings, virtual portfolio rankings, crypto game winners"
/>
<div class="container mx-auto max-w-7xl p-4 md:p-6"> <div class="container mx-auto max-w-7xl p-4 md:p-6">
<header class="mb-6 md:mb-8"> <header class="mb-6 md:mb-8">

View file

@ -6,30 +6,17 @@
import ShieldCheck from 'lucide-svelte/icons/shield-check'; import ShieldCheck from 'lucide-svelte/icons/shield-check';
import AlertTriangle from 'lucide-svelte/icons/alert-triangle'; import AlertTriangle from 'lucide-svelte/icons/alert-triangle';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { page } from '$app/state'; import SEO from '$lib/components/self/SEO.svelte';
const LAST_UPDATED = 'May 29, 2025'; const LAST_UPDATED = 'May 29, 2025';
const CONTACT_EMAIL = 'privacy@outpoot.com'; const CONTACT_EMAIL = 'privacy@outpoot.com';
</script> </script>
<svelte:head> <SEO
<title>Privacy Policy - Rugplay</title> title="Privacy Policy - Rugplay"
<meta description="Privacy Policy for Rugplay cryptocurrency simulation game. Learn about data collection, account deletion process, virtual currency privacy, and your rights."
name="description" keywords="privacy policy, data protection, account deletion, virtual currency privacy, simulation game privacy"
content="Learn how we protect your privacy on Rugplay and what data we retain after account deletion." />
/>
<meta
name="keywords"
content="privacy, policy, data protection, crypto, trading, GDPR, rugplay"
/>
<meta property="og:title" content="Privacy Policy - Rugplay" />
<meta
property="og:description"
content="Learn how we protect your privacy on Rugplay and what data we retain after account deletion."
/>
<meta property="og:type" content="website" />
<meta property="og:url" content={page.url.href} />
</svelte:head>
<div class="container mx-auto max-w-4xl py-10"> <div class="container mx-auto max-w-4xl py-10">
<Card.Root class="p-6"> <Card.Root class="p-6">

View file

@ -7,13 +7,19 @@
import AlertTriangle from 'lucide-svelte/icons/alert-triangle'; import AlertTriangle from 'lucide-svelte/icons/alert-triangle';
import TrendingDown from 'lucide-svelte/icons/trending-down'; import TrendingDown from 'lucide-svelte/icons/trending-down';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { page } from '$app/state'; import SEO from '$lib/components/self/SEO.svelte';
const LAST_UPDATED = 'May 29, 2025'; const LAST_UPDATED = 'May 29, 2025';
const CONTACT_EMAIL = 'contact@outpoot.com'; const CONTACT_EMAIL = 'contact@outpoot.com';
const MINIMUM_AGE = 18; const MINIMUM_AGE = 18;
</script> </script>
<SEO
title="Terms of Service - Rugplay"
description="Terms of Service for Rugplay - cryptocurrency trading simulation game. Learn about virtual currency, rug pull mechanics, gambling features, and platform rules."
keywords="terms of service, legal terms, simulation game rules, virtual currency terms, rug pull simulation"
/>
<div class="container mx-auto max-w-4xl py-10"> <div class="container mx-auto max-w-4xl py-10">
<Card.Root class="p-6"> <Card.Root class="p-6">
<div class="mb-8 flex items-center gap-3"> <div class="mb-8 flex items-center gap-3">

View file

@ -10,6 +10,7 @@
import CoinIcon from '$lib/components/self/CoinIcon.svelte'; import CoinIcon from '$lib/components/self/CoinIcon.svelte';
import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte'; import UserProfilePreview from '$lib/components/self/UserProfilePreview.svelte';
import LiveTradeSkeleton from '$lib/components/self/skeletons/LiveTradeSkeleton.svelte'; import LiveTradeSkeleton from '$lib/components/self/skeletons/LiveTradeSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
function handleUserClick(username: string) { function handleUserClick(username: string) {
goto(`/user/${username}`); goto(`/user/${username}`);
@ -20,6 +21,12 @@
} }
</script> </script>
<SEO
title="Live Trades - Rugplay"
description="Watch real-time virtual cryptocurrency trading activity in the Rugplay simulation game. See live trades, user activity, and market movements as they happen."
keywords="live crypto trades game, real-time trading simulation, virtual trading activity, crypto game stream"
/>
<svelte:head> <svelte:head>
<title>Live Trades - Rugplay</title> <title>Live Trades - Rugplay</title>
<meta name="description" content="Real-time cryptocurrency trading activity on Rugplay" /> <meta name="description" content="Real-time cryptocurrency trading activity on Rugplay" />

View file

@ -9,20 +9,12 @@
import { Label } from '$lib/components/ui/label'; import { Label } from '$lib/components/ui/label';
import CoinIcon from '$lib/components/self/CoinIcon.svelte'; import CoinIcon from '$lib/components/self/CoinIcon.svelte';
import MarketSkeleton from '$lib/components/self/skeletons/MarketSkeleton.svelte'; import MarketSkeleton from '$lib/components/self/skeletons/MarketSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { page } from '$app/stores'; import { page } from '$app/stores';
import { import { Search, RefreshCw, SlidersHorizontal, ChevronLeft, ChevronRight } from 'lucide-svelte';
Search,
RefreshCw,
SlidersHorizontal,
ChevronLeft,
ChevronRight,
DollarSign,
TrendingUp,
ArrowUpDown
} from 'lucide-svelte';
import { formatPrice, formatMarketCap, debounce, formatRelativeTime } from '$lib/utils'; import { formatPrice, formatMarketCap, debounce, formatRelativeTime } from '$lib/utils';
import { MediaQuery } from 'svelte/reactivity'; import { MediaQuery } from 'svelte/reactivity';
import type { CoinData, FilterOption, VolatilityBadge, MarketResponse } from '$lib/types/market'; import type { CoinData, FilterOption, VolatilityBadge, MarketResponse } from '$lib/types/market';
@ -240,13 +232,11 @@
); );
</script> </script>
<svelte:head> <SEO
<title>Market - Rugplay</title> title="Market - Rugplay"
<meta description="Discover and trade virtual cryptocurrencies in our simulation game. Browse all available simulated coins, filter by price and performance, and more."
name="description" keywords="virtual cryptocurrency market, crypto trading game, coin discovery simulation, market analysis game, trading practice"
content="Discover and trade cryptocurrencies. Search, filter, and sort through all available coins." />
/>
</svelte:head>
<div class="container mx-auto max-w-7xl p-6"> <div class="container mx-auto max-w-7xl p-6">
<header class="mb-8"> <header class="mb-8">

View file

@ -5,6 +5,7 @@
import CoinIcon from '$lib/components/self/CoinIcon.svelte'; import CoinIcon from '$lib/components/self/CoinIcon.svelte';
import DataTable from '$lib/components/self/DataTable.svelte'; import DataTable from '$lib/components/self/DataTable.svelte';
import PortfolioSkeleton from '$lib/components/self/skeletons/PortfolioSkeleton.svelte'; import PortfolioSkeleton from '$lib/components/self/skeletons/PortfolioSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { getPublicUrl, formatPrice, formatValue, formatQuantity, formatDate } from '$lib/utils'; import { getPublicUrl, formatPrice, formatValue, formatQuantity, formatDate } from '$lib/utils';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
@ -161,9 +162,12 @@
]); ]);
</script> </script>
<svelte:head> <SEO
<title>Portfolio - Rugplay</title> title="Portfolio - Rugplay"
</svelte:head> description="View your virtual cryptocurrency portfolio, simulated holdings, and trading performance in the Rugplay simulation game platform."
noindex={true}
keywords="virtual portfolio management, crypto holdings game, trading performance simulator, investment tracking game"
/>
<div class="container mx-auto max-w-7xl p-6"> <div class="container mx-auto max-w-7xl p-6">
<header class="mb-8"> <header class="mb-8">

View file

@ -15,6 +15,7 @@
import { volumeSettings } from '$lib/stores/volume-settings'; import { volumeSettings } from '$lib/stores/volume-settings';
import { USER_DATA } from '$lib/stores/user-data'; import { USER_DATA } from '$lib/stores/user-data';
import * as Dialog from '$lib/components/ui/dialog'; import * as Dialog from '$lib/components/ui/dialog';
import SEO from '$lib/components/self/SEO.svelte';
let name = $state($USER_DATA?.name || ''); let name = $state($USER_DATA?.name || '');
let bio = $state($USER_DATA?.bio ?? ''); let bio = $state($USER_DATA?.bio ?? '');
@ -259,6 +260,13 @@
} }
</script> </script>
<SEO
title="Settings - Rugplay"
description="Manage your Rugplay account settings, profile information, audio preferences, and privacy options."
noindex={true}
keywords="game account settings, profile settings game, privacy settings, audio settings game"
/>
<div class="container mx-auto max-w-2xl p-6"> <div class="container mx-auto max-w-2xl p-6">
<h1 class="mb-6 text-2xl font-bold">Settings</h1> <h1 class="mb-6 text-2xl font-bold">Settings</h1>

View file

@ -10,6 +10,7 @@
import { formatValue } from '$lib/utils'; import { formatValue } from '$lib/utils';
import { allTradesStore } from '$lib/stores/websocket'; import { allTradesStore } from '$lib/stores/websocket';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
import SEO from '$lib/components/self/SEO.svelte';
interface CoinData { interface CoinData {
symbol: string; symbol: string;
@ -192,10 +193,11 @@
}); });
</script> </script>
<svelte:head> <SEO
<title>Treemap - Rugplay</title> title="Treemap - Rugplay"
<meta name="description" content="Cryptocurrency market treemap visualization" /> description="Interactive virtual cryptocurrency market treemap visualization. View simulated market cap and 24h price changes for all coins in our trading game's visual treemap format."
</svelte:head> keywords="virtual cryptocurrency treemap, market visualization game, crypto market cap simulation, price changes game, market analysis simulator"
/>
<div <div
bind:this={fullscreenContainer} bind:this={fullscreenContainer}

View file

@ -6,6 +6,7 @@
import DataTable from '$lib/components/self/DataTable.svelte'; import DataTable from '$lib/components/self/DataTable.svelte';
import ProfileBadges from '$lib/components/self/ProfileBadges.svelte'; import ProfileBadges from '$lib/components/self/ProfileBadges.svelte';
import ProfileSkeleton from '$lib/components/self/skeletons/ProfileSkeleton.svelte'; import ProfileSkeleton from '$lib/components/self/skeletons/ProfileSkeleton.svelte';
import SEO from '$lib/components/self/SEO.svelte';
import { getPublicUrl, formatPrice, formatValue, formatQuantity, formatDate } from '$lib/utils'; import { getPublicUrl, formatPrice, formatValue, formatQuantity, formatDate } from '$lib/utils';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { toast } from 'svelte-sonner'; import { toast } from 'svelte-sonner';
@ -194,17 +195,22 @@
]; ];
</script> </script>
<svelte:head> <SEO
<title title={profileData?.profile?.name
>{profileData?.profile?.name ? `${profileData.profile.name} (@${profileData.profile.username}) - Rugplay`
? `${profileData.profile.name} (@${profileData.profile.username})` : `@${username} - Rugplay`}
: 'Loading...'} - Rugplay</title description={profileData?.profile?.bio
> ? `${profileData.profile.bio} - View ${profileData.profile.name}'s simulated trading activity and virtual portfolio in the Rugplay cryptocurrency simulation game.`
<meta : `View @${username}'s profile and simulated trading activity in Rugplay - cryptocurrency trading simulation game platform.`}
name="description" type="profile"
content="View {profileData?.profile?.name || 'user'}'s profile and trading activity on Rugplay" image={profileData?.profile?.image
/> ? getPublicUrl(profileData.profile.image)
</svelte:head> : '/placeholder_logo.png'}
imageAlt={profileData?.profile?.name
? `${profileData.profile.name}'s profile picture`
: `@${username}'s profile`}
keywords="crypto trader profile game, virtual trading portfolio, cryptocurrency simulation game, user portfolio simulator"
/>
<div class="container mx-auto max-w-6xl p-6"> <div class="container mx-auto max-w-6xl p-6">
{#if loading} {#if loading}