infrastructure/pages-landing-page
infrastructure/pages-landing-page
2
0
Fork 0
Code Issues 1 Pull requests 1 Activity Actions

Lint
All checks were successful
Build & Deploy / build (push) Successful in 31s
Details

Browse source 
Signed-off-by: Sam Therapy <sam@samtherapy.net>
This commit is contained in:
Sam Therapy 2024-04-03 17:16:49 +02:00
parent c592336f0e
commit 399c593df4
Signed by: sam
GPG key ID: 4D8B07C18F31ACBD
6 changed files with 147 additions and 155 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.github/workflows/build.yaml vendored
View file

@ -3,7 +3,6 @@ on:
push:
pull_request:
jobs:
build:
runs-on: ubuntu-latest
@ -32,4 +31,4 @@ jobs:
github_token: ${{ secrets.GITHUB_TOKEN }}
publish_dir: ./build
force_orphan: true
publish_branch: pages
publish_branch: pages

11
renovate.json
View file

@ -1,10 +1,5 @@
{
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": [
"config:recommended",
":pinSkipCi",
":enableVulnerabilityAlerts",
":semanticCommits"
],
"automerge": true
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": ["config:recommended", ":pinSkipCi", ":enableVulnerabilityAlerts", ":semanticCommits"],
"automerge": true
}

2
src/hooks.server.ts
View file

@ -32,4 +32,4 @@ export async function handle({ event, resolve }) {
}
}
});
}
}

280
src/lib/instructions.svelte
View file

@ -1,150 +1,148 @@
<script lang="ts">
import { browser } from '$app/environment';
import { gitDomain, ipv4, ipv6, pagesDomain } from '$lib';
import { Accordion, AccordionItem, CodeBlock, Step, Stepper } from '@skeletonlabs/skeleton';
let username = '';
let repository = '';
let branch = '';
$: navDomain = `https://${username}.${pagesDomain}${!repository ? '' : `/${repository}`}${!branch ? '' : `/@${branch}`}`;
$: dnsDomain = `${!branch ? '' : `${branch}.`}${!repository ? '' : `${repository}.`}${username}.${pagesDomain}`;
function codebergDocs() {
if (browser) {
window.open('https://docs.codeberg.org/codeberg-pages/', '_blank');
}
import { browser } from '$app/environment';
import { gitDomain, ipv4, ipv6, pagesDomain } from '$lib';
import { Accordion, AccordionItem, CodeBlock, Step, Stepper } from '@skeletonlabs/skeleton';
let username = '';
let repository = '';
let branch = '';
$: navDomain = `https://${username}.${pagesDomain}${!repository ? '' : `/${repository}`}${!branch ? '' : `/@${branch}`}`;
$: dnsDomain = `${!branch ? '' : `${branch}.`}${!repository ? '' : `${repository}.`}${username}.${pagesDomain}`;
function codebergDocs() {
if (browser) {
window.open('https://docs.codeberg.org/codeberg-pages/', '_blank');
}
}
</script>
<Stepper
on:complete={codebergDocs}
buttonCompleteLabel="Open Documentation"
buttonComplete="variant-filled-success"
>
<Step>
<svelte:fragment slot="navigation">
<a
href="https://{gitDomain}/repo/create"
target="_blank"
class="btn variant-filled-secondary">Create a repository!</a
>
</svelte:fragment>
<svelte:fragment slot="header">1 - Make a repository</svelte:fragment>
<div class="space-y-2">
<p>
Create a public repository named <code class="code">pages</code> to make the site available
on the main subdomain.
</p>
<hr />
</div>
<p>Or, create a branch named <code class="code">pages</code> in any public repository.</p>
<p>
<code class="code">git switch --orphan pages</code><br /><code class="code"
>git rm --cached -r .</code
>
</p>
<CodeBlock
buttonCopied="Copied!"
lineNumbers={true}
language="shell"
code={`git switch --orphan pages
on:complete={codebergDocs}
buttonCompleteLabel="Open Documentation"
buttonComplete="variant-filled-success"
>
<Step>
<svelte:fragment slot="navigation">
<a href="https://{gitDomain}/repo/create" target="_blank" class="btn variant-filled-secondary"
>Create a repository!</a
>
</svelte:fragment>
<svelte:fragment slot="header">1 - Make a repository</svelte:fragment>
<div class="space-y-2">
<p>
Create a public repository named <code class="code">pages</code> to make the site available on
the main subdomain.
</p>
<hr />
</div>
<p>Or, create a branch named <code class="code">pages</code> in any public repository.</p>
<p>
<code class="code">git switch --orphan pages</code><br /><code class="code"
>git rm --cached -r .</code
>
</p>
<CodeBlock
buttonCopied="Copied!"
lineNumbers={true}
language="shell"
code={`git switch --orphan pages
git rm --cached -r .`}
></CodeBlock>
</Step>
<Step>
<svelte:fragment slot="header">2 - Add your files</svelte:fragment>
<p>Push your static content. HTML, CSS, fonts, images or anything else.</p>
</Step>
<Step>
<svelte:fragment slot="header">3 - You're Done!</svelte:fragment>
<div class="space-y-4">
<p>Access your new website with this link:</p>
<code class="code">https://USERNAME.{pagesDomain}[/REPOSITORY][/@BRANCH]</code>
<p>or, use this handy form that can navigate for you!</p>
<div class="space-y-1">
<div class="input-group input-group-divider grid-cols-4">
<input
bind:value={username}
class="input variant-form-material {username ? '' : 'input-error'}"
title="Username"
type="text"
placeholder="Username (required)"
required
/>
<div class="input-group-shim">.{pagesDomain}/</div>
<input
bind:value={repository}
class="input variant-form-material"
title="Repository"
type="text"
placeholder="Repository"
/>
<input
bind:value={branch}
class="input variant-form-material"
title="Branch"
type="text"
placeholder="Branch"
/>
</div>
<a href={navDomain} class="btn variant-filled-secondary">Take me there!</a>
</div>
<hr />
<div>
<h3 class="h3">What about custom domains?</h3>
<p>
To use custom domains, create a <code class="code">.domains</code> in the root of your
repository with the domain name you would like to use.
</p>
<br />
<p>Then, add a DNS record for that domain:</p>
<em>(note): use the above form to auto-generate your DNS records!</em>
<Accordion autocollapse>
<AccordionItem open>
<svelte:fragment slot="summary">CNAME (Prefered)</svelte:fragment>
<svelte:fragment slot="content">
<code class="code">CNAME [[branch.]repo.]user.{pagesDomain}.</code>
<CodeBlock buttonCopied="Copied!" language="dns" code={`CNAME ${dnsDomain}.`}
></CodeBlock>
</svelte:fragment>
</AccordionItem>
<AccordionItem>
<svelte:fragment slot="summary">ALIAS (If available)</svelte:fragment>
<svelte:fragment slot="content">
<p>For apex domains where CNAME does not work.</p>
<p>
<code class="code">ALIAS {pagesDomain}.</code><br /><code class="code"
>TXT $[[branch.]repo.]user.{pagesDomain}</code
>
</p>
<CodeBlock
buttonCopied="Copied!"
language="dns"
code={`ALIAS ${pagesDomain}.
></CodeBlock>
</Step>
<Step>
<svelte:fragment slot="header">2 - Add your files</svelte:fragment>
<p>Push your static content. HTML, CSS, fonts, images or anything else.</p>
</Step>
<Step>
<svelte:fragment slot="header">3 - You're Done!</svelte:fragment>
<div class="space-y-4">
<p>Access your new website with this link:</p>
<code class="code">https://USERNAME.{pagesDomain}[/REPOSITORY][/@BRANCH]</code>
<p>or, use this handy form that can navigate for you!</p>
<div class="space-y-1">
<div class="input-group input-group-divider grid-cols-4">
<input
bind:value={username}
class="input variant-form-material {username ? '' : 'input-error'}"
title="Username"
type="text"
placeholder="Username (required)"
required
/>
<div class="input-group-shim">.{pagesDomain}/</div>
<input
bind:value={repository}
class="input variant-form-material"
title="Repository"
type="text"
placeholder="Repository"
/>
<input
bind:value={branch}
class="input variant-form-material"
title="Branch"
type="text"
placeholder="Branch"
/>
</div>
<a href={navDomain} class="btn variant-filled-secondary">Take me there!</a>
</div>
<hr />
<div>
<h3 class="h3">What about custom domains?</h3>
<p>
To use custom domains, create a <code class="code">.domains</code> in the root of your repository
with the domain name you would like to use.
</p>
<br />
<p>Then, add a DNS record for that domain:</p>
<em>(note): use the above form to auto-generate your DNS records!</em>
<Accordion autocollapse>
<AccordionItem open>
<svelte:fragment slot="summary">CNAME (Prefered)</svelte:fragment>
<svelte:fragment slot="content">
<code class="code">CNAME [[branch.]repo.]user.{pagesDomain}.</code>
<CodeBlock buttonCopied="Copied!" language="dns" code={`CNAME ${dnsDomain}.`}
></CodeBlock>
</svelte:fragment>
</AccordionItem>
<AccordionItem>
<svelte:fragment slot="summary">ALIAS (If available)</svelte:fragment>
<svelte:fragment slot="content">
<p>For apex domains where CNAME does not work.</p>
<p>
<code class="code">ALIAS {pagesDomain}.</code><br /><code class="code"
>TXT $[[branch.]repo.]user.{pagesDomain}</code
>
</p>
<CodeBlock
buttonCopied="Copied!"
language="dns"
code={`ALIAS ${pagesDomain}.
TXT ${dnsDomain}`}
></CodeBlock>
</svelte:fragment>
</AccordionItem>
<AccordionItem>
<svelte:fragment slot="summary">A/AAAA (Old reliable)</svelte:fragment>
<svelte:fragment slot="content">
<p>If CNAME will not work and ALIAS is not available</p>
<p>
<code class="code">A {ipv4}</code><br /><code class="code">AAAA {ipv6}</code><br
/><code class="code">TXT $[[branch.]repo.]user.{pagesDomain}</code>
</p>
<CodeBlock
buttonCopied="Copied!"
language="dns"
code={`A ${ipv4}
></CodeBlock>
</svelte:fragment>
</AccordionItem>
<AccordionItem>
<svelte:fragment slot="summary">A/AAAA (Old reliable)</svelte:fragment>
<svelte:fragment slot="content">
<p>If CNAME will not work and ALIAS is not available</p>
<p>
<code class="code">A {ipv4}</code><br /><code class="code">AAAA {ipv6}</code><br
/><code class="code">TXT $[[branch.]repo.]user.{pagesDomain}</code>
</p>
<CodeBlock
buttonCopied="Copied!"
language="dns"
code={`A ${ipv4}
AAAA ${ipv6}
TXT ${dnsDomain}`}
></CodeBlock>
</svelte:fragment>
</AccordionItem>
</Accordion>
</div>
</div>
</Step>
</Stepper>
></CodeBlock>
</svelte:fragment>
</AccordionItem>
</Accordion>
</div>
</div>
</Step>
</Stepper>

2
src/routes/+error.svelte
View file

@ -11,4 +11,4 @@
An unexpected error occurred.
{/if}
</p>
</div>
</div>

4
vite.config.ts
View file

@ -4,10 +4,10 @@ import { defineConfig } from 'vite';
export default defineConfig({
build: {
sourcemap: true,
sourcemap: true
},
css: {
devSourcemap: true,
devSourcemap: true
},
plugins: [sveltekit(), purgeCss()]
});