| Şuanki Dizin: /home/wwwdreamtechnolo/.trash/ |
| Şuanki Dosya : /home/wwwdreamtechnolo/.trash/form.html |
<doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Star Rating Form</title>
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes, minimum-scale=1.0, maximum-scale=1.0"> -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="form.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" >
</head>
<body>
<div class="main">
<form class="parent">
<div class="child1">
<h2>Luciano Guest House</h2>
<div class="child1-1">
<span class="fa fa-star" data-star="1" style="font-size: 25px;"></span>
<span class="fa fa-star" data-star="2" style="font-size: 25px;"></span>
<span class="fa fa-star" data-star="3" style="font-size: 25px;"></span>
<span class="fa fa-star" data-star="4" style="font-size: 25px;"></span>
<span class="fa fa-star" data-star="5" style="font-size: 25px;"></span>
</div>
<div class="child1-2">
<p>Tell Us About Your Experience With Luciano Guest House</p>
</div>
</div>
<div class="child2">
<div class="child2-1">
<label for="">Your Name</label>
<input type="text" placeholder="Enter Your Name">
</div>
<div class="child2-1">
<label for="">Your Contact Number</label>
<input type="text" placeholder="Enter Your Contact Number">
</div>
<div class="child2-3">
<textarea name="Enter Your Thoughts" placeholder="Enter Your Thoughts"></textarea>
</div>
</div>
<div class="child3">
<button type="submit">Submit</button>
</div>
</form>
<div class="child4">
<p style="font-size: 13px; color: #686969;">Copyright © 2022 PulseCoder All rights reserved.
<br>
</p>
<div class="social-icons">
<a href="https://www.facebook.com"><i class="fab fa-facebook" style="font-size: 20px;"></i></a>
<a href="https://www.twitter.com"><i class="fab fa-twitter" style="font-size: 20px;"></i></a>
</div>
<p style="font-size: 13px; color: #686969;">This is an Automated QR-Code. If Any Problem Persists Please Mail Us: <a href="mailto:ansh@pulsecoder.in" style="color:#F77E21">ansh@pulsecoder.in</a></p>
</div>
</div>
<!-- Include FontAwesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<!-- Include jQuery (for simplicity) -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- Custom JavaScript -->
<script>
$(document).ready(function() {
$('.fa-star').on('click', function() {
var selectedStar = $(this).data('star');
$('.fa-star').each(function() {
if ($(this).data('star') <= selectedStar) {
$(this).addClass('checked');
} else {
$(this).removeClass('checked');
}
});
});
});
</script>
<!-- Custom CSS -->
<style>
.fa-star {
color: gray;
cursor: pointer;
}
.fa-star.checked {
color: gold;
}
</style>
</body>
</html>
Linux 65-254-81-4.cprapid.com 5.14.0-284.11.1.el9_2.x86_64 #1 SMP PREEMPT_DYNAMIC Tue May 9 05:49:00 EDT 2023 x86_64
Apache
65.254.81.4