update 6/5

This commit is contained in:
2025-05-06 13:51:24 +07:00
parent d02a1aa1c7
commit fc94c6fd1a
10 changed files with 754 additions and 146 deletions

View File

@@ -463,7 +463,7 @@
<div class="btn border-t-[1px] border-[#E4E4E4] pt-[10px] mt-[20px]">
<p class="text-center mt-[10px]">Đánh giá của bạn về sản phẩm</p>
<a href="javascript:void(0)"
<a href="javascript:void(0)" onclick="showReview()"
class="block mt-[10px] h-[40px] leading-[40px] text-center text-white bg-[#FF7A00] rounded-[4px]">Gửi
đánh giá của bạn về sản phẩm</a>
</div>
@@ -1559,18 +1559,18 @@
</div>
</div>
<div id="backgroundPopup" class="active"></div>
<div
class="box-form-review fixed left-[50%] top-[50%] w-[860px] bg-white rounded-[12px] translate-x-[-50%] translate-y-[-50%] z-[999] p-[20px]">
<div id="backgroundPopup" onclick="closeReview()"></div>
<div class="box-form-review hidden fixed left-[50%] top-[50%] w-[860px] bg-white rounded-[12px] translate-x-[-50%] translate-y-[-50%] z-[999] p-[20px]"
id="js-box-review">
<div class="title relative pb-[15px] border-b-[1px] border-[#E4E4E4]">
<b class="text-center text-xl block">Đánh giá sản phẩm</b>
<a href="javascript:void(0)" id="js-close-review"
<a href="javascript:void(0)" onclick="closeReview()" id="js-close-review"
class="absolute right-0 top-0 text-[#808080] text-[22px] ">x</a>
</div>
<div class="info-form-review w-[500px] mx-[auto]">
<a href="" class="block m-[10px_auto] p-[10px] rounded-[4px] border-[#B1B1B1]">
<img src="./src/assets/images/small-product-detail.png" width="100%" height="100%"
class="block w-[140px] h-[140px] m-[0_auto]" alt="">
class="block w-[100px] h-[100px] m-[0_auto]" alt="">
</a>
<a href="" class="text-center block mb-[10px]">Laptop Gaming Asus TUF FX505GE-BQ037T Core
i7-8750H/Win10(15.6" FHD) -
@@ -1578,23 +1578,48 @@
Chính
Hãng</a>
<div class="star-rating">
<input type="radio" id="star1" name="rating" value="1">
<label for="star1"></label>
<div class="flex justify-center">
<div class="rating-selection">
<input type="radio" class="rating-input" id="star5" name="rating" value="5">
<label for="star5" class="rating-star"></label>
<input type="radio" id="star2" name="rating" value="2">
<label for="star2"></label>
<input type="radio" class="rating-input" id="star4" name="rating" value="4">
<label for="star4" class="rating-star"></label>
<input type="radio" id="star3" name="rating" value="3">
<label for="star3"></label>
<input type="radio" class="rating-input" id="star3" name="rating" value="3">
<label for="star3" class="rating-star"></label>
<input type="radio" id="star4" name="rating" value="4">
<label for="star4"></label>
<input type="radio" class="rating-input" id="star2" name="rating" value="2">
<label for="star2" class="rating-star"></label>
<input type="radio" id="star5" name="rating" value="5">
<label for="star5"></label>
<input type="radio" class="rating-input" id="star1" name="rating" value="1">
<label for="star1" class="rating-star"></label>
</div>
</div>
<div class="clearfix"></div>
</div>
<div class="form-input mt-[20px]">
<input type="text" name="title" placeholder="Mời bạn nhập tiêu đề..." />
<div class="note-error"></div>
</div>
<div class="form-input mt-[10px]">
<textarea name="content" placeholder="Mời bạn chia sẻ cảm nhận..." id=""></textarea>
<div class="note-error"></div>
</div>
<input id="js-file-upload-id" type="hidden" value="">
<div id="js-container-selector" class="mt-[10px] flex items-center">
<a href="javascript:void(0)" class="flex items-center" id="js-select-file">
<i class="icon_2025 upload_image"></i>
<span class="text-[#1877F2] ml-[5px]">Gửi ảnh thực tế</span>
<span class="px-[5px]">(tối đa 3 ảnh)</span>
</a>
</div>
<button type="submit"
class="mt-[15px] w-full h-[45px] bg-[#C8B7FF] rounded-[4px] text-white leading-[45px] hover:bg-[var(--color-global)]">Gửi
đánh
giá</button>
</div>
@@ -1681,7 +1706,15 @@
</script>
<script>
function showReview() {
$("#js-box-review").removeClass('hidden');
$("#backgroundPopup").addClass('active');
}
function closeReview() {
$("#js-box-review").addClass('hidden');
$("#backgroundPopup").removeClass('active');
}
</script>
</body>