Vicky Verma• 180
@code-nick
Posted
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Frontend Mentor | Interactive rating component</title>
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png">
<link rel="stylesheet" href="style.css">
</head>
<body>
<main>
<div class="box-container">
<div class="img-container">
<img src="./images/icon-star.svg" alt="" class="star-icon">
</div>
<h1> How did we do?</h1>
<p> Please let us know how we did with your support request. All feedback is appreciated to help us improve our offering!</p>
<div class="rating" id="rating-again">
<button class="rating-btn" id="1">1</button>
<button class="rating-btn" id="2">2</button>
<button class="rating-btn" id="3">3</button>
<button class="rating-btn" id="4">4</button>
<button class="rating-btn" id="5">5</button>
</div>
<button class="Submit-btn submitBtn" id="submit-btn">SUBMIT</button>
</div>
<div class="thanks-container hidden">
<div class="thanks-you-img">
<img src="./images/illustration-thank-you.svg" alt="img">
</div>
<div class="thanks-btn">
<p class="button-selected">You Selected <span id="rate"></span> out of 5</p>
</div>
<div class="headding-thanks">
<h1>Thanks You !</h1>
</div>
<div class="paragraph-container">
<p class="paragraph-thanks">we appreciate you taking the time to give a rating.
if you ever need more support,
don't hesitate to get in touch</p>
</div>
</div>
</main>
</body>
</html>0