Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
0a2e1868ed |
65
about.php
Normal file
65
about.php
Normal file
@ -0,0 +1,65 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | About Us';
|
||||
$pageDescription = 'Meet the engineering team and manufacturing capabilities.';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/zh/about.php';
|
||||
|
||||
$highlights = get_highlights($lang);
|
||||
$facts = get_company_facts($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">Engineering-led industrial lighting manufacturer</h1>
|
||||
<p class="text-muted">A vertically integrated facility covering R&D, production, photometric testing, and global shipment coordination.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<img class="w-100 rounded-3 shadow-sm" src="/assets/images/factory-floor.svg" alt="Engineering and testing facility" width="520" height="420" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<h2>What sets us apart</h2>
|
||||
<p class="text-muted">From LED driver selection to full photometric reports, we run a disciplined manufacturing workflow to ensure every shipment meets compliance and performance targets.</p>
|
||||
<div class="row g-3 mt-3">
|
||||
<?php foreach ($highlights as $highlight): ?>
|
||||
<div class="col-md-6">
|
||||
<div class="feature-box">
|
||||
<h3 class="h6"><?= htmlspecialchars($highlight['title']) ?></h3>
|
||||
<p class="small text-muted mb-0"><?= htmlspecialchars($highlight['text']) ?></p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row g-4 mt-4">
|
||||
<?php foreach ($facts as $fact): ?>
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<div class="detail-card text-center">
|
||||
<div class="h4 mb-1"><?= htmlspecialchars($fact['value']) ?></div>
|
||||
<div class="text-muted small"><?= htmlspecialchars($fact['label']) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
@ -1,403 +1,13 @@
|
||||
body {
|
||||
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
||||
background-size: 400% 400%;
|
||||
animation: gradient 15s ease infinite;
|
||||
color: #212529;
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
:root {
|
||||
--primary: #D4AF37; /* Gold */
|
||||
--secondary: #FFF5F7; /* Pink/White tint */
|
||||
--accent: #E58D9C; /* Soft Pink */
|
||||
--text: #4A4A4A;
|
||||
}
|
||||
|
||||
.main-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 100vh;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@keyframes gradient {
|
||||
0% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
background: rgba(255, 255, 255, 0.85);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 85vh;
|
||||
box-shadow: 0 20px 40px rgba(0,0,0,0.2);
|
||||
backdrop-filter: blur(15px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chat-header {
|
||||
padding: 1.5rem;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
font-weight: 700;
|
||||
font-size: 1.1rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chat-messages {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
/* Custom Scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.message {
|
||||
max-width: 85%;
|
||||
padding: 0.85rem 1.1rem;
|
||||
border-radius: 16px;
|
||||
line-height: 1.5;
|
||||
font-size: 0.95rem;
|
||||
box-shadow: 0 4px 15px rgba(0,0,0,0.05);
|
||||
animation: fadeIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(20px) scale(0.95); }
|
||||
to { opacity: 1; transform: translateY(0) scale(1); }
|
||||
}
|
||||
|
||||
.message.visitor {
|
||||
align-self: flex-end;
|
||||
background: linear-gradient(135deg, #212529 0%, #343a40 100%);
|
||||
color: #fff;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.message.bot {
|
||||
align-self: flex-start;
|
||||
background: #ffffff;
|
||||
color: #212529;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.chat-input-area {
|
||||
padding: 1.25rem;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.chat-input-area form {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.chat-input-area input {
|
||||
flex: 1;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
border-radius: 12px;
|
||||
padding: 0.75rem 1rem;
|
||||
outline: none;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.chat-input-area input:focus {
|
||||
border-color: #23a6d5;
|
||||
box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.2);
|
||||
}
|
||||
|
||||
.chat-input-area button {
|
||||
background: #212529;
|
||||
color: #fff;
|
||||
border: none;
|
||||
padding: 0.75rem 1.5rem;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.chat-input-area button:hover {
|
||||
background: #000;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
/* Background Animations */
|
||||
.bg-animations {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.blob {
|
||||
position: absolute;
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 50%;
|
||||
filter: blur(80px);
|
||||
animation: move 20s infinite alternate cubic-bezier(0.45, 0, 0.55, 1);
|
||||
}
|
||||
|
||||
.blob-1 {
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
background: rgba(238, 119, 82, 0.4);
|
||||
}
|
||||
|
||||
.blob-2 {
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
background: rgba(35, 166, 213, 0.4);
|
||||
animation-delay: -7s;
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.blob-3 {
|
||||
top: 40%;
|
||||
left: 30%;
|
||||
background: rgba(231, 60, 126, 0.3);
|
||||
animation-delay: -14s;
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
0% { transform: translate(0, 0) rotate(0deg) scale(1); }
|
||||
33% { transform: translate(150px, 100px) rotate(120deg) scale(1.1); }
|
||||
66% { transform: translate(-50px, 200px) rotate(240deg) scale(0.9); }
|
||||
100% { transform: translate(0, 0) rotate(360deg) scale(1); }
|
||||
}
|
||||
|
||||
.header-link {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 8px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.header-link:hover {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Admin Styles */
|
||||
.admin-container {
|
||||
max-width: 900px;
|
||||
margin: 3rem auto;
|
||||
padding: 2.5rem;
|
||||
background: rgba(255, 255, 255, 0.85);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border-radius: 24px;
|
||||
box-shadow: 0 20px 50px rgba(0,0,0,0.15);
|
||||
border: 1px solid rgba(255, 255, 255, 0.4);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.admin-container h1 {
|
||||
margin-top: 0;
|
||||
color: #212529;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0 8px;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.table th {
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding: 1rem;
|
||||
color: #6c757d;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.table td {
|
||||
background: #fff;
|
||||
padding: 1rem;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.table tr td:first-child { border-radius: 12px 0 0 12px; }
|
||||
.table tr td:last-child { border-radius: 0 12px 12px 0; }
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
width: 100%;
|
||||
padding: 0.75rem 1rem;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
border-radius: 12px;
|
||||
background: #fff;
|
||||
transition: all 0.3s ease;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
outline: none;
|
||||
border-color: #23a6d5;
|
||||
box-shadow: 0 0 0 3px rgba(35, 166, 213, 0.1);
|
||||
}
|
||||
|
||||
.header-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-links {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.admin-card {
|
||||
background: rgba(255, 255, 255, 0.6);
|
||||
padding: 2rem;
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
margin-bottom: 2.5rem;
|
||||
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.admin-card h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.btn-delete {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-add {
|
||||
background: #212529;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.btn-save {
|
||||
background: #0088cc;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.8rem 1.5rem;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
width: 100%;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.webhook-url {
|
||||
font-size: 0.85em;
|
||||
color: #555;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.history-table-container {
|
||||
overflow-x: auto;
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
padding: 1rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.history-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history-table-time {
|
||||
width: 15%;
|
||||
white-space: nowrap;
|
||||
font-size: 0.85em;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.history-table-user {
|
||||
width: 35%;
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.history-table-ai {
|
||||
width: 50%;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.no-messages {
|
||||
text-align: center;
|
||||
color: #777;
|
||||
}
|
||||
body { font-family: 'Inter', sans-serif; color: var(--text); }
|
||||
.text-pink { color: var(--accent); }
|
||||
.btn-primary { background-color: var(--primary); border: none; }
|
||||
.hero-section { background: linear-gradient(135deg, var(--secondary) 0%, #FFFFFF 100%); }
|
||||
.card { transition: transform 0.3s ease; }
|
||||
.card:hover { transform: translateY(-10px); }
|
||||
12
assets/images/factory-floor.svg
Normal file
12
assets/images/factory-floor.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="520" height="420" viewBox="0 0 520 420" fill="none">
|
||||
<rect width="520" height="420" rx="20" fill="#F8FAFC"/>
|
||||
<rect x="40" y="60" width="440" height="120" rx="12" fill="#E2E8F0"/>
|
||||
<rect x="40" y="200" width="200" height="160" rx="12" fill="#CBD5F5"/>
|
||||
<rect x="260" y="200" width="220" height="160" rx="12" fill="#E2E8F0"/>
|
||||
<rect x="70" y="90" width="160" height="10" rx="5" fill="#0F766E"/>
|
||||
<rect x="70" y="110" width="220" height="8" rx="4" fill="#94A3B8"/>
|
||||
<circle cx="110" cy="270" r="32" fill="#0F766E"/>
|
||||
<rect x="160" y="250" width="60" height="40" rx="8" fill="#94A3B8"/>
|
||||
<rect x="300" y="240" width="140" height="16" rx="8" fill="#0F766E"/>
|
||||
<rect x="300" y="270" width="120" height="10" rx="5" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 791 B |
13
assets/images/hero-structure.svg
Normal file
13
assets/images/hero-structure.svg
Normal file
@ -0,0 +1,13 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="640" height="420" viewBox="0 0 640 420" fill="none">
|
||||
<rect width="640" height="420" rx="20" fill="#F8FAFC"/>
|
||||
<rect x="48" y="48" width="544" height="120" rx="12" fill="#E2E8F0"/>
|
||||
<rect x="48" y="192" width="260" height="180" rx="12" fill="#CBD5F5"/>
|
||||
<rect x="332" y="192" width="260" height="180" rx="12" fill="#E2E8F0"/>
|
||||
<rect x="72" y="72" width="180" height="12" rx="6" fill="#0F766E"/>
|
||||
<rect x="72" y="96" width="280" height="10" rx="5" fill="#94A3B8"/>
|
||||
<rect x="72" y="120" width="220" height="10" rx="5" fill="#94A3B8"/>
|
||||
<rect x="72" y="216" width="200" height="12" rx="6" fill="#0F766E"/>
|
||||
<rect x="72" y="240" width="150" height="10" rx="5" fill="#94A3B8"/>
|
||||
<rect x="356" y="216" width="200" height="12" rx="6" fill="#0F766E"/>
|
||||
<rect x="356" y="240" width="150" height="10" rx="5" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 881 B |
6
assets/images/product-flood.svg
Normal file
6
assets/images/product-flood.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
|
||||
<rect width="80" height="80" rx="16" fill="#F1F5F9"/>
|
||||
<rect x="18" y="18" width="44" height="32" rx="10" fill="#CBD5F5"/>
|
||||
<rect x="26" y="54" width="28" height="10" rx="5" fill="#0F766E"/>
|
||||
<rect x="30" y="26" width="20" height="10" rx="5" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 367 B |
6
assets/images/product-highbay.svg
Normal file
6
assets/images/product-highbay.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
|
||||
<rect width="80" height="80" rx="16" fill="#F1F5F9"/>
|
||||
<rect x="18" y="20" width="44" height="20" rx="8" fill="#CBD5F5"/>
|
||||
<rect x="26" y="44" width="28" height="14" rx="7" fill="#0F766E"/>
|
||||
<rect x="34" y="14" width="12" height="8" rx="4" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 365 B |
6
assets/images/product-street.svg
Normal file
6
assets/images/product-street.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
|
||||
<rect width="80" height="80" rx="16" fill="#F1F5F9"/>
|
||||
<rect x="32" y="16" width="16" height="30" rx="8" fill="#CBD5F5"/>
|
||||
<rect x="26" y="46" width="28" height="12" rx="6" fill="#0F766E"/>
|
||||
<rect x="38" y="58" width="4" height="10" rx="2" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 365 B |
6
assets/images/product-tri.svg
Normal file
6
assets/images/product-tri.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
|
||||
<rect width="80" height="80" rx="16" fill="#F1F5F9"/>
|
||||
<rect x="14" y="32" width="52" height="16" rx="8" fill="#CBD5F5"/>
|
||||
<rect x="20" y="50" width="40" height="10" rx="5" fill="#0F766E"/>
|
||||
<rect x="26" y="22" width="28" height="8" rx="4" fill="#94A3B8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 365 B |
@ -1,39 +1,8 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const chatForm = document.getElementById('chat-form');
|
||||
const chatInput = document.getElementById('chat-input');
|
||||
const chatMessages = document.getElementById('chat-messages');
|
||||
|
||||
const appendMessage = (text, sender) => {
|
||||
const msgDiv = document.createElement('div');
|
||||
msgDiv.classList.add('message', sender);
|
||||
msgDiv.textContent = text;
|
||||
chatMessages.appendChild(msgDiv);
|
||||
chatMessages.scrollTop = chatMessages.scrollHeight;
|
||||
};
|
||||
|
||||
chatForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
const message = chatInput.value.trim();
|
||||
if (!message) return;
|
||||
|
||||
appendMessage(message, 'visitor');
|
||||
chatInput.value = '';
|
||||
|
||||
try {
|
||||
const response = await fetch('api/chat.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ message })
|
||||
});
|
||||
const data = await response.json();
|
||||
|
||||
// Artificial delay for realism
|
||||
const alerts = document.querySelectorAll('.alert[data-auto-dismiss]');
|
||||
alerts.forEach((alert) => {
|
||||
setTimeout(() => {
|
||||
appendMessage(data.reply, 'bot');
|
||||
}, 500);
|
||||
} catch (error) {
|
||||
console.error('Error:', error);
|
||||
appendMessage("Sorry, something went wrong. Please try again.", 'bot');
|
||||
}
|
||||
alert.classList.add('fade');
|
||||
}, 3500);
|
||||
});
|
||||
});
|
||||
|
||||
61
contact.php
Normal file
61
contact.php
Normal file
@ -0,0 +1,61 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | Contact';
|
||||
$pageDescription = 'Reach our sales engineers on WhatsApp for product inquiries.';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/zh/contact.php';
|
||||
|
||||
$whatsAppLink = 'https://wa.me/' . $site['whatsapp_number'] . '?text=' . urlencode($site['whatsapp_message']);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">Contact our sales engineers</h1>
|
||||
<p class="text-muted">Fast response via WhatsApp for quotations, catalogs, and OEM customization.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-6">
|
||||
<div class="detail-card h-100">
|
||||
<h2 class="h5">WhatsApp direct line</h2>
|
||||
<p class="text-muted">Our Malaysia-based WhatsApp line is ready for product inquiries and technical consultations.</p>
|
||||
<a class="btn btn-primary" href="<?= htmlspecialchars($whatsAppLink) ?>" target="_blank" rel="noopener">
|
||||
<i class="bi bi-whatsapp me-2"></i>Message on WhatsApp
|
||||
</a>
|
||||
<div class="mt-3 small text-muted">Number: <?= htmlspecialchars($site['whatsapp_number']) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div class="detail-card h-100">
|
||||
<h2 class="h5">Inquiry checklist</h2>
|
||||
<ul class="small">
|
||||
<li>Project location and environment</li>
|
||||
<li>Target wattage / lumen output</li>
|
||||
<li>Certification requirements (CE/CB/SASO)</li>
|
||||
<li>Desired delivery timeline</li>
|
||||
</ul>
|
||||
<div class="alert alert-light mt-3" role="alert">
|
||||
For testing: please replace <strong>60XXXXXXXXX</strong> in <code>includes/data.php</code> with your real WhatsApp number.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
92
includes/data.php
Normal file
92
includes/data.php
Normal file
@ -0,0 +1,92 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
|
||||
function site_config(string $lang = 'en'): array
|
||||
{
|
||||
$whatsAppNumber = '60123456789';
|
||||
$whatsAppMessage = $lang === 'zh'
|
||||
? '你好，我想咨询你们的高端美白护肤方案。'
|
||||
: 'Hello, I would like to inquire about your luxury whitening skincare solutions.';
|
||||
|
||||
$nav = [
|
||||
'en' => [
|
||||
['label' => 'Home', 'url' => '/index.php'],
|
||||
['label' => 'Products', 'url' => '/products.php'],
|
||||
['label' => 'Science', 'url' => '/technology.php'],
|
||||
['label' => 'About', 'url' => '/about.php'],
|
||||
['label' => 'Contact', 'url' => '/contact.php'],
|
||||
],
|
||||
'zh' => [
|
||||
['label' => '首页', 'url' => '/zh/index.php'],
|
||||
['label' => '产品中心', 'url' => '/zh/products.php'],
|
||||
['label' => '核心科技', 'url' => '/zh/technology.php'],
|
||||
['label' => '品牌故事', 'url' => '/zh/about.php'],
|
||||
['label' => '联系我们', 'url' => '/zh/contact.php'],
|
||||
]
|
||||
];
|
||||
|
||||
if ($lang === 'zh') {
|
||||
return [
|
||||
'brand' => 'Lumière',
|
||||
'tagline' => '高端美白 · 科技护肤 · 奢享璀璨',
|
||||
'whatsapp_number' => $whatsAppNumber,
|
||||
'whatsapp_message' => $whatsAppMessage,
|
||||
'nav' => $nav['zh'],
|
||||
];
|
||||
}
|
||||
|
||||
return [
|
||||
'brand' => 'Lumière',
|
||||
'tagline' => 'Luxury Whitening · Advanced Skincare Science',
|
||||
'whatsapp_number' => $whatsAppNumber,
|
||||
'whatsapp_message' => $whatsAppMessage,
|
||||
'nav' => $nav['en'],
|
||||
];
|
||||
}
|
||||
|
||||
function get_products(string $lang = 'en'): array
|
||||
{
|
||||
if ($lang === 'zh') {
|
||||
return [
|
||||
[
|
||||
'id' => 1,
|
||||
'name' => '璀璨焕亮精华液',
|
||||
'description' => '深层渗透，激活肌肤底层的透亮光感。',
|
||||
'image' => '/assets/images/product-street.svg',
|
||||
],
|
||||
[
|
||||
'id' => 2,
|
||||
'name' => '奢宠美白日霜',
|
||||
'description' => '轻盈丝滑，为肌肤提供全天候的修护与滋润。',
|
||||
'image' => '/assets/images/product-highbay.svg',
|
||||
],
|
||||
[
|
||||
'id' => 3,
|
||||
'name' => '净透舒缓修护膜',
|
||||
'description' => '舒缓镇静，赋予肌肤纯净无瑕的通透感。',
|
||||
'image' => '/assets/images/product-tri.svg',
|
||||
],
|
||||
];
|
||||
}
|
||||
|
||||
return [
|
||||
[
|
||||
'id' => 1,
|
||||
'name' => 'Luminous Radiance Serum',
|
||||
'description' => 'Deep penetration to activate the underlying light of your skin.',
|
||||
'image' => '/assets/images/product-street.svg',
|
||||
],
|
||||
[
|
||||
'id' => 2,
|
||||
'name' => 'Luxury Whitening Day Cream',
|
||||
'description' => 'Light and silky, providing all-day repair and hydration.',
|
||||
'image' => '/assets/images/product-highbay.svg',
|
||||
],
|
||||
[
|
||||
'id' => 3,
|
||||
'name' => 'Pure Clarifying Mask',
|
||||
'description' => 'Soothing and calming, bestowing a pure, flawless clarity.',
|
||||
'image' => '/assets/images/product-tri.svg',
|
||||
],
|
||||
];
|
||||
}
|
||||
44
includes/footer.php
Normal file
44
includes/footer.php
Normal file
@ -0,0 +1,44 @@
|
||||
<?php
|
||||
$year = date('Y');
|
||||
$whatsAppLink = $whatsAppLink ?? 'https://wa.me/' . $site['whatsapp_number'];
|
||||
?>
|
||||
<footer class="site-footer">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-4">
|
||||
<div class="footer-brand"><?= htmlspecialchars($site['brand']) ?></div>
|
||||
<p class="text-muted small"><?= htmlspecialchars($site['tagline']) ?></p>
|
||||
<div class="footer-contact">
|
||||
<div><span class="text-muted">WhatsApp:</span> <a href="<?= htmlspecialchars($whatsAppLink) ?>" target="_blank" rel="noopener"><?= htmlspecialchars($site['whatsapp_number']) ?></a></div>
|
||||
<div><span class="text-muted"><?= $lang === 'zh' ? '邮箱' : 'Email' ?>:</span> sales@shinehigh.cn</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<h3 class="h6"><?= $lang === 'zh' ? '解决方案' : 'Solutions' ?></h3>
|
||||
<ul class="list-unstyled small">
|
||||
<li><?= $lang === 'zh' ? '工业厂房照明' : 'Industrial facility lighting' ?></li>
|
||||
<li><?= $lang === 'zh' ? '体育场与户外' : 'Stadium & outdoor' ?></li>
|
||||
<li><?= $lang === 'zh' ? '物流仓储' : 'Warehouse logistics' ?></li>
|
||||
<li><?= $lang === 'zh' ? '市政道路' : 'Municipal road' ?></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<h3 class="h6"><?= $lang === 'zh' ? '下载' : 'Downloads' ?></h3>
|
||||
<ul class="list-unstyled small">
|
||||
<li><?= $lang === 'zh' ? '公司简介' : 'Company profile' ?></li>
|
||||
<li><?= $lang === 'zh' ? '产品目录' : 'Product catalog' ?></li>
|
||||
<li><?= $lang === 'zh' ? '认证证书' : 'Certificates' ?></li>
|
||||
<li><?= $lang === 'zh' ? '售后流程' : 'Service policy' ?></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <?= htmlspecialchars((string) $year) ?> <?= htmlspecialchars($site['brand']) ?>. <?= $lang === 'zh' ? '版权所有' : 'All rights reserved.' ?></span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="/assets/js/main.js?v=<?= htmlspecialchars($assetVersion) ?>"></script>
|
||||
</body>
|
||||
</html>
|
||||
68
includes/header.php
Normal file
68
includes/header.php
Normal file
@ -0,0 +1,68 @@
|
||||
<?php
|
||||
$lang = $lang ?? 'en';
|
||||
$site = $site ?? site_config($lang);
|
||||
$navItems = $navItems ?? $site['nav'];
|
||||
$pageTitle = $pageTitle ?? $site['brand'];
|
||||
$pageDescription = $pageDescription ?? '';
|
||||
$assetVersion = $assetVersion ?? (string) time();
|
||||
$langSwitchUrl = $langSwitchUrl ?? '/zh/index.php';
|
||||
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
$metaDescription = $projectDescription !== '' ? $projectDescription : $pageDescription;
|
||||
|
||||
$whatsAppLink = 'https://wa.me/' . $site['whatsapp_number'] . '?text=' . urlencode($site['whatsapp_message']);
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="<?= htmlspecialchars($lang) ?>">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title><?= htmlspecialchars($pageTitle) ?></title>
|
||||
<?php if ($metaDescription): ?>
|
||||
<meta name="description" content="<?= htmlspecialchars($metaDescription) ?>" />
|
||||
<meta property="og:description" content="<?= htmlspecialchars($metaDescription) ?>" />
|
||||
<meta property="twitter:description" content="<?= htmlspecialchars($metaDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<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=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
||||
<link rel="stylesheet" href="/assets/css/custom.css?v=<?= htmlspecialchars($assetVersion) ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header class="site-header sticky-top">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="<?= htmlspecialchars($lang === 'zh' ? '/zh/index.php' : '/index.php') ?>">
|
||||
<span class="brand-mark">SH</span>
|
||||
<span class="brand-text"><?= htmlspecialchars($site['brand']) ?></span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#primaryNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="primaryNav">
|
||||
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
|
||||
<?php foreach ($navItems as $item): ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link px-3" href="<?= htmlspecialchars($item['url']) ?>"><?= htmlspecialchars($item['label']) ?></a>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="d-flex align-items-center gap-2 ms-lg-3">
|
||||
<a class="btn btn-sm btn-outline-secondary" href="<?= htmlspecialchars($langSwitchUrl) ?>"><?= $lang === 'zh' ? 'EN' : '中文' ?></a>
|
||||
<a class="btn btn-sm btn-primary" href="<?= htmlspecialchars($whatsAppLink) ?>" target="_blank" rel="noopener">WhatsApp</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<a class="whatsapp-float" href="<?= htmlspecialchars($whatsAppLink) ?>" target="_blank" rel="noopener" aria-label="Chat on WhatsApp">
|
||||
<i class="bi bi-whatsapp"></i>
|
||||
</a>
|
||||
246
index.php
246
index.php
@ -1,150 +1,110 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@ini_set('display_errors', '1');
|
||||
@error_reporting(E_ALL);
|
||||
@date_default_timezone_set('UTC');
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$phpVersion = PHP_VERSION;
|
||||
$now = date('Y-m-d H:i:s');
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$products = get_products($lang);
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>New Style</title>
|
||||
<?php
|
||||
// Read project preview data from environment
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
?>
|
||||
<?php if ($projectDescription): ?>
|
||||
<!-- Meta description -->
|
||||
<meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' />
|
||||
<!-- Open Graph meta tags -->
|
||||
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<!-- Twitter meta tags -->
|
||||
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<!-- Open Graph image -->
|
||||
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<!-- Twitter image -->
|
||||
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<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=Inter:wght@400;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root {
|
||||
--bg-color-start: #6a11cb;
|
||||
--bg-color-end: #2575fc;
|
||||
--text-color: #ffffff;
|
||||
--card-bg-color: rgba(255, 255, 255, 0.01);
|
||||
--card-border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Inter', sans-serif;
|
||||
background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
|
||||
color: var(--text-color);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
body::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>');
|
||||
animation: bg-pan 20s linear infinite;
|
||||
z-index: -1;
|
||||
}
|
||||
@keyframes bg-pan {
|
||||
0% { background-position: 0% 0%; }
|
||||
100% { background-position: 100% 100%; }
|
||||
}
|
||||
main {
|
||||
padding: 2rem;
|
||||
}
|
||||
.card {
|
||||
background: var(--card-bg-color);
|
||||
border: 1px solid var(--card-border-color);
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.loader {
|
||||
margin: 1.25rem auto 1.25rem;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.25);
|
||||
border-top-color: #fff;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
@keyframes spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
.hint {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px; height: 1px;
|
||||
padding: 0; margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap; border: 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 1rem;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
p {
|
||||
margin: 0.5rem 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
code {
|
||||
background: rgba(0,0,0,0.2);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||
}
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 1rem;
|
||||
font-size: 0.8rem;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="card">
|
||||
<h1>Analyzing your requirements and generating your website…</h1>
|
||||
<div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
|
||||
<span class="sr-only">Loading…</span>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main class="skincare-landing">
|
||||
<!-- 1. Hero Section -->
|
||||
<section class="hero-section py-5 d-flex align-items-center" style="background: #FFF5F7; min-height: 80vh;">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<h1 class="display-2 fw-bold" style="color: #D4AF37;">Lumière Whitening</h1>
|
||||
<p class="lead mb-4 text-secondary">Revolutionizing skincare through advanced bio-luminescence science. Reveal your inner radiance with our luxury whitening solutions.</p>
|
||||
<a class="btn btn-lg" style="background: #D4AF37; color: white;" href="/products.php">Discover Collection</a>
|
||||
</div>
|
||||
<p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
|
||||
<p class="hint">This page will update automatically as the plan is implemented.</p>
|
||||
<p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
|
||||
<div class="col-lg-6 text-center">
|
||||
<img src="/assets/images/product-street.svg" class="img-fluid rounded-circle shadow-lg" alt="Whitening Skincare">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 2. Core Advantages -->
|
||||
<section class="py-5 bg-white">
|
||||
<div class="container text-center">
|
||||
<h2 class="mb-5">Our Luxury Advantages</h2>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-3"><div class="p-4 border rounded"><i class="bi bi-gem fs-1 text-pink"></i><h4>Purity</h4></div></div>
|
||||
<div class="col-md-3"><div class="p-4 border rounded"><i class="bi bi-shield-check fs-1 text-pink"></i><h4>Science-Backed</h4></div></div>
|
||||
<div class="col-md-3"><div class="p-4 border rounded"><i class="bi bi-flower1 fs-1 text-pink"></i><h4>Organic</h4></div></div>
|
||||
<div class="col-md-3"><div class="p-4 border rounded"><i class="bi bi-star fs-1 text-pink"></i><h4>Premium Quality</h4></div></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 3. Product Showcase -->
|
||||
<section class="py-5" style="background: #F9FAFB;">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-5">Signature Collection</h2>
|
||||
<div class="row g-4">
|
||||
<?php foreach (array_slice($products, 0, 3) as $product): ?>
|
||||
<div class="col-md-4">
|
||||
<div class="card border-0 shadow-sm h-100">
|
||||
<img src="<?= $product['image'] ?>" class="card-img-top" alt="<?= $product['name'] ?>">
|
||||
<div class="card-body text-center"><h5><?= $product['name'] ?></h5><p class="text-secondary"><?= $product['description'] ?></p></div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 4. Technology -->
|
||||
<section class="py-5 bg-white">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-6"><img src="/assets/images/factory-floor.svg" class="img-fluid" alt="Tech"></div>
|
||||
<div class="col-lg-6"><h2>Advanced Whitening Tech</h2><p>Our proprietary enzyme-activation technology targets melanin at the source, ensuring visible brightness with zero irritation.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 5. Before/After -->
|
||||
<section class="py-5 text-center" style="background: #FFF5F7;">
|
||||
<div class="container">
|
||||
<h2 class="mb-5">The Visible Transformation</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-6"><img src="/assets/images/product-highbay.svg" class="img-fluid" alt="Before"><p>Before</p></div>
|
||||
<div class="col-md-6"><img src="/assets/images/product-tri.svg" class="img-fluid" alt="After"><p>After 28 Days</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 6. Reviews -->
|
||||
<section class="py-5 bg-white">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-5">Client Praise</h2>
|
||||
<div class="row g-4">
|
||||
<?php for($i=0; $i<3; $i++): ?>
|
||||
<div class="col-md-4"><div class="p-4 border rounded shadow-sm">"Absolutely stunning results. My skin has never felt this luminous." <br><b>- Sarah L.</b></div></div>
|
||||
<?php endfor; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 7. Knowledge & 8. About -->
|
||||
<section class="py-5 bg-light">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6"><h3>Expert Skincare Knowledge</h3><p>Understanding the science behind whitening...</p></div>
|
||||
<div class="col-md-6"><h3>Our Heritage</h3><p>Founded by cosmetic scientists in 2010...</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 9. Contact -->
|
||||
<section class="py-5 text-center">
|
||||
<div class="container">
|
||||
<h2>Connect With Beauty</h2>
|
||||
<a href="/contact.php" class="btn btn-outline-dark">Schedule Consultation</a>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
Page updated: <?= htmlspecialchars($now) ?> (UTC)
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
52
news.php
Normal file
52
news.php
Normal file
@ -0,0 +1,52 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | News';
|
||||
$pageDescription = 'Production updates, certifications, and delivery highlights.';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/zh/news.php';
|
||||
|
||||
$newsItems = get_news($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">Factory news & updates</h1>
|
||||
<p class="text-muted">Stay informed with certifications, delivery milestones, and product releases.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<?php foreach ($newsItems as $item): ?>
|
||||
<div class="col-lg-4">
|
||||
<article class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="text-uppercase small text-muted"><?= htmlspecialchars($item['date']) ?></div>
|
||||
<h2 class="h5 mt-2"><?= htmlspecialchars($item['title']) ?></h2>
|
||||
<p class="text-muted small"><?= htmlspecialchars($item['summary']) ?></p>
|
||||
<span class="text-muted small">Read more in WhatsApp updates.</span>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="alert alert-light mt-4" role="alert" data-auto-dismiss="true">
|
||||
Need a project update? Reach our team via WhatsApp for live production status.
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
60
product.php
Normal file
60
product.php
Normal file
@ -0,0 +1,60 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$productData = get_products($lang);
|
||||
$productId = isset($_GET['id']) ? (int) $_GET['id'] : 0;
|
||||
$selected = null;
|
||||
|
||||
foreach ($productData as $product) {
|
||||
if ($product['id'] === $productId) {
|
||||
$selected = $product;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$pageTitle = $selected ? $selected['name'] . ' | ' . $site['brand'] : 'Product Detail | ' . $site['brand'];
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main class="container my-5">
|
||||
<?php if (!$selected): ?>
|
||||
<div class="alert alert-warning">Product not found.</div>
|
||||
<a class="btn btn-primary" href="/products.php">Back to products</a>
|
||||
<?php else: ?>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<!-- Carousel -->
|
||||
<div id="productCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<?php foreach ($selected['images'] as $index => $img): ?>
|
||||
<div class="carousel-item <?= $index === 0 ? 'active' : '' ?>">
|
||||
<img src="<?= htmlspecialchars($img) ?>" class="d-block w-100" alt="Product Image">
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#productCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon bg-dark"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#productCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon bg-dark"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h1><?= htmlspecialchars($selected['name']) ?></h1>
|
||||
<p class="lead text-muted"><?= htmlspecialchars($selected['summary']) ?></p>
|
||||
<p><?= htmlspecialchars($selected['details']) ?></p>
|
||||
<a class="btn btn-lg btn-success" href="https://wa.me/<?= $site['whatsapp_number'] ?>?text=<?= urlencode($site['whatsapp_message']) ?>">
|
||||
Contact on WhatsApp
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
59
products.php
Normal file
59
products.php
Normal file
@ -0,0 +1,59 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | Products';
|
||||
$pageDescription = 'Browse our industrial lighting categories engineered for global projects.';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/zh/products.php';
|
||||
|
||||
$products = get_products($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<div class="row align-items-center g-4">
|
||||
<div class="col-lg-7">
|
||||
<h1 class="display-6 fw-semibold">Industrial product portfolio</h1>
|
||||
<p class="text-muted">Choose from high bay, flood, tri-proof, and street lighting lines with clear documentation for procurement teams.</p>
|
||||
</div>
|
||||
<div class="col-lg-5 text-lg-end">
|
||||
<span class="badge badge-soft"><?= count($products) ?> categories</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<?php foreach ($products as $product): ?>
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<article class="card h-100 product-card">
|
||||
<div class="card-body">
|
||||
<img class="product-icon" src="<?= htmlspecialchars($product['image']) ?>" alt="<?= htmlspecialchars($product['name']) ?>" width="64" height="64" />
|
||||
<h2 class="h5"><?= htmlspecialchars($product['name']) ?></h2>
|
||||
<p class="text-muted small"><?= htmlspecialchars($product['summary']) ?></p>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<a class="btn btn-sm btn-primary" href="/product.php?id=<?= urlencode((string) $product['id']) ?>">View detail</a>
|
||||
<a class="btn btn-sm btn-outline-secondary" href="/contact.php">Request quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
24
services.php
Normal file
24
services.php
Normal file
@ -0,0 +1,24 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
<main class="container py-5">
|
||||
<h1>Services & Customization</h1>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-6">
|
||||
<div class="card p-4">
|
||||
<h3>OEM Manufacturing</h3>
|
||||
<p>Full-scale production for established brands using our proven whitening formulas.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card p-4">
|
||||
<h3>ODM/CDMO Solutions</h3>
|
||||
<p>End-to-end product development, from ingredient research to final packaging.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
25
technology.php
Normal file
25
technology.php
Normal file
@ -0,0 +1,25 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/includes/data.php';
|
||||
$lang = 'en';
|
||||
$site = site_config($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/includes/header.php'; ?>
|
||||
<main class="container py-5">
|
||||
<h1>Core Technology</h1>
|
||||
<p class="lead">Pioneering whitening materials and bio-active formulations.</p>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-6">
|
||||
<div class="card p-4">
|
||||
<h3>Research Platforms</h3>
|
||||
<p>Our labs focus on advanced molecular pathways to inhibit melanin production.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card p-4">
|
||||
<h3>Innovation Advantages</h3>
|
||||
<p>Sustainable, high-efficacy formulations that exceed global industry standards.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<?php require __DIR__ . '/includes/footer.php'; ?>
|
||||
65
zh/about.php
Normal file
65
zh/about.php
Normal file
@ -0,0 +1,65 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | 关于我们';
|
||||
$pageDescription = '了解工厂实力与工程团队。';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/about.php';
|
||||
|
||||
$highlights = get_highlights($lang);
|
||||
$facts = get_company_facts($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">以工程为核心的工业照明制造商</h1>
|
||||
<p class="text-muted">涵盖研发、生产、光学测试与全球出货协同的完整制造链路。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<img class="w-100 rounded-3 shadow-sm" src="/assets/images/factory-floor.svg" alt="工程与测试中心" width="520" height="420" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<h2>我们的核心优势</h2>
|
||||
<p class="text-muted">从LED驱动选型到光学报告，严格控制每一道工艺，为全球客户提供稳定品质。</p>
|
||||
<div class="row g-3 mt-3">
|
||||
<?php foreach ($highlights as $highlight): ?>
|
||||
<div class="col-md-6">
|
||||
<div class="feature-box">
|
||||
<h3 class="h6"><?= htmlspecialchars($highlight['title']) ?></h3>
|
||||
<p class="small text-muted mb-0"><?= htmlspecialchars($highlight['text']) ?></p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row g-4 mt-4">
|
||||
<?php foreach ($facts as $fact): ?>
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<div class="detail-card text-center">
|
||||
<div class="h4 mb-1"><?= htmlspecialchars($fact['value']) ?></div>
|
||||
<div class="text-muted small"><?= htmlspecialchars($fact['label']) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
61
zh/contact.php
Normal file
61
zh/contact.php
Normal file
@ -0,0 +1,61 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | 联系我们';
|
||||
$pageDescription = '通过WhatsApp快速咨询报价与定制方案。';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/contact.php';
|
||||
|
||||
$whatsAppLink = 'https://wa.me/' . $site['whatsapp_number'] . '?text=' . urlencode($site['whatsapp_message']);
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">联系销售工程师</h1>
|
||||
<p class="text-muted">通过WhatsApp快速获取报价、目录与技术支持。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-6">
|
||||
<div class="detail-card h-100">
|
||||
<h2 class="h5">WhatsApp直连</h2>
|
||||
<p class="text-muted">马来西亚WhatsApp号码，支持中英文沟通。</p>
|
||||
<a class="btn btn-primary" href="<?= htmlspecialchars($whatsAppLink) ?>" target="_blank" rel="noopener">
|
||||
<i class="bi bi-whatsapp me-2"></i>WhatsApp联系
|
||||
</a>
|
||||
<div class="mt-3 small text-muted">号码：<?= htmlspecialchars($site['whatsapp_number']) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div class="detail-card h-100">
|
||||
<h2 class="h5">咨询信息准备</h2>
|
||||
<ul class="small">
|
||||
<li>项目地点与使用环境</li>
|
||||
<li>功率/光通量要求</li>
|
||||
<li>认证需求（CE/CB/SASO）</li>
|
||||
<li>交付周期预期</li>
|
||||
</ul>
|
||||
<div class="alert alert-light mt-3" role="alert">
|
||||
测试提示：请在 <code>includes/data.php</code> 中将 <strong>60XXXXXXXXX</strong> 替换为真实号码。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
64
zh/index.php
Normal file
64
zh/index.php
Normal file
@ -0,0 +1,64 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | 美白护肤研发';
|
||||
$pageDescription = '领先的美白护肤品研发与OEM代工解决方案。';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/index.php';
|
||||
|
||||
$products = get_products($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<!-- Hero Section -->
|
||||
<section class="hero-section bg-light py-5">
|
||||
<div class="container">
|
||||
<div id="heroCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<h1 class="display-4 fw-bold">先进美白科技，重塑肌肤之美</h1>
|
||||
<p class="lead">从尖端护肤研究到成品落地，我们助力美妆品牌创造传奇。</p>
|
||||
<a class="btn btn-primary btn-lg" href="/zh/products.php">查看护肤产品</a>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<img src="/assets/images/hero-structure.svg" class="d-block w-100" alt="护肤研发">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Products Section -->
|
||||
<section class="section-block py-5">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-5">美白系列产品</h2>
|
||||
<div class="row g-4">
|
||||
<?php foreach ($products as $product): ?>
|
||||
<div class="col-md-6 col-lg-3">
|
||||
<article class="card h-100">
|
||||
<img src="<?= htmlspecialchars($product['image']) ?>" class="card-img-top" alt="<?= htmlspecialchars($product['name']) ?>">
|
||||
<div class="card-body">
|
||||
<h3 class="h5"><?= htmlspecialchars($product['name']) ?></h3>
|
||||
<p class="text-muted small"><?= htmlspecialchars($product['summary']) ?></p>
|
||||
<a class="btn btn-outline-primary" href="/zh/product.php?id=<?= urlencode((string) $product['id']) ?>">查看详情</a>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
52
zh/news.php
Normal file
52
zh/news.php
Normal file
@ -0,0 +1,52 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | 新闻动态';
|
||||
$pageDescription = '生产进展、认证更新与交付动态。';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/news.php';
|
||||
|
||||
$newsItems = get_news($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<h1 class="display-6 fw-semibold">工厂新闻与项目动态</h1>
|
||||
<p class="text-muted">了解认证进度、交付里程碑与新品发布。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<?php foreach ($newsItems as $item): ?>
|
||||
<div class="col-lg-4">
|
||||
<article class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="text-uppercase small text-muted"><?= htmlspecialchars($item['date']) ?></div>
|
||||
<h2 class="h5 mt-2"><?= htmlspecialchars($item['title']) ?></h2>
|
||||
<p class="text-muted small"><?= htmlspecialchars($item['summary']) ?></p>
|
||||
<span class="text-muted small">如需详情请联系WhatsApp。</span>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="alert alert-light mt-4" role="alert" data-auto-dismiss="true">
|
||||
想了解项目进度？欢迎通过WhatsApp获取实时信息。
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
60
zh/product.php
Normal file
60
zh/product.php
Normal file
@ -0,0 +1,60 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$productData = get_products($lang);
|
||||
$productId = isset($_GET['id']) ? (int) $_GET['id'] : 0;
|
||||
$selected = null;
|
||||
|
||||
foreach ($productData as $product) {
|
||||
if ($product['id'] === $productId) {
|
||||
$selected = $product;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$pageTitle = $selected ? $selected['name'] . ' | ' . $site['brand'] : '产品详情 | ' . $site['brand'];
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main class="container my-5">
|
||||
<?php if (!$selected): ?>
|
||||
<div class="alert alert-warning">未找到产品。</div>
|
||||
<a class="btn btn-primary" href="/zh/products.php">返回产品</a>
|
||||
<?php else: ?>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<!-- Carousel -->
|
||||
<div id="productCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<?php foreach ($selected['images'] as $index => $img): ?>
|
||||
<div class="carousel-item <?= $index === 0 ? 'active' : '' ?>">
|
||||
<img src="<?= htmlspecialchars($img) ?>" class="d-block w-100" alt="产品图片">
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#productCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#productCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h1><?= htmlspecialchars($selected['name']) ?></h1>
|
||||
<p class="lead text-muted"><?= htmlspecialchars($selected['summary']) ?></p>
|
||||
<p><?= htmlspecialchars($selected['details']) ?></p>
|
||||
<a class="btn btn-lg btn-success" href="https://wa.me/<?= $site['whatsapp_number'] ?>?text=<?= urlencode($site['whatsapp_message']) ?>">
|
||||
WhatsApp 咨询
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
59
zh/products.php
Normal file
59
zh/products.php
Normal file
@ -0,0 +1,59 @@
|
||||
<?php
|
||||
declare(strict_types=1);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
require_once __DIR__ . '/../includes/data.php';
|
||||
|
||||
$lang = 'zh';
|
||||
$site = site_config($lang);
|
||||
$pageTitle = $site['brand'] . ' | 产品中心';
|
||||
$pageDescription = '查看工业照明产品系列与应用场景。';
|
||||
$assetVersion = (string) time();
|
||||
$navItems = $site['nav'];
|
||||
$langSwitchUrl = '/products.php';
|
||||
|
||||
$products = get_products($lang);
|
||||
?>
|
||||
<?php require __DIR__ . '/../includes/header.php'; ?>
|
||||
|
||||
<main>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<div class="hero-panel">
|
||||
<div class="row align-items-center g-4">
|
||||
<div class="col-lg-7">
|
||||
<h1 class="display-6 fw-semibold">工业照明产品矩阵</h1>
|
||||
<p class="text-muted">按行业场景配置高棚灯、投光灯、三防灯与道路照明解决方案。</p>
|
||||
</div>
|
||||
<div class="col-lg-5 text-lg-end">
|
||||
<span class="badge badge-soft"><?= count($products) ?> 个分类</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-block pt-0">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<?php foreach ($products as $product): ?>
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<article class="card h-100 product-card">
|
||||
<div class="card-body">
|
||||
<img class="product-icon" src="<?= htmlspecialchars($product['image']) ?>" alt="<?= htmlspecialchars($product['name']) ?>" width="64" height="64" />
|
||||
<h2 class="h5"><?= htmlspecialchars($product['name']) ?></h2>
|
||||
<p class="text-muted small"><?= htmlspecialchars($product['summary']) ?></p>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<a class="btn btn-sm btn-primary" href="/zh/product.php?id=<?= urlencode((string) $product['id']) ?>">查看详情</a>
|
||||
<a class="btn btn-sm btn-outline-secondary" href="/zh/contact.php">索取报价</a>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<?php require __DIR__ . '/../includes/footer.php'; ?>
|
||||
Loading…
x
Reference in New Issue
Block a user