Initial commit: MoreminiMore redesign with Astro
This commit is contained in:
203
src/layouts/Layout.astro
Normal file
203
src/layouts/Layout.astro
Normal file
@@ -0,0 +1,203 @@
|
||||
---
|
||||
import '../styles/global.css'
|
||||
|
||||
interface Props {
|
||||
title?: string;
|
||||
description?: string;
|
||||
}
|
||||
|
||||
const { title = 'MoreminiMore - เพิ่มยอดขายของลูกค้ามากที่สุด', description = 'เราให้คำปรึกษาด้านกลยุทธ์การตลาดโดยใช้ข้อมูลเป็นพื้นฐาน พัฒนาศักยภาพของบุคลากรให้สูงขึ้น เพื่อเพิ่มยอดขายให้กับลูกค้าให้มากที่สุด' } = Astro.props;
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="th">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content={description} />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
|
||||
<!-- Favicons -->
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/branding/favicon-32.png" />
|
||||
<link rel="icon" type="image/png" sizes="192x192" href="/branding/favicon-192.png" />
|
||||
<link rel="apple-touch-icon" href="/branding/apple-touch-icon.png" />
|
||||
|
||||
<!-- Google Fonts -->
|
||||
<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=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet" />
|
||||
|
||||
<!-- Local Fonts -->
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: 'Kanit';
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('https://www.moreminimore.com/wp-content/uploads/2022/03/Kanit-400.woff') format('woff');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Kanit';
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url('https://www.moreminimore.com/wp-content/uploads/2022/03/Kanit-700.woff') format('woff');
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- SEO -->
|
||||
<title>{title}</title>
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:image" content="/branding/logo-long.png" />
|
||||
<meta property="twitter:card" content="summary_large_image" />
|
||||
</head>
|
||||
<body class="flex flex-col min-h-screen">
|
||||
<header class="bg-primary sticky top-0 z-50 shadow-lg">
|
||||
<!-- Top Bar -->
|
||||
<div class="bg-black text-white py-2">
|
||||
<div class="container mx-auto px-4 flex flex-wrap justify-between items-center text-sm">
|
||||
<div class="flex gap-4">
|
||||
<a href="mailto:contact@moreminimore.com" class="hover:text-primary transition">
|
||||
📧 contact@moreminimore.com
|
||||
</a>
|
||||
<a href="tel:0809955945" class="hover:text-primary transition">
|
||||
📞 080-995-5945
|
||||
</a>
|
||||
</div>
|
||||
<div class="flex gap-3">
|
||||
<a href="https://www.facebook.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">
|
||||
Facebook
|
||||
</a>
|
||||
<a href="https://twitter.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">
|
||||
Twitter
|
||||
</a>
|
||||
<a href="https://www.linkedin.com/company/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">
|
||||
LinkedIn
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navigation -->
|
||||
<div class="container mx-auto px-4 py-4">
|
||||
<div class="flex justify-between items-center">
|
||||
<a href="/" class="flex-shrink-0">
|
||||
<img
|
||||
src="/branding/logo-long-black.png"
|
||||
alt="MoreminiMore Logo"
|
||||
class="h-12 w-auto"
|
||||
width="200"
|
||||
height="50"
|
||||
/>
|
||||
</a>
|
||||
|
||||
<nav class="hidden md:flex gap-6 items-center">
|
||||
<a href="/#services" class="hover:text-primary transition font-medium">บริการของเรา</a>
|
||||
<a href="/category/seo" class="hover:text-primary transition font-medium">เรื่องน่ารู้</a>
|
||||
<a href="/contact-us" class="hover:text-primary transition font-medium">ติดต่อเรา</a>
|
||||
<a href="/about-us" class="hover:text-primary transition font-medium">เกี่ยวกับเรา</a>
|
||||
<a href="/#contactform" class="bg-black text-white px-6 py-2 rounded-full hover:bg-gray-800 transition font-medium">
|
||||
รับปรึกษา ฟรี!
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
<!-- Mobile Menu Button -->
|
||||
<button class="md:hidden text-black" id="mobile-menu-btn">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Mobile Menu -->
|
||||
<div class="md:hidden hidden" id="mobile-menu">
|
||||
<div class="flex flex-col gap-4 mt-4 pb-4">
|
||||
<a href="/#services" class="hover:text-primary transition font-medium">บริการของเรา</a>
|
||||
<a href="/category/seo" class="hover:text-primary transition font-medium">เรื่องน่ารู้</a>
|
||||
<a href="/contact-us" class="hover:text-primary transition font-medium">ติดต่อเรา</a>
|
||||
<a href="/about-us" class="hover:text-primary transition font-medium">เกี่ยวกับเรา</a>
|
||||
<a href="/#contactform" class="bg-black text-white px-6 py-2 rounded-full hover:bg-gray-800 transition font-medium text-center">
|
||||
รับปรึกษา ฟรี!
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="flex-grow">
|
||||
<slot />
|
||||
</main>
|
||||
|
||||
<footer class="bg-black text-white py-12">
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="grid md:grid-cols-4 gap-8">
|
||||
<div>
|
||||
<img
|
||||
src="/branding/logo-long.png"
|
||||
alt="MoreminiMore Logo"
|
||||
class="h-10 w-auto mb-4"
|
||||
width="180"
|
||||
height="45"
|
||||
/>
|
||||
<p class="text-gray-400 text-sm">
|
||||
เพิ่มยอดขายของลูกค้ามากที่สุด ด้วยงบประมาณต่ำที่สุด
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="font-bold mb-4">บริการ</h3>
|
||||
<ul class="space-y-2 text-sm text-gray-400">
|
||||
<li><a href="/digital-transformation-consult" class="hover:text-primary transition">ที่ปรึกษาองค์กรดิจิตอล</a></li>
|
||||
<li><a href="/online-marketing-consult" class="hover:text-primary transition">ที่ปรึกษาการตลาดออนไลน์</a></li>
|
||||
<li><a href="/website-development" class="hover:text-primary transition">พัฒนาเว็บไซต์</a></li>
|
||||
<li><a href="/app-development" class="hover:text-primary transition">พัฒนาแอปพลิเคชัน</a></li>
|
||||
<li><a href="/chatbot-consult" class="hover:text-primary transition">ระบบแชทบอท</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="font-bold mb-4">ลิงก์</h3>
|
||||
<ul class="space-y-2 text-sm text-gray-400">
|
||||
<li><a href="/about-us" class="hover:text-primary transition">เกี่ยวกับเรา</a></li>
|
||||
<li><a href="/contact-us" class="hover:text-primary transition">ติดต่อเรา</a></li>
|
||||
<li><a href="/category/seo" class="hover:text-primary transition">เรื่องน่ารู้</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="font-bold mb-4">ติดต่อ</h3>
|
||||
<ul class="space-y-2 text-sm text-gray-400">
|
||||
<li>📧 contact@moreminimore.com</li>
|
||||
<li>📞 080-995-5945</li>
|
||||
<li class="flex gap-3 mt-4">
|
||||
<a href="https://www.facebook.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">Facebook</a>
|
||||
<a href="https://twitter.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">Twitter</a>
|
||||
<a href="https://www.linkedin.com/company/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition">LinkedIn</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-sm text-gray-400">
|
||||
<div class="flex justify-center gap-6 mb-4">
|
||||
<a href="/terms-and-conditions" class="hover:text-primary transition">ข้อกำหนดและเงื่อนไข</a>
|
||||
<a href="/privacy-policy" class="hover:text-primary transition">นโยบายความเป็นส่วนตัว</a>
|
||||
</div>
|
||||
<p>© {new Date().getFullYear()} MoreminiMore Co.,Ltd. สงวนลิขสิทธิ์</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
// Mobile menu toggle
|
||||
const menuBtn = document.getElementById('mobile-menu-btn');
|
||||
const mobileMenu = document.getElementById('mobile-menu');
|
||||
|
||||
if (menuBtn && mobileMenu) {
|
||||
menuBtn.addEventListener('click', () => {
|
||||
mobileMenu.classList.toggle('hidden');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user