pig-dice-game/index.html at main · Pranav-Jadhav09/pig-dice-game · GitHub

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
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta
      name="description"
      content="Play the classic Pig Dice Game online! Roll the dice, accumulate points, and avoid the Pig Out. Challenge friends or the computer in this addictive web game built with HTML, CSS, and JavaScript. Enjoy smooth animations, strategic gameplay, and aim for the highest score. Experience the excitement now!"
    />

    <!-- Favicon -->
    <link
      rel="apple-touch-icon"
      sizes="180x180"
      href="./assets/favicon_io/apple-touch-icon.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="./assets/favicon_io/android-chrome-192x192.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="16x16"
      href="./assets/favicon_io/android-chrome-512x512.png"
    />

    <link rel="manifest" href="./assets/favicon_io/site.webmanifest" />

    <!-- CSS File -->
    <link rel="stylesheet" href="./assets/css/style.css" />

    <title>Pig Dice | Game</title>
  </head>
  <body>
    <main>
      <!-- First Player -->
      <section class="player player-0 player-active">
        <h2 class="name" id="name-0">Player 1</h2>
        <p class="score" id="score-0">95</p>

        <div class="current">
          <p class="current-label">Current</p>
          <p class="current-score" id="current-0">0</p>
        </div>
      </section>

      <!-- Second Player -->
      <section class="player player-1">
        <h2 class="name" id="name-1">Player 2</h2>
        <p class="score" id="score-1">95</p>

        <div class="current">
          <p class="current-label">Current</p>
          <p class="current-score" id="current-1">0</p>
        </div>
      </section>

      <!-- Absolute : Buttons & Image -->
      <img src="./assets/images/dice-1.png" alt="Dice-Image" class="dice" />
      <button class="btn btn-new">🔄 New Game</button>
      <button class="btn btn-roll">🎲 Roll Dice</button>
      <button class="btn btn-hold">📥 Hold</button>
    </main>

    <!-- Game Logic -->
    <script src="./assets/js/app.js"></script>
  </body>
</html>