Fixed transparency and overlap issues: HEADER: ✅ Changed from primary-600 to green-600 (solid) ✅ White background with shadow-lg ✅ Solid green top bar ✅ Fixed overlap - pages have pt-32 padding FOOTER: ✅ Dark theme (bg-gray-900) ✅ Solid dark background ✅ Green accents (text-green-400) ✅ Better contrast with white text COLOR SCHEME: - Header: Green top bar (#22c55e) + White nav - Footer: Dark gray (#111827) + Green accents - No transparency, all solid colors - Consistent green/gray industrial theme Build: 11 pages ✅
25 lines
17 KiB
HTML
25 lines
17 KiB
HTML
<!DOCTYPE html><html lang="th"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="generator" content="Astro v5.18.0"><meta name="description" content="เรียนรู้เพิ่มเติมเกี่ยวกับดีลพลัสเทค ผู้เชี่ยวชาญด้านวัสดุท่อและอุปกรณ์ระบบท่อ"><!-- Favicon --><link rel="icon" type="image/svg+xml" href="/favicon.svg"><link rel="alternate icon" href="/favicon.ico" sizes="any"><link rel="apple-touch-icon" href="/favicon.svg"><!-- Google Fonts: Kanit for Thai --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&display=swap" rel="stylesheet"><!-- SEO --><meta property="og:title" content="เกี่ยวกับเรา"><meta property="og:description" content="เรียนรู้เพิ่มเติมเกี่ยวกับดีลพลัสเทค ผู้เชี่ยวชาญด้านวัสดุท่อและอุปกรณ์ระบบท่อ"><meta property="og:image" content="/og-image.jpg"><meta property="og:type" content="website"><meta name="twitter:card" content="summary_large_image"><title>เกี่ยวกับเรา | ดีล พลัส เทค</title><link rel="stylesheet" href="/_astro/index.C5qR9YjN.css"></head> <body class="flex flex-col min-h-screen"> <header class="fixed top-0 left-0 right-0 z-50 bg-white shadow-lg"> <!-- Top Bar - Green --> <div class="bg-green-600 py-2"> <div class="container mx-auto px-4 flex justify-between items-center text-sm"> <div class="flex items-center gap-6 text-white"> <a href="tel:090-555-1415" class="flex items-center gap-2 hover:text-green-100 transition-colors"> <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"></path> </svg> 090-555-1415 </a> <a href="mailto:info@dealplustech.co.th" class="flex items-center gap-2 hover:text-green-100 transition-colors"> <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path> </svg> info@dealplustech.co.th </a> </div> <div class="hidden md:flex items-center gap-4"> <a href="https://line.me/ti/p/@dealplustech" class="flex items-center gap-1 text-white hover:text-green-100 transition-colors"> <svg class="w-4 h-4" viewBox="0 0 24 24" fill="currentColor"> <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"></path> </svg>
|
|
LINE
|
|
</a> <a href="https://facebook.com/dealplustech" target="_blank" rel="noopener noreferrer" class="text-white hover:text-green-100 transition-colors"> <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"> <path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"></path> </svg> </a> </div> </div> </div> <!-- Main Navigation - White with Logo --> <nav class="bg-white"> <div class="container mx-auto px-4"> <div class="flex items-center justify-between h-16"> <!-- Logo --> <a href="/" class="flex items-center"> <img src="/images/2021/02/13523630950840.png" alt="Deal Plus Tech" class="h-10 w-auto"> </a> <!-- Desktop Navigation --> <div class="hidden md:flex items-center gap-8"> <a href="/" class="text-gray-700 hover:text-green-600 font-medium transition-colors"> หน้าแรก </a><a href="/about-us/" class="text-gray-700 hover:text-green-600 font-medium transition-colors"> เกี่ยวกับเรา </a><a href="/product/" class="text-gray-700 hover:text-green-600 font-medium transition-colors"> สินค้า </a><a href="/services/" class="text-gray-700 hover:text-green-600 font-medium transition-colors"> บริการ </a><a href="/portfolio/" class="text-gray-700 hover:text-green-600 font-medium transition-colors"> ผลงาน </a> </div> <!-- CTA Button --> <div class="hidden md:block"> <a href="/contact-us/" class="btn-primary">
|
|
ติดต่อเรา
|
|
</a> </div> </div> </div> </nav> </header> <main class="pt-32 pb-16"> <div class="container mx-auto px-4"> <!-- Hero --> <div class="relative h-[400px] -mt-32 mb-12 rounded-b-3xl overflow-hidden"> <div class="absolute inset-0 bg-gradient-to-r from-gray-900 via-gray-800 to-gray-900"></div> <div class="absolute inset-0 flex items-center justify-center"> <div class="text-center"> <h1 class="text-4xl md:text-5xl font-bold text-white mb-4">
|
|
เกี่ยวกับ<span class="text-green-400">Deal Plus Tech</span> </h1> <p class="text-xl text-gray-200">
|
|
ผู้เชี่ยวชาญด้านวัสดุท่อและอุปกรณ์ระบบท่อ
|
|
</p> </div> </div> </div> </div> </main> <footer class="bg-gray-900 text-white"> <!-- Main Footer --> <div class="container mx-auto px-4 py-12"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> <!-- Company Info --> <div> <img src="/images/2021/02/13523630950840.png" alt="Deal Plus Tech" class="h-10 w-auto mb-4 bg-white p-2 rounded"> <p class="text-gray-300 text-sm mb-4"> บริษัท ดีล พลัส เทค จำกัด เราเป็นผู้เชียวชาญด้านระบบน้ำ ให้คำแนะนำและจำหน่าย ท่อ PPR ตราช้าง ท่อพีพีอาร์ ท่อ PPR ท่อ HDPE Thai PPR รั้วตาข่าย คุณภาพสูง ราคาถูก </p> <div class="flex gap-3"> <a href="https://facebook.com/dealplustech" target="_blank" rel="noopener noreferrer" class="w-10 h-10 bg-gray-700 rounded-lg flex items-center justify-center text-gray-300 hover:bg-green-600 hover:text-white transition-colors" aria-label="Facebook"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"></path> </svg> </a> <a href="https://line.me/ti/p/@dealplustech" target="_blank" rel="noopener noreferrer" class="w-10 h-10 bg-gray-700 rounded-lg flex items-center justify-center text-gray-300 hover:bg-green-600 hover:text-white transition-colors" aria-label="LINE"> <svg class="w-5 h-5" viewBox="0 0 24 24" fill="currentColor"> <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"></path> </svg> </a> </div> </div> <!-- Quick Links --> <div> <h3 class="text-lg font-bold mb-4 text-green-400">ลิงก์ด่วน</h3> <ul class="space-y-2"> <li> <a href="/" class="text-gray-300 hover:text-green-400 transition-colors"> หน้าแรก </a> </li><li> <a href="/about-us/" class="text-gray-300 hover:text-green-400 transition-colors"> เกี่ยวกับเรา </a> </li><li> <a href="/product/" class="text-gray-300 hover:text-green-400 transition-colors"> สินค้า </a> </li><li> <a href="/services/" class="text-gray-300 hover:text-green-400 transition-colors"> บริการ </a> </li><li> <a href="/portfolio/" class="text-gray-300 hover:text-green-400 transition-colors"> ผลงาน </a> </li> <li> <a href="/privacy-policy/" class="text-gray-300 hover:text-green-400 transition-colors">
|
|
นโยบายความเป็นส่วนตัว
|
|
</a> </li> <li> <a href="/terms-and-conditions/" class="text-gray-300 hover:text-green-400 transition-colors">
|
|
ข้อกำหนดและเงื่อนไข
|
|
</a> </li> <li> <a href="/cookie-policy/" class="text-gray-300 hover:text-green-400 transition-colors">
|
|
นโยบายคุกกี้
|
|
</a> </li> </ul> </div> <!-- Contact Info --> <div> <h3 class="text-lg font-bold mb-4 text-green-400">ติดต่อเรา</h3> <ul class="space-y-3"> <li class="flex items-start gap-3"> <svg class="w-5 h-5 text-green-500 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path> </svg> <span class="text-gray-300 text-sm">บริษัท ดีล พลัส เทค จำกัด 9/70 ซอยนครลุง 17 แขวงบางไผ่ เขตบางแค กทม. 10160</span> </li> <li class="flex items-center gap-3"> <svg class="w-5 h-5 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"></path> </svg> <a href="tel:090-555-1415" class="text-gray-300 hover:text-green-400 text-sm"> 090-555-1415 </a> </li> <li class="flex items-center gap-3"> <svg class="w-5 h-5 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path> </svg> <a href="mailto:info@dealplustech.co.th" class="text-gray-300 hover:text-green-400 text-sm"> info@dealplustech.co.th </a> </li> </ul> </div> <!-- Business Hours --> <div> <h3 class="text-lg font-bold mb-4 text-green-400">เวลาทำการ</h3> <ul class="space-y-2"> <li class="flex justify-between text-sm"> <span class="text-gray-300">จันทร์ - ศุกร์</span> <span class="text-white font-medium"> 08:30 - 17:30 </span> </li><li class="flex justify-between text-sm"> <span class="text-gray-300">เสาร์</span> <span class="text-white font-medium"> 08:30 - 12:00 </span> </li><li class="flex justify-between text-sm"> <span class="text-gray-300">อาทิตย์</span> <span class="text-red-400"> ปิดทำการ </span> </li> </ul> </div> </div> </div> <!-- Bottom Bar --> <div class="border-t border-gray-700"> <div class="container mx-auto px-4 py-4"> <p class="text-center text-gray-400 text-sm">
|
|
© 2026 Deal Plus Tech. สงวนลิขสิทธิ์.
|
|
</p> </div> </div> </footer> <div class="fixed bottom-6 right-6 z-40 flex flex-col gap-3"> <!-- LINE --> <a href="https://line.me/ti/p/@dealplustech" target="_blank" rel="noopener noreferrer" class="w-14 h-14 bg-[#00B900] rounded-full flex items-center justify-center shadow-lg hover:scale-110 transition-transform" aria-label="ติดต่อผ่าน LINE"> <svg class="w-7 h-7 text-white" viewBox="0 0 24 24" fill="currentColor"> <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"></path> </svg> </a> <!-- Phone --> <a href="tel:090-555-1415" class="w-14 h-14 bg-primary-600 rounded-full flex items-center justify-center shadow-lg hover:scale-110 transition-transform" aria-label="โทรหาเรา"> <svg class="w-7 h-7 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"></path> </svg> </a> </div> <!-- Cookie Consent Banner --> <script type="module">const t=JSON.parse(localStorage.getItem("consent-preferences")||"null");if(!t){const e=document.createElement("div");e.id="cookie-banner",e.className="fixed bottom-0 left-0 right-0 bg-secondary-900 text-white p-6 z-50 shadow-lg",e.innerHTML=`
|
|
<div class="container mx-auto max-w-4xl">
|
|
<p class="text-lg mb-4">เราใช้คุกกี้เพื่อปรับปรุงประสบการณ์การใช้งานเว็บไซต์ โดยคลิกยอมรับเพื่อใช้งานคุกกี้ทุกประเภท หรือคลิกปรับแต่งเพื่อเลือกคุกกี้ที่ต้องการ</p>
|
|
<div class="flex flex-wrap gap-3">
|
|
<button id="accept-all" class="px-6 py-2 bg-primary-600 text-white font-semibold rounded-md hover:bg-primary-700">ยอมรับ</button>
|
|
<button id="reject-all" class="px-6 py-2 bg-secondary-700 text-white font-semibold rounded-md hover:bg-secondary-600">ปฏิเสธ</button>
|
|
<button id="customize" class="px-6 py-2 border border-white text-white font-semibold rounded-md hover:bg-white hover:text-secondary-900">ปรับแต่ง</button>
|
|
</div>
|
|
</div>
|
|
`,document.body.appendChild(e),document.getElementById("accept-all")?.addEventListener("click",()=>{localStorage.setItem("consent-preferences",JSON.stringify({essential:!0,analytics:!0,marketing:!0,timestamp:new Date().toISOString()})),e.remove()}),document.getElementById("reject-all")?.addEventListener("click",()=>{localStorage.setItem("consent-preferences",JSON.stringify({essential:!0,analytics:!1,marketing:!1,timestamp:new Date().toISOString()})),e.remove()}),document.getElementById("customize")?.addEventListener("click",()=>{localStorage.setItem("consent-preferences",JSON.stringify({essential:!0,analytics:!1,marketing:!1,timestamp:new Date().toISOString()})),e.remove()})}</script> </body> </html> |