Change to lume

Signed-off-by: Sam Therapy <sam@samtherapy.net>
This commit is contained in:
Sam Therapy 2022-09-25 18:56:15 +02:00
parent 1bb0f98d53
commit 338c145739
Signed by: sam
GPG Key ID: 4D8B07C18F31ACBD
28 changed files with 256 additions and 238 deletions

133
.gitignore vendored Normal file
View File

@ -0,0 +1,133 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
.cache
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
src/_cache
.dccache

3
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"deno.enable": true
}

View File

@ -2,4 +2,4 @@
The website I use for my nameservers
Contact me if you want to use them as your nameservers (or even secondary ones)
Contact me if you want to use them as your nameservers (or even secondary ones)

20
_config.ts Normal file
View File

@ -0,0 +1,20 @@
import lume from "lume/mod.ts";
import imagick from "lume/plugins/imagick.ts";
import inline from "lume/plugins/inline.ts";
import jsx_preact from "lume/plugins/jsx_preact.ts";
import lightningcss from "lume/plugins/lightningcss.ts";
import sass from "lume/plugins/sass.ts";
const site = lume({
src: "./src",
dest: "./dist",
});
site
.use(imagick())
.use(inline())
.use(jsx_preact())
.use(lightningcss())
.use(sass());
export default site;

12
deno.json Normal file
View File

@ -0,0 +1,12 @@
{
"importMap": "import_map.json",
"tasks": {
"lume": "deno eval \"import 'lume/task.ts'\" --",
"build": "deno task lume",
"serve": "deno task lume -s"
},
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "preact"
}
}

View File

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>froth.zone Nameserver</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="shortcut icon" href="img/illyafishe.png" />
<link rel="stylesheet" href="theme.css" />
</head>
<body>
<img alt="Illya" src="img/illya.jpg" />
<br />
<br />
<footer>
<small>
<a href="https://git.froth.zone/sam/nameservers">
Source for the HTML/CSS
</a>
<small>
<br />Contact <a href="https://froth.zone/sam">Sam</a> if you want to
use this nameserver as your own.
</small>
</small>
</footer>
</body>
</html>

View File

@ -1,39 +0,0 @@
body {
background-color: #000000;
color: rgba(255, 255, 255, 1);
max-width: 80%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
max-height: 80%;
margin: auto;
}
/* For mobile phones: */
img {
max-width: 20em;
}
@media only screen and (min-width: 1300px) {
/* For desktop: */
img {
max-width: 50%;
}
}
a {
color: rgba(200, 200, 200, 0.8);
}
a:hover {
color: rgba(200, 200, 200, 1);
}

7
import_map.json Normal file
View File

@ -0,0 +1,7 @@
{
"imports": {
"lume/": "https://deno.land/x/lume@v1.11.4/",
"preact/jsx-runtime": "https://deno.land/x/lume@v1.11.4/deps/preact_runtime.ts",
"preact": "https://deno.land/x/lume@v1.11.4/deps/preact.ts"
}
}

View File

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>froth.zone Nameserver</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="shortcut icon" href="img/rinfishe.png" />
<link rel="stylesheet" href="theme.css" />
</head>
<body>
<img alt="Rin" src="img/rin.jpg" />
<br />
<br />
<footer>
<small>
<a href="https://git.froth.zone/sam/nameservers">
Source for the HTML/CSS
</a>
<small>
<br />Contact <a href="https://froth.zone/sam">Sam</a> if you want to
use this nameserver as your own.
</small>
</small>
</footer>
</body>
</html>

View File

@ -1,39 +0,0 @@
body {
background-color: #000000;
color: rgba(255, 255, 255, 1);
max-width: 80%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
max-height: 80%;
margin: auto;
}
/* For mobile phones: */
img {
max-width: 20em;
}
@media only screen and (min-width: 1300px) {
/* For desktop: */
img {
max-width: 50%;
}
}
a {
color: rgba(200, 200, 200, 0.8);
}
a:hover {
color: rgba(200, 200, 200, 1);
}

View File

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>froth.zone Nameserver</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="shortcut icon" href="img/saberfishe.png" />
<link rel="stylesheet" href="theme.css" />
</head>
<body>
<img alt="Saber" src="img/saber.jpg" />
<br />
<br />
<footer>
<small>
<a href="https://git.froth.zone/sam/nameservers">
Source for the HTML/CSS
</a>
<small>
<br />Contact <a href="https://froth.zone/sam">Sam</a> if you want to
use this nameserver as your own.
</small>
</small>
</footer>
</body>
</html>

View File

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>froth.zone Nameserver</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="shortcut icon" href="img/sakurafishe.png" />
<link rel="stylesheet" href="theme.css" />
</head>
<body>
<img alt="Sakura" src="img/sakura.jpg" />
<br />
<br />
<footer>
<small>
<a href="https://git.froth.zone/sam/nameservers">
Source for the HTML/CSS
</a>
<small>
<br />Contact <a href="https://froth.zone/sam">Sam</a> if you want to
use this nameserver as your own.
</small>
</small>
</footer>
</body>
</html>

View File

@ -1,39 +0,0 @@
body {
background-color: #000000;
color: rgba(255, 255, 255, 1);
max-width: 80%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
max-height: 80%;
margin: auto;
}
/* For mobile phones: */
img {
max-width: 20em;
}
@media only screen and (min-width: 1300px) {
/* For desktop: */
img {
max-width: 50%;
}
}
a {
color: rgba(200, 200, 200, 0.8);
}
a:hover {
color: rgba(200, 200, 200, 1);
}

View File

@ -0,0 +1,3 @@
export default (o: { char: string }) => (
<link rel="icon" href={`../img/${o.char}fishe.webp`} inline />
);

View File

@ -0,0 +1,4 @@
export default (o: { char: string }) => (
//{/* @ts-ignore */}
<img alt={o.char as string} src={`../img/${o.char as string}.webp`} inline />
);

3
src/_data/site.json Normal file
View File

@ -0,0 +1,3 @@
{
"endpoint": "froth.zone"
}

View File

@ -0,0 +1,2 @@
<!DOCTYPE html>
{{ content | safe }}

View File

@ -0,0 +1,34 @@
import { PageData } from "https://deno.land/x/lume@v1.11.4/core.ts";
import Favicon from "../../_components/favicon.tsx";
import Image from "../../_components/image.tsx";
export const layout = "layouts/_main.njk";
export default (data: PageData) => (
<html lang="en">
<head>
<title>{data.site.endpoint} Nameserver</title>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width" />
<Favicon char={data.body as string} />
{/* @ts-ignore */}
<link rel="stylesheet" href="../styles.css" inline />
</head>
<body>
<Image char={data.body as string} />
<footer>
<small>
<a href="https://git.froth.zone/sam/nameservers">
source
</a>
<small>
<br />
<br />
Contact <a href="https://froth.zone/sam">Sam</a>{" "}
if you want to use this nameserver as your own.
</small>
</small>
</footer>
</body>
</html>
);

5
src/img/_data.json Normal file
View File

@ -0,0 +1,5 @@
{
"imagick": {
"format": "webp"
}
}

View File

Before

Width:  |  Height:  |  Size: 45 KiB

After

Width:  |  Height:  |  Size: 45 KiB

View File

Before

Width:  |  Height:  |  Size: 205 KiB

After

Width:  |  Height:  |  Size: 205 KiB

View File

Before

Width:  |  Height:  |  Size: 94 KiB

After

Width:  |  Height:  |  Size: 94 KiB

View File

Before

Width:  |  Height:  |  Size: 640 KiB

After

Width:  |  Height:  |  Size: 640 KiB

View File

Before

Width:  |  Height:  |  Size: 498 KiB

After

Width:  |  Height:  |  Size: 498 KiB

View File

Before

Width:  |  Height:  |  Size: 216 KiB

After

Width:  |  Height:  |  Size: 216 KiB

View File

Before

Width:  |  Height:  |  Size: 299 KiB

After

Width:  |  Height:  |  Size: 299 KiB

20
src/pages.tmpl.ts Normal file
View File

@ -0,0 +1,20 @@
export const layout = "layouts/main.tsx";
export default function* () {
yield {
url: "/rin/",
body: "rin",
};
yield {
url: "/sakura/",
body: "sakura",
};
yield {
url: "/saber/",
body: "saber",
};
yield {
url: "/illya/",
body: "illya",
};
}

View File

@ -1,13 +1,13 @@
body {
background-color: #000000;
color: rgba(255, 255, 255, 1);
max-width: 80%;
background-color: #000000;
color: rgba(255, 255, 255, 1);
max-width: 80%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
position: absolute;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
@ -18,22 +18,19 @@ body {
/* For mobile phones: */
img {
max-width: 20em;
max-width: 20em;
}
@media only screen and (min-width: 1300px) {
/* For desktop: */
img {
/* For desktop: */
img {
max-width: 50%;
}
}
a {
color: rgba(200, 200, 200, 0.8);
color: rgba(200, 200, 200, 0.8);
}
a:hover {
color: rgba(200, 200, 200, 1);
color: rgba(200, 200, 200, 1);
}