From 546d4b6f95a67d61fbb92c52f6b46643c4493521 Mon Sep 17 00:00:00 2001
From: Tieptk <tieptk@hurasoft.com>
Date: Thu, 4 Dec 2025 14:13:37 +0700
Subject: [PATCH] update

---
 assets/script/style_hura.css   | 34 --------------
 template/customer/comment.html | 82 ++++++++++++++--------------------
 template/customer/review.html  | 48 +++++++++-----------
 3 files changed, 54 insertions(+), 110 deletions(-)

diff --git a/assets/script/style_hura.css b/assets/script/style_hura.css
index 054ef7f..0eddd33 100644
--- a/assets/script/style_hura.css
+++ b/assets/script/style_hura.css
@@ -1,33 +1,7 @@
-.line-clamp-1 {
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  display: -webkit-box;
-  overflow: hidden;
-}
-.line-clamp-2 {
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  display: -webkit-box;
-  overflow: hidden;
-}
-.line-clamp-3 {
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  display: -webkit-box;
-  overflow: hidden;
-}
-.line-clamp-4 {
-  -webkit-line-clamp: 4;
-  -webkit-box-orient: vertical;
-  display: -webkit-box;
-  overflow: hidden;
-}
-
 .btn-dash {
   border-style: dashed;
   border-color: gray;
 }
-
 .btn-dash:hover {
   border-color: var(--color-primary);
   color: #fff;
@@ -68,16 +42,9 @@
 .text-gray {
   color: #6b7280;
 }
-
-.absolute {
-  position: absolute;
-}
 .right-2 {
   right: 0.5rem;
 }
-.top-2 {
-  top: 0.5rem;
-}
 .max-h-400 {
   max-height: 400px;
 }
@@ -93,7 +60,6 @@
 .max-w-3xl {
   max-width: 48rem;
 }
-
 .menu-form a {
   border-top: 0;
 }
diff --git a/template/customer/comment.html b/template/customer/comment.html
index c96aad9..d963d5d 100644
--- a/template/customer/comment.html
+++ b/template/customer/comment.html
@@ -91,59 +91,46 @@
 
 
         <dialog id="js_list_reply_comment" class="modal">
-            <div class="modal-box w-[852px] max-w-5xl p-[15px]">
+            <div class="modal-box w-[75%] p-3">
                 <form method="dialog">
                     <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
                 </form>
-                <h2 class="text-[18px] uppercase font-bold border-b-[1px] pb-[5px]">Chi tiết phản hồi</h2>
+                <h2 class="text-md uppercase font-bold mt-2">Chi tiết phản hồi</h2>
 
-                <div class="info-comment mt-[10px]">
-                    <b class="text-[16px] mb-[10px] block">Thông tin</b>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Khách
-                            hàng</p>
-                        <b class="ml-[5px]">Hura test</b>
+                <div class="info-comment mt-2">
+                    <b class="text-base mb-2 block">Thông tin</b>
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Khách hàng:</p>
+                        <b class="col-span-3">Hura test</b>
                     </div>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Email</p>
-                        <p class="ml-[5px]">test@mail.com</p>
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Email:</p>
+                        <p class="col-span-3">test@mail.com</p>
                     </div>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Tiêu đề</p>
-                        <p class="ml-[5px]">Màn Hình Máy Tính LG 27UL850 27Inch 4K IPS</p>
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Tiêu đề:</p>
+                        <p class="col-span-3">Màn Hình Máy Tính LG 27UL850 27Inch 4K IPS</p>
                     </div>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Nội dung</p>
-                        <p class="ml-[5px]">test reply</p>
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Nội dung:</p>
+                        <p class="col-span-3">test reply</p>
                     </div>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Thời gian</p>
-                        <p class="ml-[5px]">20-04-2023, 1:36 pm</p>
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Thời gian:</p>
+                        <p class="col-span-3">20-04-2023, 1:36 pm</p>
                     </div>
-                    <div class="flex items-center mb-[5px]">
-                        <p
-                            class="w-[120px] relative before:absolute before:content-[':'] before:right-[0] before:top-[0] before:text-[14px]">
-                            Liên quan</p>
-                        <p class="ml-[5px]">[product] <a href="" class="text-[#0041E8]">Màn Hình Máy Tính LG 27UL850
+                    <div class="grid grid-cols-4 items-center gap-2 mt-2">
+                        <p class="">Liên quan:</p>
+                        <p class="col-span-3">[product] <a href="" class="text-primary">Màn Hình Máy Tính LG 27UL850
                                 27Inch 4K IPS</a></p>
                     </div>
                 </div>
 
-                <div class="info-reply mt-[20px]">
+                <div class="info-reply mt-5 rounded-sm shadow">
                     <b class="text-[16px] block mb-[10px]">Phản hồi <span>2</span></b>
-                    <table class="list-info-reply">
+                    <table class="table table-zebra w-full">
                         <thead>
-                            <tr>
+                            <tr class="bg-base-200 text-black font-bold">
                                 <th>STT</th>
                                 <th>Thời gian</th>
                                 <th>Tác giả</th>
@@ -156,25 +143,22 @@
                                 <td>1</td>
                                 <td>09-08-2023, 11:24 am</td>
                                 <td>
-                                    <div class="flex items-center">
+                                    <div class="flex items-center gap-2">
                                         <b>Nguyễn An</b>
-                                        <p
-                                            class="p-[3px_4px] rounded-[2px] bg-[#FFCECE] ml-[5px] font-[500] text-[10px]">
-                                            Quản trị
+                                        <p class="badge badge-sm badge-primary badge-soft">Quản
+                                            trị
                                             viên</p>
                                     </div>
                                     <p>annv@hurasoft.com</p>
                                 </td>
                                 <td>em sẽ tư vấn cụ thể cho chị nhé ạ</td>
                                 <td>
-                                    <div class="flex items-center">
-                                        <a href=""
-                                            class="w-[30px] h-[30px] border-[1px] border-[#ECECEC] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                            <i class="fa-solid fa-ban text-[#9E9E9E]"></i>
+                                    <div class="flex items-center gap-3">
+                                        <a href="" class="btn btn-soft btn-xs btn-square btn-error">
+                                            <i class="iconify lucide--ban"></i>
                                         </a>
-                                        <a href=""
-                                            class="w-[30px] h-[30px] border-[1px] border-[#ECECEC] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                            <i class="icons icon-remove text-[#9E9E9E]"></i>
+                                        <a href="" class="btn btn-soft btn-xs btn-square btn-error">
+                                            <i class="iconify lucide-trash-2"></i>
                                         </a>
                                     </div>
                                 </td>
diff --git a/template/customer/review.html b/template/customer/review.html
index 7cb3387..944a981 100644
--- a/template/customer/review.html
+++ b/template/customer/review.html
@@ -21,16 +21,15 @@
 
         <div class="list-filter flex items-center justify-between mt-5 gap-3">
             <p>Tổng số: <b>1.996</b></p>
-            <select name="" id=""
-                class="w-[180px] h-[35px] min-h-[35px] select select-bordered rounded-[4px] shadow-[0_2px_4px_0_rgba(0,0,0,0.12)]">
+            <select name="" id="" class="select select-bordered rounded-sm shadow w-48">
                 <option value="">Chọn bộ lọc</option>
             </select>
         </div>
 
-        <div class="overflow-x-auto sm:whitespace-nowrap">
+        <div class="overflow-x-auto sm:whitespace-nowrap mt-5 border-base-200 shadow rounded-sm">
             <table class="table">
-                <thead class="bg-[#F6F6F6] text-[#000] text-[14px]">
-                    <tr>
+                <thead>
+                    <tr class="bg-base-200 text-black font-bold">
                         <th>STT</th>
                         <th>Phản hồi</th>
                         <th>Thời gian</th>
@@ -46,47 +45,42 @@
                         <td>1</td>
                         <td>09-08-2023, 11:24 am</td>
                         <td>
-                            <div class="flex items-center">
+                            <div class="flex items-center gap-2">
                                 <b>Nguyễn An</b>
-                                <p class="p-[3px_4px] rounded-[2px] bg-[#FFCECE] ml-[5px] font-[500] text-[10px]">Quản
+                                <p class="badge badge-sm badge-primary badge-soft">Quản
                                     trị
                                     viên</p>
                             </div>
                             <p>annv@hurasoft.com</p>
                         </td>
                         <td>
-                            <a href="" class="text-[#0041E8]">Màn Hình AOC 24B1XHS 23.8 inch Full HD</a>
+                            <a href="" class="text-primary">Màn Hình AOC 24B1XHS 23.8 inch Full HD</a>
                         </td>
                         <td>
                             test reply
                         </td>
                         <td>
-                            <div class="flex items-center">
+                            <div class="flex items-center gap-3">
                                 <a href="javascript:void(0)" onclick="js_list_reply_comment.showModal()"
-                                    class="w-[32px] h-[32px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="fa-regular fa-hand-pointer text-[#0041E8]"></i>
+                                    class="btn btn-soft btn-xs btn-square btn-view">
+                                    <i class="iconify lucide--pointer"></i>
                                 </a>
-                                <a href=""
-                                    class="w-[32px] h-[32px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="icons icon-edit"></i>
+                                <a href="" class="btn btn-soft btn-xs btn-square btn-view">
+                                    <i class="iconify lucide--pencil"></i>
                                 </a>
-                                <a href=""
-                                    class="w-[32px] h-[32px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="fa-solid fa-crown text-[#0041E8]"></i>
+                                <a href="" class="btn btn-soft btn-xs btn-square btn-view">
+                                    <i class="iconify lucide--crown"></i>
                                 </a>
                             </div>
-                            <div class="flex items-center">
-                                <a href=""
-                                    class="w-[32px] h-[32px] border-[1px] border-[#0041E8] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="fa fa-plus text-[#0041E8]"></i>
+                            <div class="flex items-center mt-3 gap-3">
+                                <a href="" class="btn btn-soft btn-xs btn-square btn-view">
+                                    <i class="iconify lucide--plus"></i>
                                 </a>
-                                <a href=""
-                                    class="w-[32px] h-[32px] border-[1px] border-[#ECECEC] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="fa-solid fa-ban text-[#9E9E9E]"></i>
+                                <a href="" class="btn btn-soft btn-xs btn-square btn-error">
+                                    <i class="iconify lucide--ban"></i>
                                 </a>
-                                <a href=""
-                                    class="w-[32px] h-[32px] rounded-[4px] text-center leading-[30px] flex items-center justify-center mr-[5px] mb-[5px]">
-                                    <i class="icons icon-delete"></i>
+                                <a href="" class="btn btn-soft btn-xs btn-square btn-error">
+                                    <i class="iconify lucide--trash-2"></i>
                                 </a>
                             </div>
                         </td>