Skip to content

Commit

Permalink
Rules
Browse files Browse the repository at this point in the history
  • Loading branch information
avanimathur committed Jan 17, 2024
1 parent 68c0020 commit 935da32
Show file tree
Hide file tree
Showing 8 changed files with 170 additions and 0 deletions.
1 change: 1 addition & 0 deletions Dark/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
<h1>Kviz</h1>
<a class="btn" href="game.html">Play</a>
<a class="btn" href="highscore.html">High Scores</a>
<a class="btn" href="rules.html">Rules</a>
</div>
</div>
</div></div>
Expand Down
38 changes: 38 additions & 0 deletions Dark/rules.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
body {
font-size: 25px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
}

.rules-list {
font-size: 18px;
text-align: left;
margin-top: 60px;
}

.rules-list li {
margin-bottom: 15px;
}

.btn {
font-size: 1.8rem;
padding: 1rem 0;
margin-top: 40px;
width: 20rem;
text-align: center;
border: 0.1rem solid #56a5eb;
margin-bottom: 1rem;
text-decoration: none;
color: #56a5eb;
background-color: rgb(235, 244, 253);
}

.btn:hover {
cursor: pointer;
box-shadow: 0 0.4rem 1.4rem 0 rgba(86, 185, 235, 0.5);
transform: translateY(-0.1rem);
transition: transform 150ms;
}
26 changes: 26 additions & 0 deletions Dark/rules.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Quiz Rules</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="rules.css" />
</head>
<body>
<h1>Quiz Rules</h1>
<ol class="rules-list">
<li>You get 15 seconds to answer each question; a timer is displayed to show the time left for each question.</li>
<li>Speed Bonus If You Answer Quickly</li>
<ul>
<li>You will earn +10 points for providing a correct answer within the first 5 seconds.</li>
<li>If you give a correct answer after the initial 5 seconds but within 10 seconds, you get +5 points.</li>
<li>Answers given correctly after 10 seconds will still be rewarded with +2 points.</li>
</ul>

<li>There is no negative marking for a wrong answer.</li>
</ol>
<a class="btn" href="index.html" id="goHomeBtn">Go Home</a>
</body>
</html>
20 changes: 20 additions & 0 deletions Dark/rules.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
function openRulesPage() {
window.location.href = 'rules.html';
}

function goHome() {
window.location.href = 'index.html';
}

document.addEventListener('DOMContentLoaded', function () {
const rulesBtn = document.getElementById('rulesBtn');
const goHomeBtn = document.getElementById('goHomeBtn');

if (rulesBtn) {
rulesBtn.addEventListener('click', openRulesPage);
}

if (goHomeBtn) {
goHomeBtn.addEventListener('click', goHome);
}
});
1 change: 1 addition & 0 deletions Light/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
<h1>Kviz</h1>
<a class="btn" href="game.html">Play</a>
<a class="btn" href="highscore.html">High Scores</a>
<a class="btn" href="rules.html">Rules</a>
</div>
</div>
</body>
Expand Down
38 changes: 38 additions & 0 deletions Light/rules.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
body {
font-size: 25px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
}

.rules-list {
font-size: 18px;
text-align: left;
margin-top: 60px;
}

.rules-list li {
margin-bottom: 15px;
}

.btn {
font-size: 1.8rem;
padding: 1rem 0;
margin-top: 40px;
width: 20rem;
text-align: center;
border: 0.1rem solid #56a5eb;
margin-bottom: 1rem;
text-decoration: none;
color: #56a5eb;
background-color: rgb(235, 244, 253);
}

.btn:hover {
cursor: pointer;
box-shadow: 0 0.4rem 1.4rem 0 rgba(86, 185, 235, 0.5);
transform: translateY(-0.1rem);
transition: transform 150ms;
}
26 changes: 26 additions & 0 deletions Light/rules.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Quiz Rules</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="rules.css" />
</head>
<body>
<h1>Quiz Rules</h1>
<ol class="rules-list">
<li>You get 15 seconds to answer each question; a timer is displayed to show the time left for each question.</li>
<li>Speed Bonus If You Answer Quickly</li>
<ul>
<li>You will earn +10 points for providing a correct answer within the first 5 seconds.</li>
<li>If you give a correct answer after the initial 5 seconds but within 10 seconds, you get +5 points.</li>
<li>Answers given correctly after 10 seconds will still be rewarded with +2 points.</li>
</ul>

<li>There is no negative marking for a wrong answer.</li>
</ol>
<a class="btn" href="index.html" id="goHomeBtn">Go Home</a>
</body>
</html>
20 changes: 20 additions & 0 deletions Light/rules.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
function openRulesPage() {
window.location.href = 'rules.html';
}

function goHome() {
window.location.href = 'index.html';
}

document.addEventListener('DOMContentLoaded', function () {
const rulesBtn = document.getElementById('rulesBtn');
const goHomeBtn = document.getElementById('goHomeBtn');

if (rulesBtn) {
rulesBtn.addEventListener('click', openRulesPage);
}

if (goHomeBtn) {
goHomeBtn.addEventListener('click', goHome);
}
});

0 comments on commit 935da32

Please sign in to comment.