mirror of
https://github.com/pockethost/pockethost.git
synced 2025-11-23 22:15:49 +00:00
enh(dashboard): update max width constraints on instance detail pages
This commit is contained in:
Ben Allfree
parent
6aad803416
commit
2a8a97e48d
@ -2,6 +2,7 @@
|
||||
import CodeSample from '$components/CodeSample.svelte'
|
||||
import CardHeader from '$src/components/cards/CardHeader.svelte'
|
||||
import { DISCORD_URL, INSTANCE_URL } from '$src/env'
|
||||
import { isCnameActive } from 'pockethost/common'
|
||||
import { instance } from './store'
|
||||
|
||||
let installSnippet = `npm i pocketbase`
|
||||
@ -18,50 +19,39 @@
|
||||
});`
|
||||
</script>
|
||||
|
||||
<CardHeader documentation={`/docs/accessing-instance/`}>Overview</CardHeader>
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/accessing-instance/`}>Overview</CardHeader>
|
||||
|
||||
<!-- These should be p but the inside already has p -->
|
||||
<div>
|
||||
<p class="mb-2">Your PocketBase URL is</p>
|
||||
<CodeSample code={url} />
|
||||
</div>
|
||||
<!-- These should be p but the inside already has p -->
|
||||
<div>
|
||||
<p class="mb-2">Your PocketBase URL is</p>
|
||||
<CodeSample code={url} />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p class="mb-2">Installing PocketBase</p>
|
||||
<CodeSample code={installSnippet} />
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-2">Installing PocketBase</p>
|
||||
<CodeSample code={installSnippet} />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p class="mb-2">Connecting to Your Instance</p>
|
||||
{#if $instance.cname}
|
||||
{#if $instance.cname_active}
|
||||
<div class="text-accent">Notice: You are in Custom Domain mode</div>
|
||||
{:else}
|
||||
<div class="text-error">
|
||||
Notice: You are in Custom Domain mode but it is not active and will not work. Go find <a
|
||||
href={DISCORD_URL}
|
||||
target="_blank"
|
||||
class="link"><code>.noaxis</code> on Discord</a
|
||||
> to get set up.
|
||||
</div>
|
||||
{/if}
|
||||
{/if}
|
||||
<CodeSample code={connectionSnippet} />
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-2">Connecting to Your Instance</p>
|
||||
<CodeSample code={connectionSnippet} />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p class="mb-2">Making Your First Query</p>
|
||||
<CodeSample code={firstQuerySnippet} />
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-2">Making Your First Query</p>
|
||||
<CodeSample code={firstQuerySnippet} />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p>Additional Resources:</p>
|
||||
<ul class="list-disc pl-4">
|
||||
<li>
|
||||
<a href={`https://pocketbase.io/docs/api-records/`} target="_blank" class="link">PocketBase Web APIs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.npmjs.com/package/pocketbase" target="_blank" class="link">PocketBase NPM Package</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<p>Additional Resources:</p>
|
||||
<ul class="list-disc pl-4">
|
||||
<li>
|
||||
<a href={`https://pocketbase.io/docs/api-records/`} target="_blank" class="link">PocketBase Web APIs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.npmjs.com/package/pocketbase" target="_blank" class="link">PocketBase NPM Package</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -22,13 +22,15 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<CardHeader documentation={`/docs/admin-sync`}>Admin Sync</CardHeader>
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/admin-sync`}>Admin Sync</CardHeader>
|
||||
|
||||
<p class="mb-8">
|
||||
Admin Sync ensures that your instance always has an admin account that matches the login credentials of your
|
||||
pockethost.io account.
|
||||
</p>
|
||||
<p class="mb-8">
|
||||
Admin Sync ensures that your instance always has an admin account that matches the login credentials of your
|
||||
pockethost.io account.
|
||||
</p>
|
||||
|
||||
<ErrorMessage message={errorMessage} />
|
||||
<ErrorMessage message={errorMessage} />
|
||||
|
||||
<Toggle checked={!!syncAdmin} onChange={handleChange} />
|
||||
<Toggle checked={!!syncAdmin} onChange={handleChange} />
|
||||
</div>
|
||||
|
||||
@ -63,30 +63,32 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<CardHeader documentation={`/docs/delete`}>Delete Instance</CardHeader>
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/delete`}>Delete Instance</CardHeader>
|
||||
|
||||
{#if power}
|
||||
<AlertBar message="Instance must be powered off before deleting." type="error" />
|
||||
{/if}
|
||||
{#if power}
|
||||
<AlertBar message="Instance must be powered off before deleting." type="error" />
|
||||
{/if}
|
||||
|
||||
<div class="mb-8">
|
||||
Deleting your instance will immediately and permanently delete your instance:
|
||||
<ul class="ml-10 text-error">
|
||||
<li>Your subdomain</li>
|
||||
<li><pre>pb_data/*</pre></li>
|
||||
<li><pre>pb_public/*</pre></li>
|
||||
<li><pre>pb_migrations/*</pre></li>
|
||||
<li><pre>pb_static/*</pre></li>
|
||||
</ul>
|
||||
If you are storing files on S3, you must delete them separately.
|
||||
<div class="mb-8">
|
||||
Deleting your instance will immediately and permanently delete your instance:
|
||||
<ul class="ml-10 text-error">
|
||||
<li>Your subdomain</li>
|
||||
<li><pre>pb_data/*</pre></li>
|
||||
<li><pre>pb_public/*</pre></li>
|
||||
<li><pre>pb_migrations/*</pre></li>
|
||||
<li><pre>pb_static/*</pre></li>
|
||||
</ul>
|
||||
If you are storing files on S3, you must delete them separately.
|
||||
</div>
|
||||
|
||||
<ErrorMessage message={errorMessage} />
|
||||
|
||||
<form class="flex change-version-form-container-query gap-4" on:submit={handleSave}>
|
||||
<button type="submit" class="btn btn-error" disabled={power || isButtonDisabled}>Delete Instance</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<ErrorMessage message={errorMessage} />
|
||||
|
||||
<form class="flex change-version-form-container-query gap-4" on:submit={handleSave}>
|
||||
<button type="submit" class="btn btn-error" disabled={power || isButtonDisabled}>Delete Instance</button>
|
||||
</form>
|
||||
|
||||
<style>
|
||||
.change-version-form-container-query {
|
||||
flex-direction: column;
|
||||
|
||||
@ -20,13 +20,15 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<CardHeader documentation={`/docs/dev-mode`}>Dev Mode</CardHeader>
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/dev-mode`}>Dev Mode</CardHeader>
|
||||
|
||||
<p class="mb-8">
|
||||
Starting with PocketBase v0.20.1, your instance will show debugging output in the instance logs. Performance is
|
||||
degraded while Dev Mode is active.
|
||||
</p>
|
||||
<p class="mb-8">
|
||||
Starting with PocketBase v0.20.1, your instance will show debugging output in the instance logs. Performance is
|
||||
degraded while Dev Mode is active.
|
||||
</p>
|
||||
|
||||
<ErrorMessage message={errorMessage} />
|
||||
<ErrorMessage message={errorMessage} />
|
||||
|
||||
<Toggle onChange={handleChange} checked={!!dev} onClass="warning" />
|
||||
<Toggle onChange={handleChange} checked={!!dev} onClass="warning" />
|
||||
</div>
|
||||
|
||||
@ -15,37 +15,39 @@
|
||||
const ftpUrl = FTP_URL(email)
|
||||
</script>
|
||||
|
||||
<CardHeader documentation={`/docs/ftp`}>FTP Access</CardHeader>
|
||||
<div class="mb-8">Securely access your instance files via FTPS. Use your PocketHost account login and password.</div>
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/ftp`}>FTP Access</CardHeader>
|
||||
<div class="mb-8">Securely access your instance files via FTPS. Use your PocketHost account login and password.</div>
|
||||
|
||||
<div class="mb-12">
|
||||
<CodeSample code={`ftp ${ftpUrl}`} language={bash} />
|
||||
<div class="mb-12">
|
||||
<CodeSample code={`ftp ${ftpUrl}`} language={bash} />
|
||||
</div>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="border-b-2 border-neutral">Directory</th>
|
||||
<th class="border-b-2 border-neutral">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>pb_data</th>
|
||||
<td>The PocketBase data directory, including upload storage and database backups</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_public</th>
|
||||
<td>Public files, such as a web frontend</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_migrations</th>
|
||||
<td>The PocketBase migrations directory</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_hooks</th>
|
||||
<td>The PocketBase JS hooks directory</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="border-b-2 border-neutral">Directory</th>
|
||||
<th class="border-b-2 border-neutral">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>pb_data</th>
|
||||
<td>The PocketBase data directory, including upload storage and database backups</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_public</th>
|
||||
<td>Public files, such as a web frontend</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_migrations</th>
|
||||
<td>The PocketBase migrations directory</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>pb_hooks</th>
|
||||
<td>The PocketBase JS hooks directory</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
@ -59,7 +59,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="max-w-lg">
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader documentation={`/docs/rename-instance`}>Rename Instance</CardHeader>
|
||||
|
||||
<p class="mb-8">
|
||||
|
||||
@ -14,6 +14,7 @@
|
||||
<title>{subdomain} secrets - PocketHost</title>
|
||||
</svelte:head>
|
||||
|
||||
<!-- Consistency is key -->
|
||||
<CardHeader>Secrets</CardHeader>
|
||||
<SecretsInner />
|
||||
<div class="max-w-2xl">
|
||||
<CardHeader>Secrets</CardHeader>
|
||||
<SecretsInner />
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user