Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Copyright year updated dynamically #48

Merged
merged 1 commit into from
May 21, 2024
Merged

Copyright year updated dynamically #48

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
89 changes: 50 additions & 39 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,47 +4,58 @@
<meta charset="UTF-8" />
<title>Breakout Game</title>
<link rel="stylesheet" href="styles.css" />
<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=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<header>
<h1 class="heading">The Breakout Game</h1>
</header>
<main>
<article class="game-container">
<section class="game-info">
<div>
<h2>Breakout Game</h2>
<p>This game is simple and easy to play and also beginner friendly. So why are you waiting? Start playing the game and enjoy to the fullest!</p>
</div>
</section>
<canvas id="myCanvas" width="600" height="600"></canvas>
<section class="game-option">
<h3>Game Options :</h3>
<div class="speed-container">
<label for="speed-slider">Change speed of the ball :</label>
<input id="speed-slider" type="range" min="1" max="5" value="2.5" />
</div>
<div id="size-container">
<label for="size-slider">Change size of the ball :</label>
<input id="size-slider" type="range" min="3" max="30" />
</div>
</section>
<div class="alert success">
<strong>YOU WIN, CONGRATULATIONS!</strong>
<button id="successBtn" class="close">Restart the Game</button>
</div>
<div class="alert failure">
<strong>GAME OVER!</strong>
<button id="failureBtn" class="close">Restart the Game</button>
</div>
</article>
</main>
<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=Roboto&display=swap"
rel="stylesheet"
/>
</head>
<body>
<header>
<h1 class="heading">The Breakout Game</h1>
</header>
<main>
<article class="game-container">
<section class="game-info">
<div>
<h2>Breakout Game</h2>
<p>
This game is simple and easy to play and also beginner friendly.
So why are you waiting? Start playing the game and enjoy to the
fullest!
</p>
</div>
</section>
<canvas id="myCanvas" width="600" height="600"></canvas>
<section class="game-option">
<h3>Game Options :</h3>
<div class="speed-container">
<label for="speed-slider">Change speed of the ball :</label>
<input id="speed-slider" type="range" min="1" max="5" value="2.5" />
</div>
<div id="size-container">
<label for="size-slider">Change size of the ball :</label>
<input id="size-slider" type="range" min="3" max="30" />
</div>
</section>
<div class="alert success">
<strong>YOU WIN, CONGRATULATIONS!</strong>
<button id="successBtn" class="close">Restart the Game</button>
</div>
<div class="alert failure">
<strong>GAME OVER!</strong>
<button id="failureBtn" class="close">Restart the Game</button>
</div>
</article>
</main>
<footer>
<span>Copyright &copy; 2022 Dhanush Nehru | The Breakout Game ❤</span>
<span
>Copyright &copy; <span id="year"></span> Dhanush Nehru | The Breakout
Game ❤</span
>
</footer>
<script src="utils/utilsCopyright.js"></script>
<script src="utils/utilsColor.js"></script>
<script src="script.js"></script>
</body>
Expand Down
3 changes: 3 additions & 0 deletions utils/utilsCopyright.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
const currentYear = new Date().getFullYear();

document.getElementById('year').textContent = currentYear;