mirror of
https://github.com/screentinker/screentinker.git
synced 2026-05-15 07:32:23 -06:00
8da0e60c20
Login view:
- Remove `margin-left: calc(-1 * var(--sidebar-width))` from the
centering wrapper. It was a hack to compensate for the sidebar
offset, but app.js already zeros the app margin on the login
route. On mobile this was pushing the login card ~240px off
the left edge of the viewport.
- Use min-height + padding so the card breathes on short screens.
- Drop inline font-size:11px on the support-token input so the
global .input 16px mobile rule applies (iOS focus-zoom prevention).
app.js:
- Hide the mobile hamburger button on the login route; it has no
function there since the sidebar is already hidden.
Landing page:
- Scope the old blanket `.nav-links { display: none }` to hide only
the section anchors + secondary Sign In button, so the primary
"Start Free Trial" CTA stays visible on mobile.
- Wrap the 5-column Compare table in a horizontal-scroll container
and set min-width:560px so it scrolls instead of overflowing
the page.
- Add min-height:44px to .btn on mobile, tighten section padding
to 16px (from 24px) so content doesn't feel cramped against
the viewport edge.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
407 lines
23 KiB
HTML
407 lines
23 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- Primary SEO -->
|
|
<title>ScreenTinker - Digital Signage Software | Manage Any Screen Remotely</title>
|
|
<meta name="description" content="Free digital signage software for any screen. Remote control, video walls, multi-zone layouts, scheduling, kiosk mode, and analytics. Works on Android, Raspberry Pi, Windows, ChromeOS, and smart TVs. Start free, no credit card required.">
|
|
<meta name="keywords" content="digital signage, digital signage software, remote display, signage management, video wall, kiosk mode, screen management, content management, Android signage, Raspberry Pi signage, free digital signage">
|
|
<meta name="author" content="ScreenTinker">
|
|
<meta name="robots" content="index, follow">
|
|
<link rel="canonical" href="https://screentinker.com/">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="https://screentinker.com/">
|
|
<meta property="og:title" content="ScreenTinker - Digital Signage Made Simple">
|
|
<meta property="og:description" content="Manage content on TVs, displays, and kiosks from anywhere. Remote control, video walls, scheduling, and analytics. 9 platforms supported. Start free.">
|
|
<meta property="og:image" content="https://screentinker.com/assets/icon-512.png">
|
|
<meta property="og:site_name" content="ScreenTinker">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:title" content="ScreenTinker - Digital Signage Made Simple">
|
|
<meta name="twitter:description" content="Free digital signage software for any screen. Remote control, video walls, layouts, scheduling, kiosk mode. Works on 9 platforms.">
|
|
<meta name="twitter:image" content="https://screentinker.com/assets/icon-512.png">
|
|
|
|
<!-- Theme -->
|
|
<meta name="theme-color" content="#111827">
|
|
<link rel="icon" href="/assets/icon-192.png">
|
|
<link rel="apple-touch-icon" href="/assets/icon-192.png">
|
|
<style>
|
|
* { margin:0; padding:0; box-sizing:border-box; }
|
|
:root { --accent:#3b82f6; --bg:#111827; --card:#1e293b; --border:#334155; --text:#f1f5f9; --muted:#94a3b8; --dim:#64748b; }
|
|
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; background:var(--bg); color:var(--text); line-height:1.6; }
|
|
a { color:var(--accent); text-decoration:none; }
|
|
|
|
/* Nav */
|
|
nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(17,24,39,0.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
|
|
.nav-inner { max-width:1200px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; }
|
|
.nav-logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--accent); }
|
|
.nav-links a { color:var(--muted); margin-left:24px; font-size:14px; transition:color 0.2s; }
|
|
.nav-links a:hover { color:var(--text); }
|
|
.btn { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:8px; font-weight:600; font-size:14px; transition:all 0.2s; border:none; cursor:pointer; }
|
|
.btn-primary { background:var(--accent); color:white; }
|
|
.btn-primary:hover { background:#2563eb; }
|
|
.btn-outline { background:transparent; color:var(--accent); border:1px solid var(--accent); }
|
|
.btn-outline:hover { background:rgba(59,130,246,0.1); }
|
|
|
|
/* Hero */
|
|
.hero { padding:140px 24px 80px; text-align:center; max-width:900px; margin:0 auto; }
|
|
.hero h1 { font-size:clamp(36px,5vw,64px); font-weight:800; line-height:1.1; margin-bottom:20px; }
|
|
.hero h1 span { background:linear-gradient(135deg,#3b82f6,#8b5cf6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
|
|
.hero p { font-size:clamp(16px,2vw,20px); color:var(--muted); max-width:600px; margin:0 auto 32px; }
|
|
.hero-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
|
|
.hero-badge { display:inline-block; background:var(--card); border:1px solid var(--border); border-radius:20px; padding:6px 16px; font-size:13px; color:var(--muted); margin-bottom:24px; }
|
|
|
|
/* Screenshot */
|
|
.screenshot { max-width:1100px; margin:0 auto 80px; padding:0 24px; }
|
|
.screenshot img, .screenshot .mock { width:100%; border-radius:12px; border:1px solid var(--border); box-shadow:0 20px 60px rgba(0,0,0,0.5); }
|
|
.mock { background:var(--card); aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; color:var(--dim); font-size:18px; }
|
|
|
|
/* Features */
|
|
.features { max-width:1200px; margin:0 auto; padding:80px 24px; }
|
|
.features h2 { text-align:center; font-size:36px; margin-bottom:12px; }
|
|
.features .subtitle { text-align:center; color:var(--muted); margin-bottom:48px; font-size:18px; }
|
|
.feature-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
|
|
.feature-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:28px; transition:border-color 0.2s; }
|
|
.feature-card:hover { border-color:var(--accent); }
|
|
.feature-icon { font-size:32px; margin-bottom:12px; }
|
|
.feature-card h3 { font-size:18px; margin-bottom:8px; }
|
|
.feature-card p { color:var(--muted); font-size:14px; }
|
|
|
|
/* Platforms */
|
|
.platforms { max-width:1200px; margin:0 auto; padding:80px 24px; text-align:center; }
|
|
.platforms h2 { font-size:36px; margin-bottom:12px; }
|
|
.platforms .subtitle { color:var(--muted); margin-bottom:40px; font-size:18px; }
|
|
.platform-grid { display:flex; justify-content:center; gap:32px; flex-wrap:wrap; }
|
|
.platform-item { text-align:center; width:100px; }
|
|
.platform-item .icon { font-size:40px; margin-bottom:8px; }
|
|
.platform-item .name { font-size:13px; color:var(--muted); }
|
|
|
|
/* Pricing */
|
|
.pricing { max-width:1200px; margin:0 auto; padding:80px 24px; }
|
|
.pricing h2 { text-align:center; font-size:36px; margin-bottom:12px; }
|
|
.pricing .subtitle { text-align:center; color:var(--muted); margin-bottom:48px; font-size:18px; }
|
|
.pricing-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
|
|
.price-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:28px; position:relative; }
|
|
.price-card.featured { border-color:var(--accent); }
|
|
.price-card.featured::before { content:'Most Popular'; position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--accent); color:white; padding:4px 16px; border-radius:12px; font-size:12px; font-weight:600; }
|
|
.price-card h3 { font-size:20px; margin-bottom:4px; }
|
|
.price-card .price { font-size:36px; font-weight:700; color:var(--accent); margin:12px 0; }
|
|
.price-card .price span { font-size:16px; color:var(--muted); font-weight:400; }
|
|
.price-card .yearly { font-size:12px; color:var(--dim); margin-bottom:16px; }
|
|
.price-card ul { list-style:none; margin-bottom:20px; }
|
|
.price-card li { font-size:14px; color:var(--muted); padding:4px 0; }
|
|
.price-card li::before { content:'✓ '; color:var(--accent); }
|
|
|
|
/* Compare */
|
|
.compare { max-width:1000px; margin:0 auto; padding:80px 24px; }
|
|
.compare h2 { text-align:center; font-size:36px; margin-bottom:40px; }
|
|
.compare-table { width:100%; border-collapse:collapse; font-size:14px; }
|
|
.compare-table th, .compare-table td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); }
|
|
.compare-table th { color:var(--dim); font-weight:500; }
|
|
.compare-table td:first-child { color:var(--muted); }
|
|
.compare-table .yes { color:#22c55e; }
|
|
.compare-table .no { color:#ef4444; }
|
|
.compare-table .paid { color:#f59e0b; }
|
|
|
|
/* CTA */
|
|
.cta { text-align:center; padding:80px 24px; background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(139,92,246,0.1)); border-top:1px solid var(--border); border-bottom:1px solid var(--border); margin:80px 0; }
|
|
.cta h2 { font-size:36px; margin-bottom:12px; }
|
|
.cta p { color:var(--muted); margin-bottom:24px; font-size:18px; }
|
|
|
|
/* Footer */
|
|
footer { max-width:1200px; margin:0 auto; padding:40px 24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; border-top:1px solid var(--border); }
|
|
footer .links a { color:var(--dim); margin-left:16px; font-size:13px; }
|
|
|
|
/* Horizontal-scroll wrapper for wide tables on mobile */
|
|
.table-scroll { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
|
|
|
|
@media (max-width:768px) {
|
|
/* Hide section anchor links + the secondary Sign In button; keep primary CTA */
|
|
.nav-links a:not(.btn), .nav-links a.btn-outline { display:none; }
|
|
.nav-links { margin-left:auto; }
|
|
.nav-inner { padding:12px 16px; }
|
|
|
|
.feature-grid { grid-template-columns:1fr; }
|
|
.pricing-grid { grid-template-columns:1fr; }
|
|
.compare-table { font-size:12px; min-width:560px; }
|
|
.compare-table th, .compare-table td { padding:8px; }
|
|
footer { flex-direction:column; text-align:center; }
|
|
|
|
/* 44px tap targets for all buttons on mobile */
|
|
.btn { min-height:44px; }
|
|
.hero { padding:110px 16px 60px; }
|
|
.features, .platforms, .pricing, .compare { padding:60px 16px; }
|
|
.cta { padding:60px 16px; }
|
|
.screenshot { padding:0 16px; margin-bottom:60px; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<nav>
|
|
<div class="nav-inner">
|
|
<div class="nav-logo">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
|
|
ScreenTinker
|
|
</div>
|
|
<div class="nav-links">
|
|
<a href="#features">Features</a>
|
|
<a href="#platforms">Platforms</a>
|
|
<a href="#pricing">Pricing</a>
|
|
<a href="#compare">Compare</a>
|
|
<a href="/app" class="btn btn-outline" style="margin-left:16px">Sign In</a>
|
|
<a href="/app#/login" class="btn btn-primary" style="margin-left:8px">Start Free Trial</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero -->
|
|
<section class="hero">
|
|
<div class="hero-badge">⚡ 14-day free Pro trial · No credit card required</div>
|
|
<h1>Digital Signage<br>for <span>Any Screen</span></h1>
|
|
<p>Manage content on TVs, displays, and kiosks from anywhere. Remote control, video walls, scheduling, and analytics. Works on any device.</p>
|
|
<div class="hero-btns">
|
|
<a href="/app#/login" class="btn btn-primary" style="padding:14px 28px;font-size:16px">Start Free Trial</a>
|
|
<a href="#compare" class="btn btn-outline" style="padding:14px 28px;font-size:16px">See How We Compare</a>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Screenshot placeholder -->
|
|
<div class="screenshot">
|
|
<div class="mock">
|
|
<iframe src="#/" style="width:100%;height:100%;border:none;border-radius:12px;pointer-events:none" loading="lazy"></iframe>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Features -->
|
|
<section class="features" id="features">
|
|
<h2>Everything You Need</h2>
|
|
<p class="subtitle">One platform to manage all your digital signage</p>
|
|
<div class="feature-grid">
|
|
<div class="feature-card"><div class="feature-icon">📺</div><h3>Multi-Zone Layouts</h3><p>Split screens into zones with a drag-and-drop editor. 7 built-in templates or create your own.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🎬</div><h3>Video Wall</h3><p>Combine multiple displays into one giant screen. Automatic bezel compensation. Any grid size.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🖥</div><h3>Remote Control</h3><p>See what's on screen in real-time. Send key presses, navigate menus, power on/off remotely.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">📅</div><h3>Scheduling</h3><p>Visual weekly calendar. Set content to play at specific times with recurrence rules.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🔧</div><h3>Content Designer</h3><p>Built-in editor with live clocks, weather, RSS tickers, countdowns, QR codes, and more.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🖱</div><h3>Kiosk Mode</h3><p>Create interactive touchscreen interfaces. Wayfinding, directories, check-in screens.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">📊</div><h3>Proof-of-Play</h3><p>Track what played, when, and on which device. Export CSV reports for ad verification.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🔔</div><h3>Alerts & Monitoring</h3><p>Email alerts when devices go offline. Full telemetry: battery, storage, WiFi, uptime.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🔒</div><h3>Self-Hosted Option</h3><p>Deploy on your own infrastructure. Your data never leaves your network. Full control.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🎨</div><h3>White Label</h3><p>Custom branding, colors, logo, and domain. Resell under your own brand.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">👥</div><h3>Teams</h3><p>Multi-user accounts with owner, editor, and viewer roles. Invite by email.</p></div>
|
|
<div class="feature-card"><div class="feature-icon">🔄</div><h3>Auto-Update</h3><p>Devices automatically update when you push a new version. Zero manual intervention.</p></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Platforms -->
|
|
<section class="platforms" id="platforms">
|
|
<h2>Runs on Everything</h2>
|
|
<p class="subtitle">No hardware lock-in. Use any screen you already have.</p>
|
|
<div class="platform-grid">
|
|
<div class="platform-item"><div class="icon">🤖</div><div class="name">Android TV</div></div>
|
|
<div class="platform-item"><div class="icon">🔥</div><div class="name">Fire TV</div></div>
|
|
<div class="platform-item"><div class="icon">🥏</div><div class="name">Raspberry Pi</div></div>
|
|
<div class="platform-item"><div class="icon">💻</div><div class="name">Windows</div></div>
|
|
<div class="platform-item"><div class="icon">🌐</div><div class="name">ChromeOS</div></div>
|
|
<div class="platform-item"><div class="icon">📺</div><div class="name">LG webOS</div></div>
|
|
<div class="platform-item"><div class="icon">📺</div><div class="name">Samsung Tizen</div></div>
|
|
<div class="platform-item"><div class="icon">🌎</div><div class="name">Any Browser</div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Pricing -->
|
|
<section class="pricing" id="pricing">
|
|
<h2>Simple, Honest Pricing</h2>
|
|
<p class="subtitle">All plans include remote control, monitoring, and unlimited content</p>
|
|
<div class="pricing-grid" id="pricingGrid"></div>
|
|
</section>
|
|
|
|
<!-- Compare -->
|
|
<section class="compare" id="compare">
|
|
<h2>How We Compare</h2>
|
|
<div class="table-scroll">
|
|
<table class="compare-table">
|
|
<thead><tr><th></th><th style="color:var(--accent);font-weight:700">ScreenTinker</th><th>Yodeck</th><th>ScreenCloud</th><th>OptiSigns</th></tr></thead>
|
|
<tbody>
|
|
<tr><td>Price (15 devices/yr)</td><td style="color:var(--accent);font-weight:600">$989</td><td>$1,440+</td><td>$3,600+</td><td>$1,800+</td></tr>
|
|
<tr><td>Free tier</td><td class="yes">✓ 1 device</td><td class="yes">✓</td><td class="no">✗</td><td class="yes">✓</td></tr>
|
|
<tr><td>Platforms</td><td class="yes">9 platforms</td><td>2</td><td>2</td><td>3</td></tr>
|
|
<tr><td>Video Wall</td><td class="yes">✓ Included</td><td class="no">✗</td><td class="no">✗</td><td class="paid">Paid add-on</td></tr>
|
|
<tr><td>Remote Control</td><td class="yes">✓ All plans</td><td class="paid">Paid add-on</td><td class="no">✗</td><td class="no">✗</td></tr>
|
|
<tr><td>Content Designer</td><td class="yes">✓ Built-in</td><td class="no">✗</td><td class="no">✗</td><td class="no">✗</td></tr>
|
|
<tr><td>Kiosk/Touchscreen</td><td class="yes">✓ Included</td><td class="no">✗</td><td class="no">✗</td><td class="no">✗</td></tr>
|
|
<tr><td>Proof-of-Play</td><td class="yes">✓ All plans</td><td class="paid">Paid tier</td><td class="paid">Paid</td><td class="paid">Paid</td></tr>
|
|
<tr><td>Self-Hosted</td><td class="yes">✓ Only us</td><td class="no">✗</td><td class="no">✗</td><td class="no">✗</td></tr>
|
|
<tr><td>White Label</td><td class="yes">✓ Included</td><td class="paid">Paid</td><td class="paid">Enterprise</td><td class="no">✗</td></tr>
|
|
<tr><td>Email Alerts</td><td class="yes">✓ All plans</td><td class="paid">Paid</td><td class="paid">Paid</td><td class="paid">Paid</td></tr>
|
|
<tr><td>Hardware Lock-in</td><td class="yes">None</td><td>RPi focused</td><td>Chromecast</td><td>Various</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="cta">
|
|
<h2>Ready to Get Started?</h2>
|
|
<p>14-day free Pro trial. No credit card required. Set up in under 5 minutes.</p>
|
|
<a href="/app#/login" class="btn btn-primary" style="padding:14px 32px;font-size:16px">Start Free Trial</a>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer>
|
|
<div style="color:var(--dim);font-size:13px">© 2026 ScreenTinker. All rights reserved.</div>
|
|
<div class="links">
|
|
<a href="/legal/terms.html">Terms</a>
|
|
<a href="/legal/privacy.html">Privacy</a>
|
|
<a href="/legal/third-party.html">Licenses</a>
|
|
<a href="/api/status" target="_blank">Status</a>
|
|
<a href="/app#/login">Sign In</a>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Structured Data for Google -->
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "SoftwareApplication",
|
|
"name": "ScreenTinker",
|
|
"applicationCategory": "BusinessApplication",
|
|
"operatingSystem": "Android, Web, Windows, Linux, ChromeOS",
|
|
"description": "Digital signage management software with remote control, video walls, multi-zone layouts, scheduling, kiosk mode, and analytics. Works on 9 platforms.",
|
|
"url": "https://screentinker.com",
|
|
"offers": [
|
|
{
|
|
"@type": "Offer",
|
|
"price": "0",
|
|
"priceCurrency": "USD",
|
|
"name": "Free",
|
|
"description": "1 device, 500MB storage"
|
|
},
|
|
{
|
|
"@type": "Offer",
|
|
"price": "39",
|
|
"priceCurrency": "USD",
|
|
"priceValidUntil": "2027-12-31",
|
|
"name": "Starter",
|
|
"description": "5 devices, 5GB storage, remote URL streaming"
|
|
},
|
|
{
|
|
"@type": "Offer",
|
|
"price": "99",
|
|
"priceCurrency": "USD",
|
|
"priceValidUntil": "2027-12-31",
|
|
"name": "Pro",
|
|
"description": "15 devices, 20GB storage, all features"
|
|
}
|
|
],
|
|
"aggregateRating": {
|
|
"@type": "AggregateRating",
|
|
"ratingValue": "4.8",
|
|
"ratingCount": "50"
|
|
},
|
|
"featureList": [
|
|
"Multi-zone screen layouts",
|
|
"Video wall support",
|
|
"Remote control with live view",
|
|
"Content scheduling with calendar",
|
|
"Built-in content designer",
|
|
"Interactive kiosk/touchscreen mode",
|
|
"Proof-of-play analytics",
|
|
"Device monitoring and alerts",
|
|
"White-label/reseller support",
|
|
"Self-hosted option",
|
|
"9 platform support",
|
|
"Auto-update OTA"
|
|
]
|
|
}
|
|
</script>
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "Organization",
|
|
"name": "ScreenTinker",
|
|
"url": "https://screentinker.com",
|
|
"logo": "https://screentinker.com/assets/icon-512.png",
|
|
"sameAs": []
|
|
}
|
|
</script>
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "FAQPage",
|
|
"mainEntity": [
|
|
{
|
|
"@type": "Question",
|
|
"name": "What platforms does ScreenTinker support?",
|
|
"acceptedAnswer": {
|
|
"@type": "Answer",
|
|
"text": "ScreenTinker works on Android TV, Fire TV, Raspberry Pi, Windows, ChromeOS, LG webOS, Samsung Tizen, and any device with a web browser."
|
|
}
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Is there a free plan?",
|
|
"acceptedAnswer": {
|
|
"@type": "Answer",
|
|
"text": "Yes, ScreenTinker offers a free plan with 1 device and 500MB of storage. New accounts also get a 14-day free trial of the Pro plan with 15 devices."
|
|
}
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Can I self-host ScreenTinker?",
|
|
"acceptedAnswer": {
|
|
"@type": "Answer",
|
|
"text": "Yes, ScreenTinker is the only digital signage platform that offers a self-hosted option. Deploy on your own infrastructure and keep all data on your network."
|
|
}
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Does ScreenTinker support video walls?",
|
|
"acceptedAnswer": {
|
|
"@type": "Answer",
|
|
"text": "Yes, you can combine multiple displays into a single video wall with automatic bezel compensation. Configure any grid size (2x2, 3x3, etc.)."
|
|
}
|
|
}
|
|
]
|
|
}
|
|
</script>
|
|
|
|
<script>
|
|
// Load pricing from API
|
|
fetch('/api/subscription/plans').then(r => r.json()).then(plans => {
|
|
const grid = document.getElementById('pricingGrid');
|
|
grid.innerHTML = plans.filter(p => p.active).map((p, i) => `
|
|
<div class="price-card ${i === 2 ? 'featured' : ''}">
|
|
<h3>${p.display_name}</h3>
|
|
<div class="price">${p.price_monthly > 0 ? '$' + p.price_monthly : 'Free'}<span>${p.price_monthly > 0 ? '/mo' : ''}</span></div>
|
|
${p.price_yearly > 0 ? `<div class="yearly">or $${p.price_yearly}/year (save ${Math.round((1 - p.price_yearly / (p.price_monthly * 12)) * 100)}%)</div>` : '<div class="yearly"> </div>'}
|
|
<ul>
|
|
<li>${p.max_devices === -1 ? 'Unlimited' : p.max_devices} device${p.max_devices !== 1 ? 's' : ''}</li>
|
|
<li>${p.max_storage_mb === -1 ? 'Unlimited' : p.max_storage_mb >= 1024 ? (p.max_storage_mb / 1024) + ' GB' : p.max_storage_mb + ' MB'} storage</li>
|
|
<li>Remote control & live view</li>
|
|
${p.remote_url ? '<li>Remote URL streaming</li>' : ''}
|
|
${p.priority_support ? '<li>Priority support</li>' : ''}
|
|
</ul>
|
|
<a href="/app#/login" class="btn ${i === 0 ? 'btn-outline' : 'btn-primary'}" style="width:100%;justify-content:center">${p.price_monthly > 0 ? 'Start Trial' : 'Get Started'}</a>
|
|
</div>
|
|
`).join('');
|
|
});
|
|
|
|
// Smooth scroll for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(a => {
|
|
if (a.getAttribute('href').startsWith('#/')) return; // Skip app routes
|
|
a.addEventListener('click', e => {
|
|
const target = document.querySelector(a.getAttribute('href'));
|
|
if (target) { e.preventDefault(); target.scrollIntoView({ behavior: 'smooth' }); }
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|