// shared.jsx — SVG icons, utilities, and BRAND config (edit here for each branch/brand) /* ─── BRAND CONFIG ───────────────────────────────────────────────────────── Change only this block to switch brands across git branches. All text, theme colours, images, routes, services, and copy live here. ──────────────────────────────────────────────────────────────────────── */ const BRAND = { /* ── Identity ─────────────────────────────────────────────── */ name: "XE GHÉP VĂN TÙNG", // all-caps logo mark nameFull: "Xe Ghép Văn Tùng", // body copy / headings tagline: "XE GHÉP MIỀN TRUNG", // sub-line under logo logo: "uploads/logo.png", founded: 2018, /* ── Contact ──────────────────────────────────────────────── */ phone: "093.193.2244", phoneHref: "tel:+84931932244", phoneZalo: "0931932244", // for zalo.me/{phoneZalo} address: "7/560 Nguyễn Tất Thành, Thành phố Huế", email: "xeghepvantung@gmail.com", /* ── Social ───────────────────────────────────────────────── */ social: { facebook: "https://www.facebook.com/david.rin.58", zalo: "https://zalo.me/0931932244", messenger:"https://www.facebook.com/david.rin.58", }, /* ── SEO / metadata ────────────────────────────────── */ seo: { title: "Xe Ghép Văn Tùng — Xe Ghép Huế · Đà Nẵng · Hội An", description: "Đặt xe ghép, xe limousine, đưa đón sân bay tuyến Huế · Đà Nẵng · Hội An. Giá niêm yết, đón tận nơi, hotline 093.193.2244.", siteName: "Xe Ghép Văn Tùng", canonical: "https://www.xeghepvantung.com/", ogImage: "https://www.xeghepvantung.com/uploads/logo.png", ogImageAlt: "Logo Xe Ghép Văn Tùng", favicon: "uploads/logo.png", }, /* ── Navigation links ─────────────────────────────────────── */ navLinks: [ { id: "trang-chu", label: "Trang chủ" }, { id: "dich-vu", label: "Dịch vụ" }, { id: "bang-gia", label: "Bảng giá" }, { id: "faq", label: "Liên hệ" }, { id: "tin-tuc", label: "Tin tức" }, ], /* ── Hero section copy ────────────────────────────────────── */ hero: { badge: "Xe ghép · Đưa đón sân bay · Limousine", badgeMobile: "Xe ghép · Limousine", heading: "XE GHÉP", cities: ["HUẾ", "ĐÀ NẴNG", "HỘI AN"], }, /* ── Brand intro section ──────────────────────────────────── */ intro: { eyebrow: "Giới thiệu", heading: "Xe Ghép Văn Tùng", sub: "— Dịch vụ chuyên nghiệp — Giá cả cạnh tranh —", description: "Xe Ghép Văn Tùng — Đơn vị xe ghép uy tín tuyến Huế · Đà Nẵng · Hội An. Hơn 6 năm đồng hành cùng hàng nghìn gia đình Việt và du khách quốc tế.", }, /* ── Utility bar (top of page, desktop only) ─────────────── */ utilityBar: "Dịch vụ chuyên nghiệp — Giá cả cạnh tranh", /* ── CTA banner ───────────────────────────────────────────── */ ctaBanner: { eyebrow: "Sẵn sàng cho chuyến đi của bạn?", heading: "Một cuộc gọi — và đi.", }, /* ── Footer ───────────────────────────────────────────────── */ footer: { description: "Xe Ghép Văn Tùng chuyên cung cấp dịch vụ xe ghép, xe ké cao cấp tuyến Huế · Đà Nẵng · Hội An. Đáp ứng mọi tiêu chí mà quý khách mong muốn.", copyrightEnd: 2026, }, /* ── Booking modal ────────────────────────────────────────── */ booking: { cities: ["Huế", "Đà Nẵng", "Hội An", "Sân bay Đà Nẵng"], defaultFrom: "Huế", defaultTo: "Đà Nẵng", successToast: "Đặt xe thành công! Tổng đài sẽ gọi xác nhận trong 5 phút.", errorMsg: "Không gửi được. Vui lòng gọi 093.193.2244 để đặt trực tiếp.", confirmLine: "Tổng đài sẽ gọi xác nhận tại số", confirmTime: "trong vòng 5 phút", }, /* ── Vehicle types (booking modal step 0) ─────────────────── */ vehicleTypes: [ { v: "Xe ghép Limousine", desc: "Ghế đơn, 9 chỗ" }, { v: "Xe ghép 7 chỗ", desc: "Fortuner, Innova" }, { v: "Bao xe 4 chỗ", desc: "Sedan riêng" }, { v: "Bao xe 7 chỗ", desc: "Đi nhóm, gia đình" }, { v: "Bao Limousine 9 chỗ", desc: "VIP đoàn lớn" }, ], /* ── Departure times ──────────────────────────────────────── */ times: [ "04:30","05:00","05:30","06:00","06:30","07:00","07:30","08:00","08:30","09:00","09:30", "10:00","10:30","11:00","11:30","12:00","12:30","13:00","13:30","14:00","14:30","15:00", "15:30","16:00","16:30","17:00","17:30","18:00","18:30","19:00","19:30","20:00","20:30","21:00", ], /* ── Routes (booking form dropdowns) ─────────────────────── */ routes: [ { from: "Huế", to: "Đà Nẵng", duration: "2h 15p", km: "95 km", price: "150.000đ", popular: true }, { from: "Đà Nẵng", to: "Hội An", duration: "45 phút", km: "30 km", price: "100.000đ" }, { from: "Huế", to: "Hội An", duration: "3h 00p", km: "125 km", price: "220.000đ" }, { from: "Sân bay ĐN",to: "Hội An", duration: "40 phút", km: "28 km", price: "180.000đ", airport: true }, ], /* ── Fleet ────────────────────────────────────────────────── */ fleet: [ { name: "Dcar Limousine 9 chỗ", seats: 9, tag: "VIP", desc: "Ghế da, massage, không gian riêng" }, { name: "Ford Transit Limousine", seats: 10, tag: "Phổ thông", desc: "Rộng rãi, phù hợp nhóm gia đình" }, { name: "Toyota Hiace 11 chỗ", seats: 11, tag: "Hành lý lớn", desc: "Khoang chứa rộng, đi sân bay" }, { name: "Hyundai Solati Sky", seats: 9, tag: "Sky View", desc: "Trần kính, view rộng dọc đường" }, ], /* ── Why us section ───────────────────────────────────────── */ whyUs: { eyebrow: "Tại sao chọn", heading: "Tại sao chọn Xe Ghép Văn Tùng", sub: "Sự hài lòng của quý khách là niềm vui của chúng tôi.", items: [ { icon: "shield", t: "Uy Tín Và Đúng Giờ", d: "Cam kết mang đến quý khách trải nghiệm an toàn và luôn đúng lịch trình." }, { icon: "check", t: "Giá Cả Cạnh Tranh", d: "Mức giá tối ưu nhất, phù hợp với mọi nhu cầu di chuyển của bạn." }, { icon: "car", t: "Xe Mới, Sạch Sẽ, Êm Ái", d: "Xe đời mới, nội thất sạch sẽ, chạy êm như ru — chỉ cần ngồi và tận hưởng." }, { icon: "user", t: "Đội Ngũ Tài Xế", d: "Đội ngũ tài xế thân thiện, sẵn sàng hỗ trợ khách hàng tận tâm và chu đáo." }, ], }, /* ── Process steps ────────────────────────────────────────── */ process: { eyebrow: "Quy trình", heading: "Quy trình đặt xe đơn giản", sub: "Chỉ 3 bước để có chuyến đi an toàn, đúng giờ.", steps: [ { icon: "car", t: "Liên hệ: Gọi/Zalo", d: "Đặt xe dễ dàng qua hotline hoặc Zalo. Tổng đài xác nhận ngày giờ đón." }, { icon: "check", t: "Xác nhận", d: "Tài xế Văn Tùng gọi xác nhận trước giờ đón 15–30 phút." }, { icon: "shield", t: "Thanh toán", d: "Thanh toán khi xuống xe bằng tiền mặt, QR hoặc chuyển khoản." }, ], }, /* ── Feature chips ────────────────────────────────────────── */ features: [ { icon: "shield", title: "An toàn 5 sao", text: "Tài xế 5+ năm kinh nghiệm, bảo hiểm hành khách trọn chuyến." }, { icon: "clock", title: "Đúng giờ", text: "Đón đúng giờ ±5 phút. Tài xế gọi xác nhận trước 30 phút." }, { icon: "pin", title: "Đón tận nơi", text: "Đón tại địa chỉ trong nội thành. Không phụ phí." }, { icon: "car", title: "Xe đời mới", text: "Toàn bộ xe ≤ 3 năm tuổi. Bảo dưỡng hàng tuần." }, { icon: "phone", title: "Hỗ trợ 24/7", text: "Tổng đài và Zalo trực 24/7. Phản hồi dưới 1 phút." }, { icon: "user", title: "Giá niêm yết", text: "Không phụ thu cuối tuần, không phát sinh chi phí." }, ], /* ── Services ─────────────────────────────────────────────── */ services: [ { route: "Huế — Đà Nẵng", from: "Huế", to: "Đà Nẵng", type: "Xe ghép 7 chỗ", desc: "1 vé ghép xe Fortuner", price: "150.000đ", tag: "ghep", hot: true }, { route: "Huế — Đà Nẵng", from: "Huế", to: "Đà Nẵng", type: "Xe ghép Limousine", desc: "1 vé ghép xe Limousine", price: "180.000đ", tag: "limo" }, { route: "Huế — Đà Nẵng", from: "Huế", to: "Đà Nẵng", type: "Bao xe 4 chỗ", desc: "Đi riêng", price: "700.000đ", tag: "bao" }, { route: "Huế — Đà Nẵng", from: "Huế", to: "Đà Nẵng", type: "Bao xe 7 chỗ", desc: "Đi riêng — Fortuner", price: "900.000đ", tag: "bao" }, { route: "Huế — Đà Nẵng", from: "Huế", to: "Đà Nẵng", type: "Bao Limousine 9 chỗ", desc: "Đoàn lớn, VIP", price: "1.500.000đ", tag: "limo" }, { route: "Huế — Hội An", from: "Huế", to: "Hội An", type: "Bao xe 4 chỗ", desc: "Đi riêng", price: "900.000đ", tag: "bao" }, { route: "Huế — Hội An", from: "Huế", to: "Hội An", type: "Bao xe 7 chỗ", desc: "Đi riêng — Fortuner", price: "1.100.000đ", tag: "bao" }, { route: "Đà Nẵng — Hội An", from: "Đà Nẵng", to: "Hội An", type: "Bao xe 4 chỗ", desc: "Sân bay → Phố cổ", price: "250.000đ", tag: "bao" }, { route: "Đà Nẵng — Hội An", from: "Đà Nẵng", to: "Hội An", type: "Bao xe 7 chỗ", desc: "Đi nhóm, gia đình", price: "300.000đ", tag: "bao" }, ], serviceFilters: [ { key: "all", label: "Tất cả" }, { key: "ghep", label: "Xe ghép" }, { key: "limo", label: "Limousine" }, { key: "bao", label: "Bao xe" }, ], /* ── Gallery labels (must match SITE_IMAGES.gallery order) ── */ gallery: [ "Kia Carnival – Đen", "Toyota Fortuner – Trắng", "Kia Carnival – Sau", "Fortuner – Hậu", "Fortuner – Trước trắng", "Fortuner – Đen", "Limousine Dcar nội thất", "Văn phòng Huế", "Ford Transit limousine", ], /* ── Reviews ──────────────────────────────────────────────── */ reviews: [ { name: "Anh Hoàng Phúc", role: "Kỹ sư, Đà Nẵng", stars: 5, avatar: "uploads/avatar-hoang-phuc.jpg", text: "Hay phải lên Huế họp, từ hồi dùng Văn Tùng thì không còn lo nữa. Nhắn Zalo là có xe, tài xế chưa bao giờ trễ dù mình đặt lúc 5 giờ sáng. Xe sạch, yên tĩnh, ngủ được luôn." }, { name: "Chị Lan Phương", role: "Giáo viên, Huế", stars: 5, avatar: "uploads/avatar-lan-phuong.jpg", text: "Dẫn học sinh đi tham quan Hội An, bao nguyên xe 7 chỗ. Anh tài kiên nhẫn chờ cả tiếng đồng hồ không phàn nàn gì. Giá cũng hợp lý hơn thuê xe du lịch nhiều." }, { name: "Chị Bảo Châu", role: "Nhân viên văn phòng", stars: 5, avatar: "uploads/avatar-bao-chau.jpg", text: "Mình hay đặt chuyến 5h30 sáng để kịp bay. Văn Tùng nhắn xác nhận tối hôm trước, hôm sau tài xế đã đứng dưới nhà lúc 5h20. Chưa một lần làm mình trễ." }, { name: "Anh Thanh Bình", role: "Hướng dẫn viên du lịch", stars: 5, avatar: "uploads/avatar-thanh-binh.jpg", text: "Thường xuyên giới thiệu khách quốc tế đi Văn Tùng vì tài xế lịch sự, xe không có mùi, đúng giờ. Khách của mình toàn hỏi lại số để lần sau tự đặt." }, { name: "Chị Thu Hà", role: "Blogger du lịch", stars: 5, avatar: "uploads/avatar-thu-ha.jpg", text: "Đặt Limousine đi Hội An, ngồi như máy bay hạng thương gia. Ghế rộng, có chăn, tài xế không mở nhạc ồn ào. Đến nơi vẫn còn tỉnh táo đi dạo phố cổ ngay." }, ], /* ── News / Blog posts ────────────────────────────────────── */ news: [ { tag: "Dịch vụ", title: "Dịch vụ xe ghép Huế — Đà Nẵng — Hội An | Xe Ghép Văn Tùng", date: "24.05.2026", time: "8:25", read: "5 phút", excerpt: "Tổng hợp các tuyến và bảng giá mới nhất 2026, mẹo chọn dịch vụ phù hợp cho từng nhu cầu di chuyển." }, { tag: "Du lịch", title: "Khám phá hành trình du lịch Huế — Đà Nẵng", date: "24.05.2026", time: "8:26", read: "8 phút", excerpt: "Cẩm nang 3 ngày 2 đêm xuyên ba thành phố — điểm đến không thể bỏ qua, quán ăn địa phương và lưu ý đi xe." }, { tag: "Vận chuyển", title: "Dịch vụ nhận gửi hàng hoá an toàn, nhanh chóng và tiện lợi", date: "24.05.2026", time: "8:25", read: "4 phút", excerpt: "Văn Tùng mở rộng dịch vụ gửi hàng kèm chuyến — bảng giá theo kích thước, cam kết giao đúng giờ." }, ], /* ── FAQ ─────────────────────────────────────────────────── */ faq: [ { q: "Văn Tùng có đến tận địa chỉ đón không?", a: "Có. Tài xế đến đúng địa chỉ bạn cung cấp trong nội thành Huế, Đà Nẵng và Quảng Nam — không cần ra điểm tập trung. Ngoại thành vui lòng báo trước để sắp xếp." }, { q: "Có thể thanh toán bằng chuyển khoản không?", a: "Được. Bạn có thể thanh toán tiền mặt khi lên xe, chuyển khoản trước hoặc quét QR qua Momo, ZaloPay, VietQR." }, { q: "Lỡ cần huỷ chuyến thì sao?", a: "Huỷ trước giờ khởi hành là miễn phí hoàn toàn. Báo sớm giúp chúng tôi bố trí lại cho khách khác." }, { q: "Trẻ nhỏ đi cùng có tính vé riêng không?", a: "Trẻ dưới 5 tuổi ngồi cùng ghế với người lớn được miễn phí. Trẻ từ 5 tuổi trở lên tính một vé người lớn để đảm bảo có chỗ ngồi riêng và an toàn hành trình." }, { q: "Mang nhiều hành lý có được không?", a: "Mỗi khách được mang 1 vali ≤ 20kg và 1 balo xách tay. Hành lý quá kích thước hoặc quá số lượng báo trước để tài xế sắp xếp khoang, phụ thu 30.000đ/kiện thêm." }, { q: "Văn Tùng có nhận chuyển hàng giữa các tỉnh không?", a: "Có. Nhận gửi hàng nhỏ theo chuyến giữa Huế, Đà Nẵng và Hội An. Phí từ 80.000đ tuỳ kích thước, giao tận nơi hoặc khách tự lấy tại điểm đến. Nhắn Zalo để báo trước." }, ], /* ── Theme — "Plum & Gold" ─────────────────────────────────── */ theme: { "--c-navy": "#2D1635", "--c-navy-soft": "#431F50", "--c-navy-deep": "#1A0C20", "--c-cream": "#F8F4F0", "--c-cream-2": "#EDE0D8", "--c-paper": "#FFFFFF", "--c-ink": "#1A0D22", "--c-ink-soft": "#4A3058", "--c-mute": "#8A6898", "--c-line": "rgba(45,22,53,0.10)", "--c-line-strong": "rgba(45,22,53,0.18)", "--c-accent": "#D4A840", "--c-accent-deep": "#B08820", "--c-accent-soft": "#F5E4A8", "--c-success": "#3A6B40", "--card-radius": "16px", "--card-radius-sm":"10px", }, }; /* Apply BRAND.theme to CSS custom properties at load time */ (function applyTheme() { const root = document.documentElement.style; Object.entries(BRAND.theme).forEach(([k, v]) => root.setProperty(k, v)); })(); /* Apply BRAND.seo to meta tags at load time */ (function applySEO() { const s = BRAND.seo; document.title = s.title; const set = (sel, attr, val) => { const el = document.querySelector(sel); if (el && val) el.setAttribute(attr, val); }; set('meta[name="description"]', "content", s.description); set('link[rel="canonical"]', "href", s.canonical); set('link[rel="icon"]', "href", s.favicon); set('link[rel="apple-touch-icon"]', "href", s.favicon); set('meta[property="og:title"]', "content", s.title); set('meta[property="og:description"]', "content", s.description); set('meta[property="og:url"]', "content", s.canonical); set('meta[property="og:image"]', "content", s.ogImage); set('meta[property="og:image:alt"]', "content", s.ogImageAlt); set('meta[property="og:site_name"]', "content", s.siteName); set('meta[name="twitter:title"]', "content", s.title); set('meta[name="twitter:description"]', "content", s.description); set('meta[name="twitter:image"]', "content", s.ogImage); })(); /* ─── SVG icon library ──────────────────────────────────────────────────── */ const Ico = { arrow: (p={}) => , arrowR: (p={}) => , arrowLR: (p={}) => , pin: (p={}) => , cal: (p={}) => , phone: (p={}) => , shield: (p={}) => , clock: (p={}) => , star: (p={}) => , user: (p={}) => , car: (p={}) => , wifi: (p={}) => , snow: (p={}) => , bag: (p={}) => , check: (p={}) => , plus: (p={}) => , minus: (p={}) => , zalo: (p={}) => ( ), messenger: (p={}) => ( ), facebook: (p={}) => ( ), }; /* ─── Image map ─────────────────────────────────────────────────────────── */ const SITE_IMAGES = { hero: "uploads/hero-limousine-office.png", cta: "uploads/haivan.jpg", services: [ "uploads/scene-hue-1.jpg", "uploads/scene-hue-2.jpg", "uploads/scene-hue-3.webp", "uploads/scene-danang-1.jpg", "uploads/scene-danang-2.jpg", "uploads/scene-hoian-1.jpg", "uploads/scene-hoian-2.jpg", "uploads/scene-danang-3.jpg", "uploads/scene-hoian-3.webp", ], gallery: [ "uploads/car-1.jpg", "uploads/car-2.jpg", "uploads/car-3.jpg", "uploads/car-4.jpg", "uploads/car-5.jpg", "uploads/car-6.jpg", "uploads/car-7.jpg", "uploads/car-8.webp", "uploads/car-9.webp", ], news: [ "uploads/scene-hue-1.jpg", "uploads/scene-hoian-1.jpg", "uploads/scene-danang-1.jpg", ], }; /* ─── ImageSlot — image with striped placeholder fallback ───────────────── */ function ImageSlot({ src, alt="", dark=false, fallbackLabel="", style={}, imgStyle={}, children, ...props }) { const [failed, setFailed] = React.useState(false); React.useEffect(() => setFailed(false), [src]); const showImage = src && !failed; return (

{showImage && ( {alt}

setFailed(true)} style={{ width: "100%", height: "100%", objectFit: "cover", display: "block", ...imgStyle }}/> )} {showImage ? children : <>{fallbackLabel || null}{children}}

); } /* ─── Logo — reads path from BRAND ─────────────────────────────────────── */ function Logo({ size=36 }) { return (

); } /* ─── useIsMobile ───────────────────────────────────────────────────────── */ function useIsMobile(breakpoint = 768) { const [isMobile, setIsMobile] = React.useState( typeof window !== "undefined" ? window.innerWidth < breakpoint : false ); React.useEffect(() => { const onResize = () => setIsMobile(window.innerWidth < breakpoint); window.addEventListener("resize", onResize); return () => window.removeEventListener("resize", onResize); }, [breakpoint]); return isMobile; } /* ─── Reveal — fade + slide-up on scroll ───────────────────────────────── */ function Reveal({ children, delay=0, y=28, duration=0.6, threshold=0.15, style={}, ...rest }) { const ref = React.useRef(null); const [visible, setVisible] = React.useState(false); React.useEffect(() => { const el = ref.current; if (!el) return; if (typeof IntersectionObserver === "undefined") { setVisible(true); return; } const io = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting) { setVisible(true); io.unobserve(el); } }); }, { threshold, rootMargin: "0px 0px -60px 0px" }); io.observe(el); return () => io.disconnect(); }, [threshold]); return (

{children}

); } /* ─── RouteLine SVG ─────────────────────────────────────────────────────── */ function RouteLine({ width=600, height=280, label="HUẾ → ĐÀ NẴNG → HỘI AN", color="rgba(255,255,255,.5)", dot="#E89B4A", labelColor="rgba(255,255,255,.7)" }) { return ( ); } /* ─── IMAGE_MANIFEST ────────────────────────────────────────────────────── */ const IMAGE_MANIFEST = [ { file: "hero-limousine-office.jpg", where: "Hero", purpose: "Ảnh nền hero — limousine trước văn phòng. Overlay tối để đè chữ trắng.", size: "1920×900", ratio: "16:7.5" }, { file: "cta-hai-van-limousine.jpg", where: "CTA Banner", purpose: "Ảnh nền CTA — xe trên đèo Hải Vân hoặc cảnh ven biển. Overlay tối.", size: "1920×600", ratio: "16:5" }, { file: "scene-hue.jpg", where: "Services — Huế—ĐN", purpose: "Phong cảnh Huế — Đại Nội / Sông Hương.", size: "800×600", ratio: "4:3" }, { file: "scene-hoian.jpg", where: "Services — Huế—HA", purpose: "Phong cảnh Hội An — Phố cổ, đèn lồng.", size: "800×600", ratio: "4:3" }, { file: "scene-danang.jpg", where: "Services — ĐN—HA", purpose: "Phong cảnh Đà Nẵng — Cầu Rồng, bãi biển.", size: "800×600", ratio: "4:3" }, { file: "gallery-01.jpg", where: "Gallery #1", purpose: "Kia Carnival màu đen — toàn cảnh bên hông.", size: "1000×750", ratio: "4:3" }, { file: "gallery-02.jpg", where: "Gallery #2", purpose: "Toyota Fortuner trắng — góc 3/4.", size: "1000×750", ratio: "4:3" }, { file: "gallery-03.jpg", where: "Gallery #3", purpose: "Kia Carnival phía sau.", size: "1000×750", ratio: "4:3" }, { file: "gallery-04.jpg", where: "Gallery #4", purpose: "Fortuner hậu.", size: "1000×750", ratio: "4:3" }, { file: "gallery-05.jpg", where: "Gallery #5", purpose: "Fortuner trắng — chính diện.", size: "1000×750", ratio: "4:3" }, { file: "gallery-06.jpg", where: "Gallery #6", purpose: "Fortuner đen.", size: "1000×750", ratio: "4:3" }, { file: "gallery-07.jpg", where: "Gallery #7", purpose: "Nội thất Dcar Limousine — ghế da, gối VIP.", size: "1000×750", ratio: "4:3" }, { file: "gallery-08.jpg", where: "Gallery #8", purpose: "Văn phòng Huế — biển hiệu, mặt tiền.", size: "1000×750", ratio: "4:3" }, { file: "gallery-09.jpg", where: "Gallery #9", purpose: "Ford Transit limousine.", size: "1000×750", ratio: "4:3" }, ]; Object.assign(window, { BRAND, Ico, SITE_IMAGES, IMAGE_MANIFEST, ImageSlot, Logo, Reveal, useIsMobile, RouteLine });