Skip to content

Commit adaf5fc

Browse files
everettjfeverettjf
authored
Improve landing page growth conversion (#34)
1 parent 7808212 commit adaf5fc

2 files changed

Lines changed: 41 additions & 3 deletions

File tree

‎site/growth.css‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
.community > .wrap {
2+
display: grid;
3+
grid-template-columns: 1fr auto;
4+
gap: 48px;
5+
align-items: center;
6+
}
7+
8+
.community h2 {
9+
margin-bottom: 20px;
10+
}
11+
12+
.community .lede {
13+
font-size: 17px;
14+
}
15+
16+
.star-proof {
17+
display: block;
18+
padding: 22px;
19+
border: 1px solid var(--line);
20+
border-radius: 18px;
21+
background: var(--card);
22+
}
23+
24+
.star-proof img {
25+
display: block;
26+
min-width: 190px;
27+
}
28+
29+
@media (max-width: 820px) {
30+
.community > .wrap {
31+
grid-template-columns: 1fr;
32+
}
33+
34+
.star-proof {
35+
width: max-content;
36+
}
37+
}

‎site/index.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
<!doctype html>
2-
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>ScriptWidget — Native widgets with JavaScript + JSX</title><meta name="description" content="Create native iPhone, iPad, and Mac widgets with JavaScript, JSX, and ScriptWidget Studio."><link rel="canonical" href="https://xnu.app/scriptwidget/"><meta property="og:title" content="ScriptWidget"><meta property="og:description" content="Build native Apple-platform widgets with JavaScript and JSX."><meta property="og:type" content="website"><meta property="og:url" content="https://xnu.app/scriptwidget/"><meta property="og:image" content="https://raw.githubusercontent.com/everettjf/scriptwidget/main/Resource/WidgetDemoScreenshots/_contact-sheet-1.jpg"><link rel="stylesheet" href="styles.css"></head>
3-
<body><header class="wrap nav"><a class="brand" href="./">ScriptWidget</a><nav class="navlinks" aria-label="Main navigation"><a class="optional" href="#docs">Docs</a><a href="https://github.com/everettjf/scriptwidget">GitHub</a><a href="https://discord.gg/eGzEaP6TzR">Discord</a></nav></header>
2+
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>ScriptWidget — Native widgets with JavaScript + JSX</title><meta name="description" content="Create native iPhone, iPad, and Mac widgets with JavaScript, JSX, and ScriptWidget Studio."><meta name="apple-itunes-app" content="app-id=1555600758"><link rel="canonical" href="https://xnu.app/scriptwidget/"><meta property="og:title" content="ScriptWidget"><meta property="og:description" content="Build native Apple-platform widgets with JavaScript and JSX."><meta property="og:type" content="website"><meta property="og:url" content="https://xnu.app/scriptwidget/"><meta property="og:image" content="https://raw.githubusercontent.com/everettjf/scriptwidget/main/Resource/WidgetDemoScreenshots/_contact-sheet-1.jpg"><script type="application/ld+json">{"@context":"https://schema.org","@type":"SoftwareApplication","name":"ScriptWidget","applicationCategory":"DeveloperApplication","operatingSystem":"iOS, iPadOS, macOS","url":"https://xnu.app/scriptwidget/","downloadUrl":"https://apps.apple.com/us/app/scriptwidget/id1555600758","codeRepository":"https://github.com/everettjf/scriptwidget","license":"https://github.com/everettjf/scriptwidget/blob/main/LICENSE"}</script><link rel="stylesheet" href="styles.css"><link rel="stylesheet" href="growth.css"></head>
3+
<body><header class="wrap nav"><a class="brand" href="./">ScriptWidget</a><nav class="navlinks" aria-label="Main navigation"><a class="optional" href="#docs">Docs</a><a data-track-event="github_click" data-track-label="navigation" href="https://github.com/everettjf/scriptwidget">GitHub</a><a data-track-event="discord_click" data-track-label="navigation" href="https://discord.gg/eGzEaP6TzR">Discord</a></nav></header>
44
<main><section class="wrap hero"><div><div class="eyebrow">Open source · iOS · iPadOS · macOS</div><h1>Widgets, written your way.</h1><p class="lede">Write JavaScript and JSX, preview in ScriptWidget Studio, and render native WidgetKit experiences across Apple platforms—without authoring every widget in Swift.</p><div class="actions"><a class="button primary" data-track-event="app_store_click" data-track-label="hero_primary" href="https://apps.apple.com/us/app/scriptwidget/id1555600758">Get ScriptWidget ↗</a><a class="button" data-track-event="github_click" data-track-label="hero_secondary" href="https://github.com/everettjf/scriptwidget">Star on GitHub ↗</a><a class="button" data-track-event="tutorial_click" data-track-label="hero_secondary" href="https://github.com/everettjf/scriptwidget/blob/main/docs/five-minute-tutorial.md">Start in five minutes</a></div></div><div class="visual"><img src="https://raw.githubusercontent.com/everettjf/scriptwidget/main/Resource/WidgetDemoScreenshots/_contact-sheet-1.jpg" alt="A gallery of widgets created with ScriptWidget"></div></section>
55
<div class="strip"><div class="wrap"><span>JavaScriptCore runtime</span><span>Native SwiftUI rendering</span><span>Live preview on Mac</span><span>Community gallery</span></div></div>
66
<section class="section"><div class="wrap"><div class="section-label">Why ScriptWidget</div><h2>From an idea to a native widget.</h2><div class="grid"><article class="card"><h3>Write in JavaScript + JSX</h3><p>Compose familiar declarative layouts and use versioned APIs for data, files, networking, storage, device state, and more.</p></article><article class="card"><h3>Build in Studio</h3><p>Edit with diagnostics, inspect runtime output, and preview multiple widget families without repeating an Xcode build loop.</p></article><article class="card"><h3>Share real packages</h3><p>Use versioned manifests, explicit permissions, host allowlists, and the community Gallery to distribute reusable widgets.</p></article></div></div></section>
77
<section class="section"><div class="wrap"><div class="section-label">A small example</div><h2>JSX in. Native WidgetKit out.</h2><pre class="code"><code><span class="purple">$render</span>(&#10; &lt;vstack frame=<span class="pink">"max"</span> padding=<span class="pink">"16"</span> background=<span class="pink">"#171923"</span>&gt;&#10; &lt;text font=<span class="pink">"caption"</span> color=<span class="pink">"#a9b0c0"</span>&gt;Today&lt;/text&gt;&#10; &lt;text font=<span class="pink">"largeTitle"</span> color=<span class="pink">"#ffffff"</span>&gt;Build something useful.&lt;/text&gt;&#10; &lt;/vstack&gt;&#10;);</code></pre></div></section>
8-
<section class="section" id="docs"><div class="wrap"><div class="section-label">Documentation</div><h2>Explore the platform.</h2><div class="docs"><a class="doc" href="https://github.com/everettjf/scriptwidget/blob/main/docs/runtime-api.md"><strong>Runtime API →</strong><span>Rendering, storage, network, system, device, and package APIs.</span></a><a class="doc" href="https://github.com/everettjf/scriptwidget/tree/main/Shared/ScriptWidgetRuntime/Widget/Component"><strong>JSX components →</strong><span>The native components and modifiers available to scripts.</span></a><a class="doc" href="https://github.com/everettjf/scriptwidget/blob/main/docs/gallery.md"><strong>Gallery →</strong><span>Discover, verify, install, and publish community packages.</span></a></div></div></section></main>
8+
<section class="section" id="docs"><div class="wrap"><div class="section-label">Documentation</div><h2>Explore the platform.</h2><div class="docs"><a class="doc" data-track-event="docs_click" data-track-label="runtime_api" href="https://github.com/everettjf/scriptwidget/blob/main/docs/runtime-api.md"><strong>Runtime API →</strong><span>Rendering, storage, network, system, device, and package APIs.</span></a><a class="doc" data-track-event="docs_click" data-track-label="components" href="https://github.com/everettjf/scriptwidget/tree/main/Shared/ScriptWidgetRuntime/Widget/Component"><strong>JSX components →</strong><span>The native components and modifiers available to scripts.</span></a><a class="doc" data-track-event="docs_click" data-track-label="gallery" href="https://github.com/everettjf/scriptwidget/blob/main/docs/gallery.md"><strong>Gallery →</strong><span>Discover, verify, install, and publish community packages.</span></a></div></div></section>
9+
<section class="section community"><div class="wrap"><div><div class="section-label">Open source</div><h2>Build the widget platform with us.</h2><p class="lede">Star the repository to follow releases, open an issue with a real workflow, or contribute a template to the verified Gallery.</p><div class="actions"><a class="button primary" data-track-event="github_click" data-track-label="community_primary" href="https://github.com/everettjf/scriptwidget">Star ScriptWidget on GitHub ↗</a><a class="button" data-track-event="contribute_click" data-track-label="community" href="https://github.com/everettjf/scriptwidget/blob/main/CONTRIBUTING.md">Contribute</a><a class="button" data-track-event="discord_click" data-track-label="community" href="https://discord.gg/eGzEaP6TzR">Join Discord</a></div></div><a class="star-proof" data-track-event="github_click" data-track-label="star_badge" href="https://github.com/everettjf/scriptwidget/stargazers"><img src="https://img.shields.io/github/stars/everettjf/scriptwidget?style=for-the-badge&amp;label=GitHub%20stars" alt="ScriptWidget stars on GitHub"></a></div></section></main>
910
<footer class="footer"><div class="wrap"><span>Built in the open by Everett.</span><span><a href="privacy/">Privacy</a><a href="https://xnu.app/">All projects</a><a href="mailto:xnuapp@gmail.com">Support</a></span></div></footer><script src="analytics.js" defer></script></body></html>

0 commit comments

Comments
 (0)