Skip to content

Commit

Permalink
Merge pull request #307 from shriyadindi/star
Browse files Browse the repository at this point in the history
Created a new PR for the addition of star rating to the feedback section.
  • Loading branch information
multiverseweb authored Nov 6, 2024
2 parents 4f61601 + 6bccb0b commit 2699817
Show file tree
Hide file tree
Showing 2 changed files with 61 additions and 5 deletions.
37 changes: 32 additions & 5 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,10 @@
<div class="scrollBar" id="progress_bar"></div> <!--PROGRESS BAR-->
<a href="website/pages/login.html">
<button class="loginSignupbtn">
<span class="button-text">Login</span>
<img src="website/web_images/user.png" alt="User Icon" class="user-icon">
<span class="button-text">Login</span>
<img src="website/web_images/user.png" alt="User Icon" class="user-icon">
</button>
</a>
</a>
</nav>

<button class="burger" id="burger" onclick="show()"></button>
Expand Down Expand Up @@ -82,7 +82,8 @@
</td>
</tr>
<tr>
<td><a href="website/pages/codeOfconduct.html" class="table_link" target="_blank">Code of Conduct</a></td>
<td><a href="website/pages/codeOfconduct.html" class="table_link" target="_blank">Code of Conduct</a>
</td>
</tr>
<tr>
<td><a href="website/pages/license.html" class="table_link">License</a></td>
Expand Down Expand Up @@ -254,6 +255,18 @@
<input type="text" name="Name" placeholder="Your Name" required>
<input type="email" name="Email" placeholder="Your Email ID" required>
<input name="Message" placeholder="Your Message" required>
<div class="star-rating" style="text-align: center; margin: 10px;">
<input type="radio" id="star5" name="rating" value="5" />
<label for="star5" title="5 star">&#9733;</label>
<input type="radio" id="star4" name="rating" value="4" />
<label for="star4" title="4 stars">&#9733;</label>
<input type="radio" id="star3" name="rating" value="3" />
<label for="star3" title="3 stars">&#9733;</label>
<input type="radio" id="star2" name="rating" value="2" />
<label for="star2" title="2 stars">&#9733;</label>
<input type="radio" id="star1" name="rating" value="1" />
<label for="star1" title="1 stars">&#9733;</label>
</div>
<input type="submit" value="Send" id="send">
</form>
</footer>
Expand All @@ -274,6 +287,19 @@
<a href="https://www.linkedin.com/in/tejascodes/"> LinkedIn</a>
</div>
<script>
function validateFeedback() {
var feedback = document.forms["CodeIt Reviews"]["Feedback"];
checkFeedbackLength(feedback);
return feedback.value.length >= 10;
}
function validateForm() {
const rating = document.querySelector('input[name="rating"]:checked');
if (!rating) {
alert("Please select a rating.");
return false; // Prevent form submission
}
return true; // Allow form submission
}
// Delay the execution by 3 seconds
setTimeout(function () {
window.embeddedChatbotConfig = {
Expand All @@ -295,7 +321,8 @@
<p class="tejas_credits" style="color:rgb(187, 187, 187); margin-top: 20px;"> Designed & Developed by Tejas
Gupta</p>
<br>
<p style="color:rgb(177, 177, 177);">&copy; <span id="copyright">32949832</span> <a href=".github/404.html">Tejas Gupta</a></p>
<p style="color:rgb(177, 177, 177);">&copy; <span id="copyright">32949832</span> <a
href=".github/404.html">Tejas Gupta</a></p>
</div>
<div class="end_line"></div>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
Expand Down
29 changes: 29 additions & 0 deletions website/styles/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,35 @@ body {
transition-duration: 0.2s;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.star-rating {
display: flex;
justify-content: center;
direction: rtl; /* This reverses the order of the stars */
}

.star-rating input {
display: none;
/* Hide the radio buttons */
}

.star-rating label {
font-size: 2em;
/* Star size */
color: grey;
/* Default star color */
cursor: pointer;
}

.star-rating input:checked~label {
color: gold;
/* Gold color for selected stars */
}

.star-rating label:hover,
.star-rating label:hover~label {
color: gold;
/* Change color on hover */
}

input {
color: white;
Expand Down

0 comments on commit 2699817

Please sign in to comment.