Enhance UX/UI proportions and unified design system across all devices

This commit is contained in:
pongpon pitisuk
2026-09-12 15:59:22 +07:00
parent f5a302bf9f
commit fb5b4b4c95
8 changed files with 159 additions and 46 deletions
+13 -13
View File
@@ -88,24 +88,24 @@ function renderTeacherSurveys() {
</div>
</div>
</div>
<div class="flex flex-wrap lg:flex-nowrap gap-1 items-center flex-shrink-0 w-full lg:w-auto overflow-x-auto pb-1 lg:pb-0">
<button onclick="teacherEditSurvey(${s.id})" class="bg-amber-400 hover:bg-amber-500 text-gray-900 border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="แก้ไขแบบสอบถาม">
✏️ แก้ไข
<div class="flex flex-wrap lg:flex-nowrap gap-1.5 items-center flex-shrink-0 w-full lg:w-auto overflow-x-auto pb-1 lg:pb-0">
<button onclick="teacherEditSurvey(${s.id})" class="btn-action btn-action-edit" title="แก้ไขแบบสอบถาม">
<i class="fas fa-edit"></i> แก้ไข
</button>
<button onclick="teacherDuplicateSurvey(${s.id})" class="bg-blue-600 hover:bg-blue-700 text-white border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="คัดลอกแบบสอบถาม">
📑 คัดลอก
<button onclick="teacherDuplicateSurvey(${s.id})" class="btn-action btn-action-copy" title="คัดลอกแบบสอบถาม">
<i class="fas fa-copy"></i> คัดลอก
</button>
<button onclick="teacherGenerateLink(${s.id})" class="bg-blue-900 hover:bg-blue-950 text-white border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="ลิงก์และ QR Code">
🔗 ลิงก์
<button onclick="teacherGenerateLink(${s.id})" class="btn-action btn-action-link" title="ลิงก์และ QR Code">
<i class="fas fa-link"></i> ลิงก์
</button>
<button onclick="showImportResponsesModal(${s.id}, '${escapeHtml(s.title)}')" class="bg-emerald-600 hover:bg-emerald-700 text-white border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="นำเข้าคำตอบจาก CSV">
📥 นำเข้าคำตอบ
<button onclick="showImportResponsesModal(${s.id}, '${escapeHtml(s.title)}')" class="btn-action btn-action-import" title="นำเข้าคำตอบจาก CSV">
<i class="fas fa-file-import"></i> นำเข้า
</button>
<button onclick="teacherViewStats(${s.id})" class="bg-indigo-600 hover:bg-indigo-700 text-white border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="ผลสถิติ">
📊 สถิติ
<button onclick="teacherViewStats(${s.id})" class="btn-action btn-action-stats" title="ผลสถิติ">
<i class="fas fa-chart-pie"></i> สถิติ
</button>
<button onclick="teacherDeleteSurvey(${s.id}, '${escapeHtml(s.title)}')" class="bg-rose-600 hover:bg-rose-700 text-white border border-slate-800 px-2 py-1 rounded text-xs font-bold flex items-center gap-1 shadow-sm transition-all whitespace-nowrap active:scale-95" title="ลบแบบสอบถาม">
🗑️ ลบ
<button onclick="teacherDeleteSurvey(${s.id}, '${escapeHtml(s.title)}')" class="btn-action btn-action-delete" title="ลบแบบสอบถาม">
<i class="fas fa-trash-alt"></i> ลบ
</button>
</div>
</div>