git » sparkle-arcade » master » tree

[master] / index.html 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Viviana's Sparkle Arcade</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Baloo+2:wght@600&family=Nunito:wght@400;600&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="styles.css" />
</head>
<body>
  <div class="emojis" aria-hidden="true">🌸 💖 🧚 🌈 💜 ✨</div>
  <main class="frame">
    <header class="hero">
      <h1>Viviana's Sparkle Arcade</h1>
      <p class="intro">Cozy browser games crafted for magical playtime.</p>
    </header>

    <section class="game-grid">
      <article class="game-card" role="article">
        <div class="badge">Puzzle 🌷</div>
        <h2>Blossom Blocks</h2>
        <p>Arrange glowing flower tiles on an 8×8 garden. Clear rows and columns to earn sparkles and beat your best bouquet score.</p>
        <ul>
          <li>Flower emojis for every tile</li>
          <li>Drag &amp; drop placement</li>
          <li>Local best-score tracker</li>
        </ul>
        <a class="btn" href="blossom-blocks/" aria-label="Play Blossom Blocks">Play Blossom Blocks</a>
      </article>

      <article class="game-card" role="article">
        <div class="badge">Rhythm ✨</div>
        <h2>Crystal Cloud Carousel</h2>
        <p>Keep the beat by tapping sparkles as they slide down four glowing lanes. Build combos to spin Viviana’s sky pony faster.</p>
        <ul>
          <li>45-second kid-friendly song</li>
          <li>Click hearts or press 1-4 keys</li>
          <li>Combo bonuses &amp; pop-up sparkles</li>
        </ul>
        <a class="btn" href="crystal-cloud-carousel/" aria-label="Play Crystal Cloud Carousel">Play Crystal Cloud Carousel</a>
      </article>

      <article class="game-card" role="article">
        <div class="badge">Match-3 🌙</div>
        <h2>Moonlit Garden Match</h2>
        <p>Swap glowing mushrooms, butterflies, and fairy lights to free sleepy critters before you run out of moonlit moves.</p>
        <ul>
          <li>6×6 dreamy board</li>
          <li>Chain reactions for big scores</li>
          <li>25-move bedtime challenge</li>
        </ul>
        <a class="btn" href="moonlit-garden-match/" aria-label="Play Moonlit Garden Match">Play Moonlit Garden Match</a>
      </article>

      <article class="game-card" role="article">
        <div class="badge">Stacker ⭐</div>
        <h2>Starlit Stacker</h2>
        <p>Tetris-style constellations drift down from the night sky. Rotate and slide them to clear entire rows of stars.</p>
        <ul>
          <li>Classic 10×20 board</li>
          <li>Next-piece peek and hard drop</li>
          <li>Local best-score tracking</li>
        </ul>
        <a class="btn" href="starlit-stacker/" aria-label="Play Starlit Stacker">Play Starlit Stacker</a>
      </article>

      <article class="game-card" role="article">
        <div class="badge">Puzzle 🧚</div>
        <h2>Fairy Finder</h2>
        <p>A gentle Minesweeper-style adventure. Reveal safe meadow squares, flag fairy hiding spots, and clear the whole glen.</p>
        <ul>
          <li>Easy / Medium / Hard gardens</li>
          <li>Right-click or long-press flags</li>
          <li>Timer plus fairy counter</li>
        </ul>
        <a class="btn" href="fairy-finder/" aria-label="Play Fairy Finder">Play Fairy Finder</a>
      </article>
    </section>
  </main>
</body>
</html>