Files
boc/backups/2026-07-12-1023/quixzoom-landing-prod/reviews.html
T
Bernt 58ca4e68db feat(boc): Complete Business Operations Center v1.0
- Go backend API with full CRUD for all modules (CRM, Sales, Finance, HR, Legal, Marketing, Support, Purchase, Inventory, Projects, Automation, Analytics)
- Rust analytics service with parallel report generation
- C runtime with POSIX shared memory IPC
- PostgreSQL schema with 30+ tables, full migrations
- Redis cache, sessions, pub/sub
- Kafka event streaming with Zookeeper
- WebSocket hub for real-time updates
- Automation engine with cron jobs, workflows, event triggers
- JWT authentication, multi-tenant from start
- Docker Compose with all services
- Nginx reverse proxy with rate limiting
- Integration tests passing
- Feature gap analysis against Fortnox/Odoo/Visma

Refs: BOC-001
2026-07-12 12:41:35 +00:00

321 lines
11 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="color-scheme" content="light dark">
<title>quiXzoom — Reviews & Ratings</title>
<meta name="description" content="Se vad fotografer och uppdragsgivare säger om quiXzoom — plattformen som låter dig tjäna pengar på dina foton.">
<link rel="canonical" href="https://quixzoom.com/reviews">
<link rel="stylesheet" >
<!-- schema.org Product markup — reviews will be added after launch -->
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Product",
"name": "quiXzoom",
"description": "Crowdsourced camera infrastructure — earn money on your photos as a zoomer.",
"url": "https://quixzoom.com",
"brand": { "@type": "Brand", "name": "quiXzoom" }
}
</script>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-font-smoothing: antialiased; }
body { font-family: var(--font-text); background: var(--background-secondary); color: var(--label-primary); min-height: 100vh; }
/* HERO */
.hero {
background: linear-gradient(160deg, #FF6B00 0%, #FF9500 50%, #FFCC00 100%);
padding: 72px 24px 56px;
text-align: center;
color: white;
position: relative;
overflow: hidden;
}
.hero::before {
content: '';
position: absolute;
top: -60px; right: -60px;
width: 300px; height: 300px;
border-radius: var(--radius-full);
background: rgba(255,255,255,0.08);
}
.hero::after {
content: '';
position: absolute;
bottom: -80px; left: -40px;
width: 250px; height: 250px;
border-radius: var(--radius-full);
background: rgba(255,255,255,0.06);
}
.hero-logo {
width: 80px; height: 80px;
background: rgba(255,255,255,0.2);
border-radius: var(--radius-xl);
display: flex; align-items: center; justify-content: center;
font-size: 36px; font-weight: 900;
color: white; margin: 0 auto 24px;
backdrop-filter: blur(20px);
border: 1px solid rgba(255,255,255,0.3);
position: relative; z-index: 1;
letter-spacing: -1px;
}
.hero h1 {
font-family: var(--font-display);
font-size: 38px; font-weight: 700;
letter-spacing: -1px; margin-bottom: 8px;
position: relative; z-index: 1;
}
.hero .tagline {
font-size: 17px; opacity: 0.85;
margin-bottom: 32px; position: relative; z-index: 1;
}
/* AGGREGATE RATING */
.agg-rating {
display: inline-flex; align-items: center; gap: 12px;
background: rgba(255,255,255,0.18);
backdrop-filter: blur(20px);
border: 1px solid rgba(255,255,255,0.3);
border-radius: var(--radius-xl); padding: 16px 28px;
position: relative; z-index: 1;
}
.agg-score {
font-family: var(--font-display);
font-size: 52px; font-weight: 700;
line-height: 1; color: white;
}
.agg-info { text-align: left; }
.stars { font-size: 22px; letter-spacing: 2px; margin-bottom: 4px; }
.agg-count { font-size: 14px; opacity: 0.8; }
/* SECTION */
.section { padding: 32px 20px; max-width: 960px; margin: 0 auto; }
.section-header {
display: flex; align-items: center; justify-content: space-between;
margin-bottom: 20px;
}
.section-title {
font-family: var(--font-display);
font-size: 22px; font-weight: 700; letter-spacing: -0.5px;
}
/* FILTER PILLS */
.filter-bar {
display: flex; gap: 8px; flex-wrap: wrap;
padding: 0 20px 24px; max-width: 960px; margin: 0 auto;
}
.filter-pill {
padding: 8px 16px; border-radius: 100px;
font-size: 15px; font-weight: 600;
border: 1.5px solid var(--separator);
background: var(--background-primary);
color: var(--label-secondary); cursor: pointer;
transition: all 0.2s; white-space: nowrap;
}
.filter-pill.active {
background: var(--ios-orange);
border-color: var(--ios-orange);
color: white;
}
/* REVIEW GRID */
.reviews-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 16px;
}
.review-card {
background: var(--background-primary);
border-radius: var(--radius-xl);
border: 0.5px solid var(--separator);
padding: 24px;
transition: transform 0.2s, box-shadow 0.2s;
}
.review-card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 32px rgba(0,0,0,0.08);
}
.review-top {
display: flex; align-items: flex-start;
justify-content: space-between; margin-bottom: 14px;
}
.reviewer-info { display: flex; align-items: center; gap: 12px; }
.reviewer-avatar {
width: 44px; height: 44px; border-radius: var(--radius-full);
background: linear-gradient(135deg, var(--ios-orange), var(--ios-yellow));
display: flex; align-items: center; justify-content: center;
font-size: 18px; font-weight: 700; color: white;
flex-shrink: 0;
}
.reviewer-name {
font-size: 16px; font-weight: 600; letter-spacing: -0.2px;
}
.reviewer-meta {
font-size: 13px; color: var(--label-secondary);
margin-top: 2px;
}
.review-stars { font-size: 16px; letter-spacing: 1px; }
.review-title {
font-size: 16px; font-weight: 700;
letter-spacing: -0.3px; margin-bottom: 8px;
}
.review-body {
font-size: 15px; line-height: 1.55;
color: var(--label-secondary);
}
.review-footer {
display: flex; align-items: center;
justify-content: space-between; margin-top: 16px;
}
.platform-badge {
display: flex; align-items: center; gap: 6px;
font-size: 12px; font-weight: 600;
color: var(--label-tertiary);
background: var(--background-secondary);
padding: 4px 10px; border-radius: 100px;
}
.review-date { font-size: 12px; color: var(--label-tertiary); }
/* CTA */
.cta-section {
background: linear-gradient(135deg, #FF6B00, #FF9500);
border-radius: var(--radius-xl); padding: 40px 32px;
text-align: center; margin: 0 20px 32px;
max-width: 920px; margin-left: auto; margin-right: auto;
}
.cta-section h2 {
font-family: var(--font-display);
font-size: 26px; font-weight: 700;
color: white; margin-bottom: 12px;
letter-spacing: -0.5px;
}
.cta-section p { font-size: 16px; color: rgba(255,255,255,0.8); margin-bottom: 24px; }
.cta-btn {
display: inline-block;
background: white; color: #FF6B00;
font-size: 17px; font-weight: 700;
padding: 16px 32px; border-radius: var(--radius-lg);
text-decoration: none;
transition: transform 0.15s, box-shadow 0.15s;
}
.cta-btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}
/* FOOTER */
.footer {
text-align: center; padding: 24px 20px;
color: var(--label-tertiary); font-size: 13px;
}
@media (max-width: 640px) {
.hero h1 { font-size: 2rem !important; }
.hero p { font-size: 1rem !important; }
.card { padding: 1.5rem !important; }
.grid { grid-template-columns: 1fr !important; }
.btn { padding: 0.75rem 1.5rem !important; font-size: 1rem !important; }
}
</style>
<style id="wcag-contrast-enforcement">
/* AAMOS GLOBAL CONTRAST ENFORCEMENT — WCAG AA (4.5:1 minimum) */
/* Regel: Ingen text under 70% opacity. Aldrig. */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
/* Fix common low-contrast patterns */
[style*="rgba(60,60,67,0.4)"] { color: rgba(60,60,67,0.65) !important; }
[style*="rgba(60,60,67,0.3)"] { color: rgba(60,60,67,0.65) !important; }
[style*="rgba(255,255,255,0.4)"] { color: rgba(255,255,255,0.72) !important; }
[style*="rgba(255,255,255,0.3)"] { color: rgba(255,255,255,0.72) !important; }
[style*="opacity: 0.4"] { opacity: 0.72 !important; }
[style*="opacity: 0.3"] { opacity: 0.72 !important; }
@media (max-width: 640px) {
.hero h1 { font-size: 2rem !important; }
.hero p { font-size: 1rem !important; }
.card { padding: 1.5rem !important; }
.grid { grid-template-columns: 1fr !important; }
.btn { padding: 0.75rem 1.5rem !important; font-size: 1rem !important; }
}
</style>
<meta property="og:type" content="website">
<meta property="og:title" content="quiXzoom — Reviews & Ratings">
<meta property="og:description" content="Se vad fotografer och uppdragsgivare säger om quiXzoom — plattformen som låter dig tjäna pengar på dina foton.">
<meta property="og:url" content="https://www.quixzoom.com/reviews.html">
<meta property="og:image" content="https://www.quixzoom.com/images/zoomer-earnings.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="quiXzoom Zoomer reviews — what Zoomers say about earning with quiXzoom">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://www.quixzoom.com/images/zoomer-earnings.jpg">
<meta name="twitter:title" content="quiXzoom — Reviews & Ratings">
</head>
<body>
<!-- HERO -->
<div class="hero">
<div class="hero-logo">qX</div>
<h1>quiXzoom</h1>
<p class="tagline">Earn money with your camera</p>
<div class="agg-rating">
<div class="agg-score" style="font-size:1.25rem;font-weight:700;">Coming soon</div>
<div class="agg-info">
<div class="stars" style="opacity:0;"></div>
<div class="agg-count">Reviews after launch</div>
</div>
</div>
</div>
<!-- FILTER -->
<div class="filter-bar">
<div class="filter-pill active">All</div>
</div>
<!-- REVIEWS -->
<div class="section">
<div class="section-header">
<div class="section-title">What Zoomers say</div>
</div>
<div class="reviews-grid" id="reviewsGrid">
<div class="review-card" style="text-align:center;padding:48px 24px;">
<div style="font-size:3rem;margin-bottom:16px;"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 13V10L10 3L13 6L6 13H3Z" stroke="#666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M9 4L12 7" stroke="#666" stroke-width="1.5"/></svg></div>
<h3 style="font-size:1.25rem;font-weight:700;margin-bottom:12px;color:var(--label-primary);">Reviews coming soon</h3>
<p style="color:var(--label-secondary);line-height:1.6;max-width:400px;margin:0 auto;">quiXzoom launches in August 2026. Reviews from Zoomers and mission orderers will be published here once the platform is live.</p>
</div>
</div>
</div>
<!-- CTA -->
<div class="cta-section" style="margin-bottom: 40px;">
<h2>Share your experience</h2>
<p>Have you worked as a Zoomer? Your review helps other photographers find the right platform.</p>
<a href="https://g.page/r/quixzoom/review" class="cta-btn" target="_blank" rel="noopener">Leave your review →</a>
</div>
<!-- FOOTER -->
<div class="footer">
© 2026 quiXzoom · <a href="privacy/index.html" style="color: inherit;">Privacy Policy</a> · <a href="terms/index.html" style="color: inherit;">Terms</a>
</div>
<script>
function filterReviews(platform, el) {
document.querySelectorAll('.filter-pill').forEach(p => p.classList.remove('active'));
el.classList.add('active');
document.querySelectorAll('.review-card').forEach(card => {
if (platform === 'all' || card.dataset.platform === platform) {
card.style.display = '';
} else {
card.style.display = 'none';
}
});
}
</script>
</body>
</html>