Formatting. :trolley:
This commit is contained in:
parent
e9b9175d51
commit
b8362d2d30
7 changed files with 149 additions and 142 deletions
78
index.ts
78
index.ts
|
|
@ -7,55 +7,55 @@ import { join } from "node:path";
|
|||
const glob = new Glob("**/*");
|
||||
|
||||
const build = async () => {
|
||||
const start = Date.now();
|
||||
const built = await Bun.build({
|
||||
entrypoints: ["./src/index.html"],
|
||||
outdir: "./dist",
|
||||
html: true,
|
||||
experimentalCss: true,
|
||||
splitting: true,
|
||||
sourcemap: "linked"
|
||||
//minify: true,
|
||||
})
|
||||
const end = Date.now();
|
||||
await cleanOldFiles(built.outputs);
|
||||
console.log("Did build", built.success, built.logs)
|
||||
console.log("Build time:", end - start, "ms");
|
||||
}
|
||||
const start = Date.now();
|
||||
const built = await Bun.build({
|
||||
entrypoints: ["./src/index.html"],
|
||||
outdir: "./dist",
|
||||
html: true,
|
||||
experimentalCss: true,
|
||||
splitting: true,
|
||||
sourcemap: "linked",
|
||||
//minify: true,
|
||||
});
|
||||
const end = Date.now();
|
||||
await cleanOldFiles(built.outputs);
|
||||
console.log("Did build", built.success, built.logs);
|
||||
console.log("Build time:", end - start, "ms");
|
||||
};
|
||||
|
||||
const cleanOldFiles = async (outputs: BuildArtifact[]) => {
|
||||
let distFiles: string[] = []
|
||||
for await (const file of glob.scan("./dist")) {
|
||||
distFiles.push(file)
|
||||
}
|
||||
let distFiles: string[] = [];
|
||||
for await (const file of glob.scan("./dist")) {
|
||||
distFiles.push(file);
|
||||
}
|
||||
|
||||
for await (const output of outputs) {
|
||||
const arr = output.path.split("\\")
|
||||
const file = arr[arr.length - 1]
|
||||
for await (const output of outputs) {
|
||||
const arr = output.path.split("\\");
|
||||
const file = arr[arr.length - 1];
|
||||
|
||||
distFiles = distFiles.filter(item => item !== file);
|
||||
}
|
||||
distFiles = distFiles.filter((item) => item !== file);
|
||||
}
|
||||
|
||||
return await Promise.all(
|
||||
Array.from(distFiles).map(file => unlink(join("dist", file)))
|
||||
);
|
||||
}
|
||||
return await Promise.all(
|
||||
Array.from(distFiles).map((file) => unlink(join("dist", file))),
|
||||
);
|
||||
};
|
||||
|
||||
if (process.env.NOWATCH !== "1") {
|
||||
watch(import.meta.dir, { recursive: true }, async (_, file) => {
|
||||
if (!file?.startsWith("dist")) return await build();
|
||||
return;
|
||||
});
|
||||
watch(import.meta.dir, { recursive: true }, async (_, file) => {
|
||||
if (!file?.startsWith("dist")) return await build();
|
||||
return;
|
||||
});
|
||||
|
||||
Bun.serve({
|
||||
async fetch(request, server) {
|
||||
const { pathname } = new URL(request.url);
|
||||
Bun.serve({
|
||||
async fetch(request, server) {
|
||||
const { pathname } = new URL(request.url);
|
||||
|
||||
const file = pathname === "/" ? "/index.html" : pathname;
|
||||
const file = pathname === "/" ? "/index.html" : pathname;
|
||||
|
||||
return new Response(Bun.file(`dist${file}`))
|
||||
}
|
||||
})
|
||||
return new Response(Bun.file(`dist${file}`));
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
await build();
|
||||
|
|
@ -1,94 +1,94 @@
|
|||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Black.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Black.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BlackItalic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BlackItalic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Bold.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Bold.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BoldItalic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BoldItalic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Book.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Book.woff2") format("woff2");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BookItalic.woff2");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/BookItalic.woff2");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Medium.woff2");
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/Medium.woff2");
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/MediumItalic.woff2");
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
font-family: "Circular Std";
|
||||
src: url("../../public/circularstd/MediumItalic.woff2");
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
font-family: "Circular Std", sans-serif;
|
||||
background-color: #111;
|
||||
overflow: hidden;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #333 #222;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
font-family: "Circular Std", sans-serif;
|
||||
background-color: #111;
|
||||
overflow: hidden;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #333 #222;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #222;
|
||||
background: #222;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #333;
|
||||
border-radius: 10px;
|
||||
background-color: #333;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.container {
|
||||
scroll-snap-type: y mandatory;
|
||||
overflow: scroll;
|
||||
height: 100vh;
|
||||
scroll-snap-type: y mandatory;
|
||||
overflow: scroll;
|
||||
height: 100vh;
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import Hero from "./Hero";
|
||||
import IconAnchor from "./IconAnchor";
|
||||
|
||||
import { Music, } from "lucide-preact";
|
||||
import { Music } from "lucide-preact";
|
||||
import { SiGithub, SiForgejo, SiInstagram } from "react-icons/si";
|
||||
|
||||
import "./App.css";
|
||||
|
|
|
|||
|
|
@ -1,53 +1,53 @@
|
|||
.hero {
|
||||
scroll-snap-align: start;
|
||||
position: relative;
|
||||
background: #111111;
|
||||
color: white;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
scroll-snap-align: start;
|
||||
position: relative;
|
||||
background: #111111;
|
||||
color: white;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.hero h2 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-size: 4rem;
|
||||
margin: 0 0px;
|
||||
line-height: 1;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-size: 4rem;
|
||||
margin: 0 0px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.hero p {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-size: 2rem;
|
||||
color: #DEDEDE
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-size: 2rem;
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
.waves-header {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url("./header.svg")
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url("./header.svg");
|
||||
}
|
||||
|
||||
.waves-footer {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 200px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url("./footer.svg")
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 200px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url("./footer.svg");
|
||||
}
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
.IconAnchor {
|
||||
margin: 5px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
|
@ -2,8 +2,15 @@ import type { VNode } from "preact";
|
|||
|
||||
import "./IconAnchor.css";
|
||||
|
||||
export default (props: {icon: VNode; link: string; title: string;}) => {
|
||||
return (
|
||||
<a class="IconAnchor" href={props.link} title={props.title} rel="noreferrer noopener">{props.icon}</a>
|
||||
);
|
||||
}
|
||||
export default (props: { icon: VNode; link: string; title: string }) => {
|
||||
return (
|
||||
<a
|
||||
class="IconAnchor"
|
||||
href={props.link}
|
||||
title={props.title}
|
||||
rel="noreferrer noopener"
|
||||
>
|
||||
{props.icon}
|
||||
</a>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue