feat: Passwordless cross-device authentication

- Arkitektur: docs/auth/passwordless-architecture.md
- Backend: iom/quixzoom-auth-service/ (FastAPI + Redis)
- Webb: quixzoom-market-pages/se/login/ (QR-kod + polling)
- App: iom/quixzoom-app/src/features/auth/ (push + deep links)

Flöde: QR-kod → app-godkännande → webb-inloggad
This commit is contained in:
Bernt
2026-07-07 07:11:50 +00:00
parent 4aa984ad74
commit 6989a98d75
61843 changed files with 5491611 additions and 872231 deletions
+79
View File
@@ -0,0 +1,79 @@
# quiXzoom Asia — Multilingual Landing Pages
## Overview
Regional hub for quiXzoom in Asia with support for 9 languages.
## Languages
| Language | Code | URL | Currency |
|----------|------|-----|----------|
| Simplified Chinese | zh-CN | quixzoom.asia/zh-cn/ | CNY |
| Traditional Chinese | zh-TW | quixzoom.asia/zh-tw/ | TWD |
| Japanese | ja | quixzoom.asia/ja/ | JPY |
| Korean | ko | quixzoom.asia/ko/ | KRW |
| Thai | th | quixzoom.asia/th/ | THB |
| Vietnamese | vi | quixzoom.asia/vi/ | VND |
| Indonesian | id | quixzoom.asia/id/ | IDR |
| Malay | ms | quixzoom.asia/ms/ | MYR |
| Hindi | hi | quixzoom.asia/hi/ | INR |
## Structure
```
quixzoom-asia-pages/
├── index.html # Language selector (root)
├── zh-cn/
│ └── index.html # Simplified Chinese
├── zh-tw/
│ └── index.html # Traditional Chinese
├── ja/
│ └── index.html # Japanese
├── ko/
│ └── index.html # Korean
├── th/
│ └── index.html # Thai
├── vi/
│ └── index.html # Vietnamese
├── id/
│ └── index.html # Indonesian
├── ms/
│ └── index.html # Malay
├── hi/
│ └── index.html # Hindi
├── favicon.svg # quiXzoom favicon
└── apple-touch-icon.svg # iOS icon
```
## SEO
- Proper hreflang tags for all languages
- Canonical URLs per language
- Localized meta descriptions
- Schema.org structured data ready
## Deployment
```bash
# Update CloudFront distribution ID in deploy.sh
# Run deployment
./deploy.sh
```
## Notes
- All pages use quiXzoom brand colors (dark theme, blue accent)
- Responsive design for mobile-first
- SVG icons only (no emojis)
- Localized currency displays
- Links to main registration at quixzoom.com
## Next Steps
1. [ ] Update CloudFront distribution ID in deploy.sh
2. [ ] Configure S3 bucket for static hosting
3. [ ] Set up DNS for quixzoom.asia
4. [ ] Add Google Analytics / tracking
5. [ ] Localize images and hero content
6. [ ] Add local payment methods (Alipay, WeChat Pay, etc.)
7. [ ] Create localized FAQ pages
+16
View File
@@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 180 180">
<defs>
<linearGradient id="qz-bg" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0A0A0A"/>
<stop offset="100%" stop-color="#1A1A1A"/>
</linearGradient>
<linearGradient id="qz-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0066FF"/>
<stop offset="100%" stop-color="#0052CC"/>
</linearGradient>
</defs>
<rect width="180" height="180" rx="40" fill="url(#qz-bg)"/>
<circle cx="90" cy="90" r="56" fill="none" stroke="url(#qz-accent)" stroke-width="11"/>
<circle cx="90" cy="90" r="28" fill="url(#qz-accent)"/>
<circle cx="126" cy="54" r="8" fill="#FF3366"/>
</svg>

After

Width:  |  Height:  |  Size: 724 B

+54
View File
@@ -0,0 +1,54 @@
#!/bin/bash
# Deploy quiXzoom Asia pages to S3
# Requires: AWS CLI configured with appropriate credentials
set -e
BUCKET="quixzoom-asia"
REGION="ap-southeast-1"
DISTRIBUTION_ID="E1234567890ABC" # Update with actual CloudFront distribution ID
echo "=== quiXzoom Asia Deployment ==="
echo "Bucket: $BUCKET"
echo "Region: $REGION"
echo ""
# Sync all language pages
echo "Uploading language pages..."
aws s3 sync . s3://$BUCKET/ \
--exclude "*.sh" \
--exclude "*.md" \
--exclude ".git/*" \
--cache-control "max-age=3600" \
--region $REGION
# Set content types for HTML files
echo "Setting content types..."
aws s3 cp s3://$BUCKET/ s3://$BUCKET/ \
--recursive \
--exclude "*" \
--include "*.html" \
--content-type "text/html; charset=utf-8" \
--metadata-directive REPLACE \
--region $REGION
# Set content type for SVG
echo "Setting SVG content types..."
aws s3 cp s3://$BUCKET/ s3://$BUCKET/ \
--recursive \
--exclude "*" \
--include "*.svg" \
--content-type "image/svg+xml" \
--metadata-directive REPLACE \
--region $REGION
# Invalidate CloudFront cache
echo "Invalidating CloudFront cache..."
aws cloudfront create-invalidation \
--distribution-id $DISTRIBUTION_ID \
--paths "/*" \
--region $REGION
echo ""
echo "=== Deployment Complete ==="
echo "https://quixzoom.asia/"
+19
View File
@@ -0,0 +1,19 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<defs>
<linearGradient id="qz-bg" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0A0A0A"/>
<stop offset="100%" stop-color="#1A1A1A"/>
</linearGradient>
<linearGradient id="qz-accent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0066FF"/>
<stop offset="100%" stop-color="#0052CC"/>
</linearGradient>
</defs>
<!-- Background -->
<rect width="512" height="512" rx="128" fill="url(#qz-bg)"/>
<!-- Camera lens shape -->
<circle cx="256" cy="256" r="160" fill="none" stroke="url(#qz-accent)" stroke-width="32"/>
<circle cx="256" cy="256" r="80" fill="url(#qz-accent)"/>
<!-- QuiXzoom dot -->
<circle cx="360" cy="152" r="24" fill="#FF3366"/>
</svg>

After

Width:  |  Height:  |  Size: 807 B

+149
View File
@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="hi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — दुनिया को कैप्चर करें। पैसे कमाएं। | Zoomer बनें</title>
<meta name="description" content="quiXzoom आपको इंफ्रास्ट्रक्चर, प्रकृति और शहरी वातावरण की तस्वीरें लेने के लिए पैसे देता है। कोई प्लेटफॉर्म शुल्क नहीं। अगस्त 2026 में लॉन्च।">
<link rel="canonical" href="https://quixzoom.asia/hi/">
<link rel="alternate" hreflang="hi" href="https://quixzoom.asia/hi/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Noto Sans Devanagari', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/hi/" class="active">हिन्दी</a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1>दुनिया को कैप्चर करें।<br>पैसे कमाएं।</h1>
<p>quiXzoom आपको इंफ्रास्ट्रक्चर, प्राकृतिक वातावरण और शहरी दृश्यों की तस्वीरें लेने के लिए पैसे देता है। कोई प्लेटफॉर्म शुल्क नहीं। स्वीकृत मिशन के लिए सीधा भुगतान।</p>
<a href="https://www.quixzoom.com/register" class="btn">Zoomer के रूप में पंजीकरण करें</a>
</section>
<section class="features">
<div class="feature">
<h3>तस्वीरें लें और कमाएं</h3>
<p>आस-पास के मिशन स्वीकार करें और निर्देशों के अनुसार तस्वीरें लें। स्वीकृत मिशन के लिए ₹500-5,000 कमाएं।</p>
</div>
<div class="feature">
<h3>त्वरित भुगतान</h3>
<p>स्वीकृति के 24 घंटे के भीतर सीधे बैंक खाते या Paytm में भुगतान।</p>
</div>
<div class="feature">
<h3>लचीला और स्वतंत्र</h3>
<p>कभी भी, कहीं भी काम करें। कोई न्यूनतम आवश्यकता नहीं, कोई शेड्यूल नहीं। आप तय करें।</p>
</div>
</section>
<div class="currency-note">
कीमतें भारतीय रुपये (INR) में दिखाई गई हैं। भुगतान के समय वर्तमान विनिमय दर पर परिवर्तित की जाएंगी।
</div>
<footer>
<p>quiXzoom Asia | सहायता: asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+149
View File
@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — Abadikan Dunia. Dapatkan Bayaran. | Jadi Zoomer</title>
<meta name="description" content="quiXzoom membayar Anda untuk memotret infrastruktur, alam, dan lingkungan perkotaan. Tanpa biaya platform. Diluncurkan Agustus 2026.">
<link rel="canonical" href="https://quixzoom.asia/id/">
<link rel="alternate" hreflang="id" href="https://quixzoom.asia/id/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/id/" class="active">Bahasa Indonesia</a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1>Abadikan Dunia.<br>Dapatkan Bayaran.</h1>
<p>quiXzoom membayar Anda untuk memotret infrastruktur, lingkungan alam, dan pemandangan kota. Tanpa biaya platform. Pembayaran langsung untuk setiap misi yang disetujui.</p>
<a href="https://www.quixzoom.com/register" class="btn">Daftar sebagai Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3>Memotret dan Menghasilkan</h3>
<p>Terima misi di dekat Anda dan potret sesuai petunjuk. Dapatkan Rp100.000-1.000.000 untuk setiap misi yang disetujui.</p>
</div>
<div class="feature">
<h3>Pembayaran Cepat</h3>
<p>Pembayaran langsung ke rekening bank atau GoPay dalam 24 jam setelah disetujui.</p>
</div>
<div class="feature">
<h3>Fleksibel dan Bebas</h3>
<p>Bekerja kapan saja, di mana saja. Tidak ada persyaratan minimum, tidak ada jadwal. Anda yang memutuskan.</p>
</div>
</section>
<div class="currency-note">
Harga ditampilkan dalam Rupiah Indonesia (IDR). Akan dikonversi sesuai kurs saat ini saat pembayaran.
</div>
<footer>
<p>quiXzoom Asia | Dukungan: asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+197
View File
@@ -0,0 +1,197 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom Asia — Capture the World. Get Paid.</title>
<meta name="description" content="quiXzoom pays you to photograph infrastructure, nature and urban environments. Available in 8 Asian languages. No platform fee.">
<link rel="canonical" href="https://quixzoom.asia/">
<link rel="alternate" hreflang="x-default" href="https://quixzoom.asia/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="zh-TW" href="https://quixzoom.asia/zh-tw/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="th" href="https://quixzoom.asia/th/">
<link rel="alternate" hreflang="vi" href="https://quixzoom.asia/vi/">
<link rel="alternate" hreflang="id" href="https://quixzoom.asia/id/">
<link rel="alternate" hreflang="ms" href="https://quixzoom.asia/ms/">
<link rel="alternate" hreflang="hi" href="https://quixzoom.asia/hi/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
min-height: 100vh;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.hero {
padding: 80px 0 60px;
text-align: center;
}
.hero h1 {
font-size: clamp(2rem, 4vw, 3.5rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 16px;
}
.hero p {
font-size: 1.125rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.language-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 16px;
padding: 40px 0;
}
.language-card {
background: rgba(255,255,255,0.05);
padding: 24px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,0.1);
text-decoration: none;
color: #fff;
transition: transform 0.2s, background 0.2s;
display: flex;
align-items: center;
gap: 16px;
}
.language-card:hover {
transform: translateY(-2px);
background: rgba(255,255,255,0.08);
}
.lang-flag {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
background: rgba(255,255,255,0.1);
}
.lang-info h3 {
font-size: 1.125rem;
margin-bottom: 4px;
}
.lang-info p {
font-size: 0.875rem;
color: rgba(255,255,255,0.6);
}
.region-note {
text-align: center;
padding: 60px 0 40px;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
</header>
<section class="hero">
<h1>Choose your language<br><br></h1>
<p>Select your preferred language to continue. quiXzoom is available in 8 Asian languages.</p>
</section>
<section class="language-grid">
<a href="/zh-cn/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3></h3>
<p>Simplified Chinese — </p>
</div>
</a>
<a href="/zh-tw/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3></h3>
<p>Traditional Chinese — /</p>
</div>
</a>
<a href="/ja/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3></h3>
<p>Japanese — </p>
</div>
</a>
<a href="/ko/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3></h3>
<p>Korean — </p>
</div>
</a>
<a href="/th/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3>ไทย</h3>
<p>Thai — ประเทศไทย</p>
</div>
</a>
<a href="/vi/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3>Tiếng Việt</h3>
<p>Vietnamese — Việt Nam</p>
</div>
</a>
<a href="/id/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3>Bahasa Indonesia</h3>
<p>Indonesian — Indonesia</p>
</div>
</a>
<a href="/ms/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3>Bahasa Melayu</h3>
<p>Malay — Malaysia/Singapore</p>
</div>
</a>
<a href="/hi/" class="language-card">
<div class="lang-flag"></div>
<div class="lang-info">
<h3>हिन्दी</h3>
<p>Hindi — भारत</p>
</div>
</a>
</section>
<div class="region-note">
<p>quiXzoom Asia covers: China, Japan, South Korea, Thailand, Vietnam, Indonesia, Malaysia, Singapore, India</p>
<p>Payments available in: CNY, JPY, KRW, THB, VND, IDR, MYR, INR</p>
</div>
<footer>
<p>quiXzoom Asia | asia@quixzoom.com</p>
<p>Part of the quiXzoom Global Network</p>
</footer>
</div>
</body>
</html>
+150
View File
@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — | Zoomer </title>
<meta name="description" content="quiXzoom 2026820">
<link rel="canonical" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.8;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2rem, 4vw, 3.5rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
letter-spacing: 0.05em;
}
.hero p {
font-size: 1.125rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.125rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.875rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/ja/" class="active"></a>
<a href="/zh-cn/"></a>
<a href="/ko/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1><br></h1>
<p>quiXzoom </p>
<a href="https://www.quixzoom.com/register" class="btn">Zoomer </a>
</section>
<section class="features">
<div class="feature">
<h3></h3>
<p> ¥1,000-10,000 </p>
</div>
<div class="feature">
<h3></h3>
<p>24 PayPay </p>
</div>
<div class="feature">
<h3></h3>
<p></p>
</div>
</section>
<div class="currency-note">
(JPY)
</div>
<footer>
<p>quiXzoom Asia | : asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+149
View File
@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — . . | Zoomer </title>
<meta name="description" content="quiXzoom , , . . 2026 8 . 20 .">
<link rel="canonical" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/ko/" class="active"></a>
<a href="/ja/"></a>
<a href="/zh-cn/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1> .<br> .</h1>
<p>quiXzoom , , . . .</p>
<a href="https://www.quixzoom.com/register" class="btn">Zoomer </a>
</section>
<section class="features">
<div class="feature">
<h3> </h3>
<p> . ₩10,000-100,000 .</p>
</div>
<div class="feature">
<h3> </h3>
<p> 24 .</p>
</div>
<div class="feature">
<h3> </h3>
<p> . , . .</p>
</div>
</section>
<div class="currency-note">
(KRW) . .
</div>
<footer>
<p>quiXzoom Asia | : asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+149
View File
@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="ms">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — Rakam Dunia. Dapatkan Bayaran. | Jadi Zoomer</title>
<meta name="description" content="quiXzoom membayar anda untuk merakam infrastruktur, alam semula jadi, dan persekitaran bandar. Tiada yuran platform. Dilancarkan Ogos 2026.">
<link rel="canonical" href="https://quixzoom.asia/ms/">
<link rel="alternate" hreflang="ms" href="https://quixzoom.asia/ms/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/ms/" class="active">Bahasa Melayu</a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1>Rakam Dunia.<br>Dapatkan Bayaran.</h1>
<p>quiXzoom membayar anda untuk merakam infrastruktur, persekitaran semula jadi, dan landskap bandar. Tiada yuran platform. Bayaran terus untuk setiap misi yang diluluskan.</p>
<a href="https://www.quixzoom.com/register" class="btn">Daftar sebagai Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3>Rakam dan Hasilkan</h3>
<p>Terima misi berhampiran dan rakam mengikut arahan. Dapatkan RM50-500 untuk setiap misi yang diluluskan.</p>
</div>
<div class="feature">
<h3>Bayaran Pantas</h3>
<p>Bayaran terus ke akaun bank atau Touch 'n Go eWallet dalam masa 24 jam selepas diluluskan.</p>
</div>
<div class="feature">
<h3>Fleksibel dan Bebas</h3>
<p>Bekerja bila-bila masa, di mana sahaja. Tiada keperluan minimum, tiada jadual. Anda memutuskan.</p>
</div>
</section>
<div class="currency-note">
Harga dipaparkan dalam Ringgit Malaysia (MYR). Akan ditukar mengikut kadar semasa semasa pembayaran.
</div>
<footer>
<p>quiXzoom Asia | Sokongan: asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+150
View File
@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — ถ่ายภาพโลก รับรายได้ | เป็น Zoomer</title>
<meta name="description" content="quiXzoom จ่ายเงินให้คุณถ่ายภาพโครงสร้างพื้นฐาน ธรรมชาติ และสภาพแวดล้อมในเมือง ไม่มีค่าธรรมเนียมแพลตฟอร์ม เปิดตัวสิงหาคม 2026">
<link rel="canonical" href="https://quixzoom.asia/th/">
<link rel="alternate" hreflang="th" href="https://quixzoom.asia/th/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Sukhumvit Set', 'Kanit', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/th/" class="active">ไทย</a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1>ถ่ายภาพโลก<br>รับรายได้</h1>
<p>quiXzoom จ่ายเงินให้คุณถ่ายภาพโครงสร้างพื้นฐาน สภาพแวดล้อมธรรมชาติ และทิวทัศน์เมือง ไม่มีค่าธรรมเนียมแพลตฟอร์ม จ่ายโดยตรงสำหรับภารกิจที่ได้รับการอนุมัติ</p>
<a href="https://www.quixzoom.com/register" class="btn">สมัครเป็น Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3>ถ่ายภาพและรับเงิน</h3>
<p>รับภารกิจใกล้เคียงและถ่ายภาพตามคำแนะนำ รับ ฿500-5,000 ต่อภารกิจที่ได้รับการอนุมัติ</p>
</div>
<div class="feature">
<h3>การจ่ายเงินที่รวดเร็ว</h3>
<p>จ่ายโดยตรงไปยังบัญชีธนาคารหรือพร้อมเพย์ภายใน 24 ชั่วโมงหลังจากได้รับการอนุมัติ</p>
</div>
<div class="feature">
<h3>ยืดหยุ่นและอิสระ</h3>
<p>ทำงานได้ทุกที่ทุกเวลา ไม่มีขั้นต่ำ ไม่มีกำหนดเวลา คุณตัดสินใจเอง</p>
</div>
</section>
<div class="currency-note">
ราคาแสดงเป็นบาทไทย (THB) จะแปลงตามอัตราแลกเปลี่ยนปัจจุบันเมื่อจ่ายเงิน
</div>
<footer>
<p>quiXzoom Asia | สนับสนุน: asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+149
View File
@@ -0,0 +1,149 @@
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — Chụp ảnh thế giới. Nhận thù lao. | Trở thành Zoomer</title>
<meta name="description" content="quiXzoom trả tiền cho bạn chụp ảnh cơ sở hạ tầng, thiên nhiên và môi trường đô thị. Không phí nền tảng. Ra mắt tháng 8 năm 2026.">
<link rel="canonical" href="https://quixzoom.asia/vi/">
<link rel="alternate" hreflang="vi" href="https://quixzoom.asia/vi/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.2;
margin-bottom: 24px;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/vi/" class="active">Tiếng Việt</a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1>Chụp ảnh thế giới.<br>Nhận thù lao.</h1>
<p>quiXzoom trả tiền cho bạn chụp ảnh cơ sở hạ tầng, môi trường tự nhiên và cảnh quan đô thị. Không phí nền tảng. Thanh toán trực tiếp cho mỗi nhiệm vụ được phê duyệt.</p>
<a href="https://www.quixzoom.com/register" class="btn">Đăng ký làm Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3>Chụp ảnh và kiếm tiền</h3>
<p>Nhận nhiệm vụ gần đó và chụp ảnh theo hướng dẫn. Nhận ₫500,000-5,000,000 cho mỗi nhiệm vụ được phê duyệt.</p>
</div>
<div class="feature">
<h3>Thanh toán nhanh chóng</h3>
<p>Thanh toán trực tiếp vào tài khoản ngân hàng hoặc MoMo trong vòng 24 giờ sau khi được phê duyệt.</p>
</div>
<div class="feature">
<h3>Linh hoạt và tự do</h3>
<p>Làm việc mọi lúc mọi nơi. Không có yêu cầu tối thiểu, không có lịch làm việc. Bạn quyết định.</p>
</div>
</section>
<div class="currency-note">
Giá được hiển thị bằng đồng Việt Nam (VND). Sẽ được chuyển đổi theo tỷ giá hiện tại khi thanh toán.
</div>
<footer>
<p>quiXzoom Asia | Hỗ trợ: asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>
+157
View File
@@ -0,0 +1,157 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — | Zoomer</title>
<meta name="description" content="quiXzoom 2026820">
<link rel="canonical" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="th" href="https://quixzoom.asia/th/">
<link rel="alternate" hreflang="vi" href="https://quixzoom.asia/vi/">
<link rel="alternate" hreflang="id" href="https://quixzoom.asia/id/">
<link rel="alternate" hreflang="ms" href="https://quixzoom.asia/ms/">
<link rel="alternate" hreflang="hi" href="https://quixzoom.asia/hi/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.1;
margin-bottom: 24px;
letter-spacing: -0.02em;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/zh-cn/" class="active"></a>
<a href="/ja/"></a>
<a href="/ko/"></a>
<a href="/th/">ไทย</a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1><br></h1>
<p>quiXzoom </p>
<a href="https://www.quixzoom.com/register" class="btn"> Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="2" y="4" width="12" height="9" rx="2" stroke="#666" stroke-width="1.5"/><circle cx="8" cy="8.5" r="2.5" stroke="#666" stroke-width="1.5"/><path d="M5 4L6 2H10L11 4" stroke="#666" stroke-width="1.5"/></svg> </h3>
<p> ¥50-500 </p>
</div>
<div class="feature">
<h3><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M9 2L5 9H8L7 14L11 7H8L9 2Z" fill="#f59e0b"/></svg> </h3>
<p> 24 </p>
</div>
<div class="feature">
<h3> </h3>
<p></p>
</div>
</section>
<div class="currency-note">
(CNY)
</div>
<footer>
<p>quiXzoom Asia | : asia@quixzoom.com</p>
<p>: </p>
</footer>
</div>
</body>
</html>
+152
View File
@@ -0,0 +1,152 @@
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>quiXzoom — | Zoomer</title>
<meta name="description" content="quiXzoom 2026820">
<link rel="canonical" href="https://quixzoom.asia/zh-tw/">
<link rel="alternate" hreflang="zh-TW" href="https://quixzoom.asia/zh-tw/">
<link rel="alternate" hreflang="zh-CN" href="https://quixzoom.asia/zh-cn/">
<link rel="alternate" hreflang="ja" href="https://quixzoom.asia/ja/">
<link rel="alternate" hreflang="ko" href="https://quixzoom.asia/ko/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang TC', 'Hiragino Sans TC', 'Microsoft JhengHei', sans-serif;
background: #0a0a0a;
color: #ffffff;
line-height: 1.6;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
header {
padding: 24px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo { font-size: 24px; font-weight: 700; color: #0066ff; }
.lang-switcher { display: flex; gap: 16px; }
.lang-switcher a {
color: rgba(255,255,255,0.6);
text-decoration: none;
font-size: 14px;
transition: color 0.2s;
}
.lang-switcher a:hover, .lang-switcher a.active { color: #fff; }
.hero {
padding: 120px 0 80px;
text-align: center;
}
.hero h1 {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.1;
margin-bottom: 24px;
letter-spacing: -0.02em;
}
.hero p {
font-size: 1.25rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 32px;
background: #0066ff;
color: #fff;
text-decoration: none;
border-radius: 12px;
font-weight: 600;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(0,102,255,0.3);
}
.features {
padding: 80px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 32px;
}
.feature {
background: rgba(255,255,255,0.05);
padding: 32px;
border-radius: 16px;
border: 1px solid rgba(255,255,255,0.1);
}
.feature h3 {
font-size: 1.25rem;
margin-bottom: 12px;
color: #fff;
}
.feature p {
color: rgba(255,255,255,0.6);
font-size: 0.9375rem;
}
.currency-note {
text-align: center;
padding: 40px 0;
color: rgba(255,255,255,0.5);
font-size: 0.875rem;
}
footer {
padding: 40px 0;
text-align: center;
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="logo">quiXzoom</div>
<nav class="lang-switcher">
<a href="/zh-tw/" class="active"></a>
<a href="/zh-cn/"></a>
<a href="/ja/"></a>
<a href="/ko/"></a>
<a href="/en/">EN</a>
</nav>
</header>
<section class="hero">
<h1><br></h1>
<p>quiXzoom </p>
<a href="https://www.quixzoom.com/register" class="btn"> Zoomer</a>
</section>
<section class="features">
<div class="feature">
<h3></h3>
<p> NT$200-2,000 </p>
</div>
<div class="feature">
<h3></h3>
<p> 24 LINE Pay</p>
</div>
<div class="feature">
<h3></h3>
<p></p>
</div>
</section>
<div class="currency-note">
(TWD)
</div>
<footer>
<p>quiXzoom Asia | : asia@quixzoom.com</p>
</footer>
</div>
</body>
</html>