Skip to content

Commit 61677ab

Browse files
committed
landing page links
1 parent 60aac0b commit 61677ab

File tree

5 files changed

+56
-16
lines changed

5 files changed

+56
-16
lines changed

examples/official-site/component.sql

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ where not exists (select 1 from component where name = $component);
66
-- This line, at the top of the page, tells web browsers to keep the page locally in cache once they have it.
77
select 'http_header' as component,
88
'public, max-age=600, stale-while-revalidate=3600, stale-if-error=86400' as "Cache-Control",
9-
printf('<%s>; rel="canonical"', sqlpage.link('component.sql', json_object('component', $component))) as "Link";
9+
printf('<%s>; rel="canonical"', sqlpage.link('component', json_object('component', $component))) as "Link";
1010

1111
select 'dynamic' as component, json_patch(json_extract(properties, '$[0]'), json_object(
1212
'title', coalesce($component || ' - ', '') || 'SQLPage Documentation'

examples/official-site/functions.sql

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
select 'http_header' as component,
22
printf('<%s>; rel="canonical"',
3-
iif($function is not null, sqlpage.link('functions.sql', json_object('function', $function)), 'functions.sql')
3+
iif($function is not null, sqlpage.link('functions', json_object('function', $function)), 'functions.sql')
44
) as "Link";
55

66
select 'dynamic' as component, properties

examples/official-site/performance.sql

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
select 'http_header' as component,
2+
'public, max-age=600, stale-while-revalidate=3600, stale-if-error=86400' as "Cache-Control",
3+
'<https://sql-page.com/performance>; rel="canonical"' as "Link";
4+
15
select 'dynamic' as component, properties FROM example WHERE component = 'shell' LIMIT 1;
26

37
select 'hero' as component,

examples/official-site/safety.sql

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
select 'http_header' as component,
2+
'public, max-age=600, stale-while-revalidate=3600, stale-if-error=86400' as "Cache-Control",
3+
'<https://sql-page.com/safety>; rel="canonical"' as "Link";
4+
15
select 'dynamic' as component, properties FROM example WHERE component = 'shell' LIMIT 1;
26

37
select 'hero' as component,

examples/official-site/sqlpage/templates/shell-home.handlebars

Lines changed: 46 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88

99
<meta name="viewport" content="width=device-width, initial-scale=1" />
1010
<meta property="og:title" content="SQLPage: SQL websites" />
11-
<meta name="description" content="Build interactive websites and apps with only SQL queries. SQLPage is an open-source tool to generate nice user interfaces on top of traditional databases. Maps, charts, tables, forms, and dashboards - without traditional web programming." />
11+
<meta name="description"
12+
content="Build interactive websites and apps with only SQL queries. SQLPage is an open-source tool to generate nice user interfaces on top of traditional databases. Maps, charts, tables, forms, and dashboards - without traditional web programming." />
1213
<meta property="og:description" content="Build interactive websites with only SQL queries." />
1314
<meta property="og:image" content="/sqlpage_social_preview.webp" />
1415
<meta name="twitter:image" content="/sqlpage_social_preview.webp" />
@@ -347,10 +348,6 @@
347348
transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
348349
}
349350
350-
p:hover {
351-
color: #fff;
352-
}
353-
354351
/* RESPONSIVE ADJUSTMENTS */
355352
@media (max-width: 900px) {
356353
:root {
@@ -454,6 +451,7 @@
454451
.menu a:hover {
455452
color: rgba(255, 255, 255, 0.9);
456453
opacity: 1;
454+
text-decoration: none;
457455
}
458456
459457
.menu a::after {
@@ -594,12 +592,19 @@
594592
}
595593
596594
@keyframes bounce {
597-
0%, 20%, 50%, 80%, 100% {
595+
596+
0%,
597+
20%,
598+
50%,
599+
80%,
600+
100% {
598601
transform: translateX(-50%) translateY(0);
599602
}
603+
600604
40% {
601605
transform: translateX(-50%) translateY(-6px);
602606
}
607+
603608
60% {
604609
transform: translateX(-50%) translateY(-3px);
605610
}
@@ -941,6 +946,22 @@
941946
text-decoration: none;
942947
border-bottom: 1px dotted currentColor;
943948
}
949+
950+
a {
951+
color: #f3f3fa;
952+
text-decoration: none;
953+
opacity: 0.92;
954+
font-weight: 500;
955+
transition: color 0.2s, opacity 0.2s, text-decoration 0.2s;
956+
}
957+
958+
a:hover {
959+
opacity: 1;
960+
color: #fff;
961+
text-decoration: underline;
962+
text-underline-offset: 2px;
963+
text-decoration-thickness: 1.5px;
964+
}
944965
</style>
945966
</head>
946967

@@ -968,7 +989,7 @@
968989
Plots</span><span>
969990
APIs</span></span>
970991
</h1>
971-
<p>SQL websites: simple and open-source database app builder.</p>
992+
<p>Instant web interfaces for your database. Free and open-source.</p>
972993
<a href="https://editor.datapage.app" class="cta-button">Try Online</a>
973994
</div>
974995
</div>
@@ -989,20 +1010,29 @@
9891010
<div class="feature-card">
9901011
<div class="feature-icon">📈</div>
9911012
<h3>Complete</h3>
992-
<p>Create navigatable interfaces with maps, charts, tables, forms, grids, dashboards, and more.
993-
Batteries included.</p>
1013+
<p>Create navigatable interfaces with
1014+
<a href="/component.sql?component=map">maps</a>,
1015+
<a href="/component.sql?component=chart">charts</a>,
1016+
<a href="/component.sql?component=table">tables</a>,
1017+
<a href="/component.sql?component=form">forms</a>,
1018+
<a href="/component.sql?component=card">grids</a>,
1019+
<a href="/component.sql?component=big_number">dashboards</a>, and more.
1020+
Batteries included.
1021+
</p>
9941022
</div>
9951023
<div class="feature-card">
9961024
<div class="feature-icon">⚡</div>
9971025
<h3>Fast</h3>
998-
<p>Build fast applications, quickly.
999-
Everything loads instantly, because the technology is simple and razor-sharp.</p>
1026+
<p>Build fast applications, quickly. You spend one afternoon building your first app. Then it
1027+
<a href="/performance">loads instantly</a> for everyone forever.
1028+
</p>
10001029
</div>
10011030
<div class="feature-card">
10021031
<div class="feature-icon">🎯</div>
10031032
<h3>Easy</h3>
10041033
<p>You can teach yourself enough <i>SQL</i> to query and edit a database through SQLPage in a
1005-
weekend. Focus on your data, we'll handle the rest.</p>
1034+
weekend. Focus on your data, we'll handle <a href="/performance">optimizations</a> and <a
1035+
href="/safety">security</a>.</p>
10061036
</div>
10071037
</div>
10081038
</div>
@@ -1013,7 +1043,9 @@
10131043
<div class="feature-content">
10141044
<h2 class="gradient-title">More scalable than a spreadsheet</h2>
10151045
<p>SQL queries sort, filter, and aggregate millions of rows in milliseconds. No more slow spreadsheet
1016-
formulas or memory limitations. Your app remains smooth and responsive even as your data grows.</p>
1046+
formulas or memory limitations. Your app remains <a href="/performance">smooth and responsive</a>
1047+
even
1048+
as your data grows.</p>
10171049
</div>
10181050
<div class="feature-image">
10191051
<video src="/assets/screenshots/big_tables.webm" alt="SQLPage displaying large tables" width="600"
@@ -1121,4 +1153,4 @@
11211153
</footer>
11221154
</body>
11231155

1124-
</html>
1156+
</html>

0 commit comments

Comments
 (0)