Skip to content
Merged

k #22

Show file tree
Hide file tree
Changes from all commits
Commits
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
1 change: 0 additions & 1 deletion DNHSCafe_backend
Submodule DNHSCafe_backend deleted from 9467d4
1 change: 0 additions & 1 deletion binary_backend
Submodule binary_backend deleted from 967fba
1 change: 0 additions & 1 deletion binary_frontend
Submodule binary_frontend deleted from f0beea
2 changes: 1 addition & 1 deletion index.md
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ Welcome to the Binary Site! By Justin, Lars, Manahil, Rutvik, Shaurya, Shriya, V
<table>
<td><a href="{{site.baseurl}}/comments" class="button">Comments and Feedback</a></td>
<td><a href="{{site.baseurl}}/leaderboard/" class="button">Leaderboard</a></td>
<td><a class="button">Insert Shriya's Feature</a></td>
<td><a href="{{site.baseurl}}/quiz" class="button">Binary Quiz</a></td>
<td><a class="button">Insert Vincent's Feature</a></td>
</table>
</body>
44 changes: 43 additions & 1 deletion navigation/BinaryLearningGame/BinaryLearningGame.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,48 @@ permalink: /binaryGame
<br>
<br>
<button id="rules-btn" class="rules-button">Rules</button>
<button id="scores-btn" class="rules-button">Scores</button>

<div class="popup" id="scores-popup">
<div class="popup-content">
<div class="table-container">
<table>
<thead>
<tr>
<th>Scores</th>
<th>Difficulty</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="table">
<!-- JavaScript generated data -->
</tbody>
</table>
</div>
<button id="close-scores-btn">Close</button>
</div>
</div>

<div class="popup" id="admin-scores-popup">
<div class="popup-content">
<div class="table-container">
<table>
<thead>
<tr>
<th>Username</th>
<th>Scores</th>
<th>Difficulty</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="admin-table">
<!-- JavaScript generated data -->
</tbody>
</table>
</div>
<button id="close-admin-scores-btn">Close</button>
</div>
</div>

<div class="popup" id="rules-popup">
<div class="popup-content">
Expand All @@ -85,7 +127,7 @@ permalink: /binaryGame
<p>
<strong>Winning:</strong> The game ends when you lose all lives. Your highest score for each level will be saved and can be viewed on the scoreboard.
</p>
<button onclick="closeRulesPopup()">Close</button>
<button>Close</button>
</div>
</div>

Expand Down
74 changes: 74 additions & 0 deletions navigation/BinaryLearningGame/BinaryLearningGameCSS.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,10 @@
/* Disable scrolling on the entire page */
html, body {
overflow: hidden;
height: 100%;
}


:root {
--easy: #8bd39a;
--medium: #ffc85e;
Expand Down Expand Up @@ -340,4 +347,71 @@ header {

#rules-popup #close-rules-btn {
margin-top: 20px;
}

.popup .table-container {
max-height: 500px; /* Adjust the height as needed */
overflow-y: auto;
margin: 20px 0;
border: 1px solid #ddd;
border-radius: 10px;
}

/* Styles for the tables in the scores popups */
.popup table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
font-size: 18px;
text-align: left;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.popup table th,
.popup table td {
padding: 12px 15px;
border: none;
color: black;
}

.popup table th {
background-color: #4CAF50;
color: white;
font-weight: bold;
}

.popup table tr:nth-child(even) {
background-color: #f2f2f2;
}

.popup table tr:hover {
background-color: #ddd;
}

.popup table td {
background-color: white;
color: black;
}

.popup table td .button {
padding: 8px 16px;
margin: 0 5px;
background-color: #006400 !important; /* Dark green */
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease, transform 0.3s ease;
}

.popup table td .button:hover {
background-color: #004d00 !important; /* Slightly darker green */
transform: scale(1.05); /* Expand slightly */
}

.popup table td .button:active {
background-color: #003300 !important; /* Even darker green */
transform: scale(0.95); /* Shrink slightly */
}
Loading
Loading