Skip to content

Commit 1f91899

Browse files
committed
feat: update deployment links and add new DeployButton component
1 parent 99b3fba commit 1f91899

14 files changed

Lines changed: 256 additions & 53 deletions

.github/workflows/release-docker.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@ jobs:
8989
type=semver,pattern={{version}}
9090
type=semver,pattern={{major}}.{{minor}}
9191
type=ref,event=tag
92-
type=raw,value=latest,enable={{is_default_branch}}
92+
type=raw,value=latest,enable=${{ startsWith(github.ref, 'refs/tags/v') }}
9393
type=sha,prefix=sha-
9494
9595
- name: Build and push image

docs/.vitepress/config.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,8 @@ export default defineConfig({
1818
siteTitle: 'StarQuery',
1919
nav: [
2020
{ text: 'Guide', link: '/guide/getting-started' },
21-
{ text: 'Deployment', link: '/deploy/docker' },
22-
{ text: 'Desktop', link: '/guide/electron' },
23-
{ text: 'Reference', link: '/reference/configuration' },
21+
{ text: 'Host it on your Server', link: '/deploy/hosted' },
22+
{ text: 'Configuration', link: '/reference/configuration' },
2423
],
2524
sidebar: {
2625
'/guide/': [
@@ -39,6 +38,7 @@ export default defineConfig({
3938
{
4039
text: 'Deployment',
4140
items: [
41+
{ text: 'Hosted', link: '/deploy/hosted' },
4242
{ text: 'Docker', link: '/deploy/docker' },
4343
{ text: 'Hosted Configuration', link: '/deploy/hosted-configuration' },
4444
],
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<script setup lang="ts">
2+
import DocsButton from './DocsButton.vue'
3+
</script>
4+
5+
<template>
6+
<DocsButton href="/deploy/self-hosted" large>
7+
Deploy with Docker
8+
</DocsButton>
9+
</template>
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<script setup lang="ts">
2+
import { computed } from 'vue'
3+
4+
const props = withDefaults(
5+
defineProps<{
6+
href?: string
7+
large?: boolean
8+
variant?: 'primary' | 'secondary'
9+
target?: string
10+
rel?: string
11+
ariaBusy?: boolean
12+
}>(),
13+
{
14+
href: '#',
15+
large: false,
16+
variant: 'primary',
17+
target: undefined,
18+
rel: undefined,
19+
ariaBusy: false,
20+
},
21+
)
22+
23+
const classes = computed(() => {
24+
const base =
25+
'inline-flex items-center justify-center whitespace-nowrap rounded-full !no-underline transition-all active:scale-95'
26+
const size = props.large ? 'px-8 py-3 !text-xl font-bold tracking-[-0.02em]' : 'px-4 py-[0.3rem] text-[0.92rem] font-bold tracking-[-0.01em]'
27+
28+
if (props.variant === 'secondary') {
29+
return [
30+
base,
31+
size,
32+
'border border-[var(--vp-c-border)] bg-[var(--vp-c-bg)] text-[var(--vp-c-default-1)] hover:border-primary-300 hover:bg-primary-50 hover:text-primary-700 dark:hover:border-primary-700 dark:hover:bg-primary-950/40 dark:hover:text-primary-200',
33+
]
34+
}
35+
36+
return [
37+
base,
38+
size,
39+
'border border-transparent bg-primary-500 !text-white hover:scale-110 hover:bg-primary-600',
40+
]
41+
})
42+
</script>
43+
44+
<template>
45+
<a
46+
:href="href"
47+
:class="classes"
48+
:target="target"
49+
:rel="rel"
50+
:aria-busy="ariaBusy ? 'true' : 'false'"
51+
>
52+
<slot />
53+
</a>
54+
</template>

docs/.vitepress/theme/components/HomeScreenshotShowcase.vue

Lines changed: 23 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,8 @@
11
<template>
22
<section class="mt-10 grid items-center gap-8 pt-2 md:grid-cols-[minmax(0,1fr)_minmax(0,1.15fr)]">
33
<div>
4-
<div class="mb-4 text-[0.78rem] font-bold uppercase tracking-[0.16em] ">
5-
Product Preview
6-
</div>
7-
<h2 class="mb-4 text-[clamp(1.9rem,3vw,3rem)] leading-[1.02] tracking-[-0.05em] ">
8-
Built for real data work, without looking like a generic admin panel.
4+
<h2 class="mb-4 text-[clamp(1.9rem,3vw,3rem)] leading-[1.02] tracking-[-0.05em] !border-t-0 !pt-0">
5+
Manage your favorite Databases - With the App or on a Server with the Web Panel
96
</h2>
107
<p class="m-0 ">
118
StarQuery combines dense operational workflows with a calmer interface language. The goal
@@ -14,29 +11,34 @@
1411

1512
<div class="mt-5 grid gap-4">
1613
<div
17-
class="grid gap-1 rounded-[18px] border border-[var(--vp-c-border)] bg-[linear-gradient(180deg,var(--vp-c-bg),var(--vp-c-bg-soft))] px-4 py-4"
18-
>
19-
<strong class="text-[0.98rem] tracking-[-0.02em] ">One consistent workspace</strong>
20-
<span>Queries, browsers, editors, exports and admin workflows follow the same design logic.</span>
21-
</div>
22-
<div
23-
class="grid gap-1 rounded-[18px] border border-[var(--vp-c-border)] bg-[linear-gradient(180deg,var(--vp-c-bg),var(--vp-c-bg-soft))] px-4 py-4"
24-
>
25-
<strong class="text-[0.98rem] tracking-[-0.02em] ">Dense, but readable</strong>
26-
<span>Power features stay accessible without collapsing into noisy, cramped tooling.</span>
27-
</div>
28-
<div
29-
class="grid gap-1 rounded-[18px] border border-[var(--vp-c-border)] bg-[linear-gradient(180deg,var(--vp-c-bg),var(--vp-c-bg-soft))] px-4 py-4"
14+
class="grid gap-1 rounded-[18px] border border-[var(--vp-c-border)] px-4 py-4"
15+
v-for="item of [
16+
{
17+
title: 'Browse Tables',
18+
description:
19+
'Browse your tables and their contents with ease. No more jumping back and forth between your databases.',
20+
},
21+
{
22+
title: 'SQL Editor',
23+
description:
24+
'Write and run SQL queries directly in the app. Get instant feedback and see your results in a clear, organized way.',
25+
},
26+
{
27+
title: 'Host it on your Server',
28+
description:
29+
'Still using PHPMyAdmin or Adminer? Host StarQuery on your server and give your team a more modern, user-friendly way to manage your databases.',
30+
}
31+
]"
3032
>
31-
<strong class="text-[0.98rem] tracking-[-0.02em] ">Use it solo or with a team</strong>
32-
<span>The same experience works for quick local sessions and for shared, browser-based deployments.</span>
33+
<strong class="text-[0.98rem] tracking-[-0.02em] ">{{ item.title }}</strong>
34+
<span>{{ item.description }}</span>
3335
</div>
3436
</div>
3537
</div>
3638

3739
<div class="relative">
3840
<img
39-
class="block h-auto w-full drop-shadow-[0_30px_80px_rgba(17,24,39,0.14)]"
41+
class="block h-auto w-full"
4042
src="/screenshot.png"
4143
alt="StarQuery screenshot"
4244
/>

docs/.vitepress/theme/components/InstallNavButton.vue

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script setup lang="ts">
22
import { computed, onMounted, ref } from 'vue'
3+
import DocsButton from './DocsButton.vue'
34
45
type PlatformTarget = 'macOS' | 'Windows' | 'Linux'
56
@@ -124,14 +125,13 @@ onMounted(() => {
124125
</script>
125126

126127
<template>
127-
<a
128+
<DocsButton
128129
:href="downloadUrl"
129-
class="whitespace-nowrap rounded-full border border-transparent bg-primary-500 hover:bg-primary-600 hover:scale-110 active:scale-95 transition-all text-[0.92rem] font-bold tracking-[-0.01em] !text-white !no-underline md:inline-flex md:items-center md:justify-center"
130-
:class="large ? '!text-xl py-3 px-8' : 'py-[0.3rem] px-4'"
130+
:large="large"
131131
target="_blank"
132132
rel="noreferrer"
133-
:aria-busy="isLoading ? 'true' : 'false'"
133+
:aria-busy="isLoading"
134134
>
135135
{{ label }}
136-
</a>
136+
</DocsButton>
137137
</template>
Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<script setup lang="ts">
2+
import { computed, ref, watch } from 'vue'
3+
import { useData } from 'vitepress'
4+
import InstallNavButton from './InstallNavButton.vue'
5+
import { codeToHtml } from 'shiki'
6+
7+
const { isDark } = useData()
8+
9+
const screenshotSrc = computed(() => (isDark.value ? '/screenshot-selfhosted.png' : '/screenshot-selfhosted-light.png'))
10+
const logoOutlineSrc = computed(() =>
11+
isDark.value ? '/logo-part-outline.svg' : '/logo-part-outline-dark.svg',
12+
)
13+
14+
const html = ref('')
15+
16+
watch(isDark, async () => {
17+
html.value = await codeToHtml(
18+
`docker run -d \\
19+
--name starquery \\
20+
-p 8080:8080 \\
21+
--add-host=host.docker.internal:host-gateway \\
22+
-v starquery-data:/var/lib/starquery \\
23+
--restart unless-stopped \\
24+
interaapps/starquery`,
25+
{
26+
lang: 'bash',
27+
theme: isDark.value ? 'github-dark' : 'github-light',
28+
},
29+
)
30+
}, {immediate: true})
31+
32+
</script>
33+
<template>
34+
<div class="flex flex-col items-center py-20 lg:py-30">
35+
<div class="flex flex-col gap-10 items-center relative z-10 w-full">
36+
<h1 class="text-primary-500 font-extrabold !text-5xl lg:!text-7xl text-center">
37+
Data management,
38+
with your team, <br>
39+
on your server,
40+
made tasteful.
41+
</h1>
42+
43+
<div class="vp-doc in-vue-codeblock max-w-full" v-html="html" />
44+
</div>
45+
46+
<div class="relative w-full -mt-20 -mb-40">
47+
<div class="flex flex-col items-center select-none pointer-events-none">
48+
<div
49+
class="relative animate-[spin_60s_linear_infinite] select-none opacity-20 w-full"
50+
>
51+
<img
52+
:src="logoOutlineSrc"
53+
class="h-full w-full relative"
54+
style="animation: first-star 10s; transform: rotate(106deg)"
55+
/>
56+
<img
57+
:src="logoOutlineSrc"
58+
class="h-full w-full absolute top-0"
59+
style="animation: second-star 10s"
60+
/>
61+
</div>
62+
</div>
63+
64+
<div class="absolute h-full w-full flex items-center justify-center top-0">
65+
<img class="w-full !max-w-100%" :src="screenshotSrc" alt="StarQuery app screenshot" />
66+
</div>
67+
68+
69+
</div>
70+
</div>
71+
</template>

docs/.vitepress/theme/custom.css

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@
103103
display: none;
104104
}
105105
img {
106-
height: 40px;
106+
height: 40px !important;
107107
}
108108
}
109109
}
@@ -252,4 +252,12 @@
252252
.starquery-muted {
253253
color: var(--vp-c-default-2);
254254
}
255+
256+
.in-vue-codeblock pre {
257+
padding: 1rem;
258+
border: 1px solid var(--vp-c-border);
259+
border-radius: 18px;
260+
overflow: auto;
261+
user-select: all;
262+
}
255263
}

docs/.vitepress/theme/index.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { h } from 'vue'
44
import InstallNavButton from './components/InstallNavButton.vue'
55
import GitHubStarButton from './components/GitHubStarButton.vue'
66
import HomeScreenshotShowcase from './components/HomeScreenshotShowcase.vue'
7+
import SelfHostedHero from './components/SelfHostedHero.vue'
8+
import DocsButton from './components/DocsButton.vue'
79
import './custom.css'
810
import HomeHero from "./components/HomeHero.vue";
911

@@ -20,5 +22,7 @@ export default {
2022
enhanceApp({ app }) {
2123
app.component('HomeScreenshotShowcase', HomeScreenshotShowcase)
2224
app.component('HomeHero', HomeHero)
25+
app.component('SelfHostedHero', SelfHostedHero)
26+
app.component('DocsButton', DocsButton)
2327
},
2428
} satisfies Theme

docs/deploy/docker.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,4 @@ Reset the metastore volume:
3838

3939
```bash
4040
docker compose -f docker-compose.hosted.yml down -v
41-
```
42-
43-
## Host Networking for Datasources
44-
45-
If StarQuery needs to reach services on your host machine from inside Docker, configure datasources with `host.docker.internal` instead of `localhost`.
41+
```

0 commit comments

Comments
 (0)