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

Alligned Navbar #749

Closed
wants to merge 4 commits into from
+455 −302
Closed

Alligned Navbar #749

Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a01ba5f
Removed Dissortion
sailaja-adapa Aug 9, 2024
1ade752
Alligned Navbar
sailaja-adapa Aug 9, 2024
0c7ab28
Alligned Navbar
sailaja-adapa Aug 9, 2024
82ddb70
Merge branch 'main' into nav
sailaja-adapa Aug 9, 2024
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
Prev Previous commit
Merge branch 'main' into nav
@sailaja-adapa
sailaja-adapa authored Aug 9, 2024
commit 82ddb707f28e365fb74fd867cc26bbc72cc611db
126 changes: 125 additions & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
@@ -99,6 +99,67 @@ <h5>We'd Love Your Feedback!</h5>
<label for="star-3" class="star-3 fas fa-star"></label>
<label for="star-4" class="star-4 fas fa-star"></label>
<label for="star-5" class="star-5 fas fa-star"></label>
<body>
<script src="/js/global.js"></script>

<audio id="background-music" autoplay loop>
<source src="./assets/sounds/bgMusic.mp3" type="audio/mpeg" />
</audio>
<div class="settings">
<video autoplay muted class="video" loop id="myVideo">
<source src="/assets/videos/1.mp4" type="video/mp4" />
</video>
<div class="whole-background">
<nav class="navbarr">
<div class="logo">
<a href="#">Dots & Boxes ⚄</a>
</div>
<ul class="nav-links">
<li><a href="index.html"><i class="fas fa-home"></i>Home</a></li>
<li><a href="./pages/about.html"><i class="fas fa-info-circle"></i>About Us</a></li>
<li><a href="./pages/FAQs.html"><i class="fas fa-question-circle"></i>FAQs</a></li>
<li><a href="./pages/contributors.html"><i class="fas fa-users"></i>Contributors</a></li>
<li><a href="./pages/testimonials.html"><i class="fas fa-users"></i>Testimonials</a></li>
<li><a href="./pages/game.html"><i class="fas fa-gamepad"></i>Let's Go</a></li>
</ul>
<div class="hamburger">
<i class="fas fa-bars"></i>
</div>
</nav>

<button class="sticky-button" onclick="openForm()">Feedback</button>
<div class="feed-bg">
<div id="formContainer" class="form-container">
<div class="form-content">
<div class="sub">
<h5>We'd Love Your Feedback!</h5>
<span class="close-button" onclick="closeForm()">&times;</span>
</div>
<div class="wrapper">
<input type="radio" name="rate" id="star-1" />
<input type="radio" name="rate" id="star-2" />
<input type="radio" name="rate" id="star-3" />
<input type="radio" name="rate" id="star-4" />
<input type="radio" name="rate" id="star-5" />
<div class="content">
<div class="outer">
<div class="emojis">
<li class="slideImg">
<img src="./assets/images/emojis/emoji-1-bg.png" alt="emoji" />
</li>
<li>
<img src="./assets/images/emojis/emoji-2-bg.png" alt="emoji" />
</li>
<li>
<img src="./assets/images/emojis/emoji-3.png" alt="emoji" />
</li>
<li>
<img src="./assets/images/emojis/emoji-4-bg.png" alt="emoji" />
</li>
<li>
<img src="./assets/images/emojis/emoji-5-bg.png" alt="emoji" />
</li>

</div>
</div>
<div class="stars">
@@ -146,6 +207,69 @@ <h5>We'd Love Your Feedback!</h5>
<h3>Thank You!</h3>
<p>Your feedback has been submitted.</p>
</div>
</div>

<div class="form">
<!-- <h1 class="heading">▂ ▄ ▅ ▆ ▇ █ MAXIMISE BOXES!! █ ▇ ▆ ▅ ▄ ▂</h1> -->
<h1 class="heading">▂ ▄ █ MAXIMISE BOXES!! █ ▄ ▂</h1>
<h3 class="instructions-heading" style="text-decoration: underline">
Instructions
</h3>
<p class="instructions">
1. 🧩 Select the number of rows, columns, and players. <br />
2. 🏆 The player who has the maximum number of boxes on the board is
the winner. <br />
3. 🔄 Players will switch after every turn. But the player who fills
the last box will get one extra chance consecutively. 🎉 <br />
</p>

<a href="./pages/howtoplay.html" class="button">Read Detailed Instructions</a>
</div>
<div class="form">
<div class="right-background">
<div class="form-item">
<label for="theme-select" style="text-decoration: underline">Select Theme:</label>
<select id="theme-select">
<option value="1">Default</option>
<option value="2">Theme 1</option>
<option value="3">Theme 2</option>
</select>
</div>
<div class="form-item">
<label for="difficulty">Select Difficulty:</label>
<div class="difficulty">
<button class="d-type active easy">Easy</button>
<button class="d-type">Normal</button>
<button class="d-type">Hard</button>
<button class="d-type">Expert</button>
</div>
</div>

<div class="form-item">
<label for="players-count">Players : <span class="details">(between 2 and 6)</span></label>
<input type="number" id="players-count" min="2" max="6" value="2" />
<span class="player"></span>
</div>

<div class="button-container">
<a href="./pages/game.html" class="start-btn button1" id="start-btn" aria-label="START">
START
</a>
<button class="reset-btn button1" id="reset-btn">RESET</button>
<button id="music-toggle" onclick="toggleMusic()">
Music Off
</button>
</div>
</div>
</div>

<div class="author">
<div class="fotbar">
<a href="./pages/howtoplay.html"><i class="fas fa-gamepad"></i> HowToPlay?</a>
<a href="./pages/termsofservice.html"><i class="fas fa-file-contract"></i> TermsOfService</a>
<a href="./pages/privacypolicy.html"><i class="fas fa-user-shield"></i> PrivacyPolicy</a>
<a href="./pages/licensing.html"><i class="fas fa-copyright"></i> Licensing</a>
</div>
<div id="copyright">
&copy;
<script>
@@ -166,7 +290,7 @@ <h3>Thank You!</h3>
</div>
</div>

</div>

</div>
<div class="author">
<div class="fotbar">
7 changes: 7 additions & 0 deletions styles/index.style.css
View file
Original file line number Diff line number Diff line change
@@ -589,6 +589,7 @@ form {
box-sizing: border-box;
}


body {
font-family: Arial, sans-serif;
}
@@ -651,6 +652,12 @@ footer {
flex-direction: column;
gap: 10px;
}
.footer span {
font-size: 18px;
font-weight: 600;
color: #eeeeee;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
text-shadow: 1px 1px 2px rgb(48, 158, 209), 0 0 1em rgb(7, 0, 109), 0 0 0.4em rgb(7, 0, 109);
}

input[type="radio"] {
You are viewing a condensed version of this merge commit. You can view the full changes here.