z0x/z0x.ca
Code Actions

biome, bun, tailwind v4

Browse source
This commit is contained in:
z0x 2024-12-31 01:18:25 -05:00
parent ed8d366df6
commit 678fa26c76
16 changed files with 64 additions and 7977 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
.gitignore vendored
View file

@ -12,13 +12,6 @@ yarn-debug.log*
yarn-error.log* yarn-error.log*
pnpm-debug.log* pnpm-debug.log*
# environment variables # environment variables
.env .env
.env.production .env.production
# macOS-specific files
.DS_Store
# jetbrains setting folder
.idea/

1
.prettierignore
View file

@ -1 +0,0 @@
public/

3
.prettierrc
View file

@ -1,3 +0,0 @@
{
"plugins": ["prettier-plugin-tailwindcss", "prettier-plugin-astro"]
}

8
.vscode/extensions.json vendored
View file

@ -1,4 +1,8 @@
{ {
"recommendations": ["astro-build.astro-vscode"], "recommendations": [
"unwantedRecommendations": [] "astro-build.astro-vscode",
"biomejs.biome",
"bradlc.vscode-tailwindcss"
],
"unwantedRecommendations": []
} }

0
a.out
View file

9
astro.config.mjs
View file

@ -1,9 +1,8 @@
// @ts-check
import { defineConfig } from "astro/config"; import { defineConfig } from "astro/config";
import tailwindcss from "@tailwindcss/vite";
import tailwind from "@astrojs/tailwind";
// https://astro.build/config
export default defineConfig({ export default defineConfig({
integrations: [tailwind()], vite: {
plugins: [tailwindcss()],
},
}); });

BIN
bun.lockb Executable file
View file

Binary file not shown.

7895
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

46
package.json
View file

@ -1,25 +1,25 @@
{ {
"name": "z0x.ca", "name": "z0x.ca",
"type": "module", "type": "module",
"version": "0.0.1", "version": "1.0.0",
"scripts": { "scripts": {
"dev": "astro dev", "dev": "astro dev",
"start": "astro dev", "start": "astro dev",
"build": "astro check && astro build", "build": "astro check && astro build",
"preview": "astro preview", "preview": "astro preview",
"astro": "astro" "astro": "astro"
}, },
"dependencies": { "dependencies": {
"@astrojs/check": "^0.9.4", "astro": "^5.1.1",
"@astrojs/tailwind": "^5.1.2", "motion": "^11.11.17"
"astro": "^4.16.13", },
"motion": "^11.11.17", "devDependencies": {
"tailwindcss": "^3.4.14", "@astrojs/check": "^0.9.4",
"typescript": "^5.6.3" "@biomejs/biome": "1.9.4",
}, "@tailwindcss/vite": "^4.0.0-beta.8",
"devDependencies": { "prettier": "^3.3.3",
"prettier": "^3.3.3", "tailwindcss": "^4.0.0-beta.8",
"prettier-plugin-astro": "^0.14.1", "typescript": "^5.6.3"
"prettier-plugin-tailwindcss": "^0.6.8" },
} "trustedDependencies": ["@biomejs/biome", "@parcel/watcher"]
} }

0
src/fonts/SF-Pro.woff2 → public/fonts/SF-Pro.woff2
View file

21
src/css/app.css
View file

@ -1,12 +1,13 @@
@tailwind base; @import "tailwindcss";
@tailwind components;
@tailwind utilities;
@layer base { @theme {
@font-face { --font-sfpro: "sf-pro", sans-serif;
font-family: "sf-pro"; }
font-style: normal;
font-display: swap; @font-face {
src: url(/src/fonts/SF-Pro.woff2) format("woff2"); font-family: "sf-pro";
} src: url("/fonts/SF-Pro.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: block;
} }

18
src/js/index.ts
View file

@ -1,12 +1,14 @@
import { animate, stagger } from "motion"; import { animate, stagger } from "motion";
const elements = document.querySelectorAll("img, h1"); // const elements = document.querySelectorAll("img, h1");
const fade = document.getElementById("fade");
const elements = fade.querySelectorAll("*");
animate( animate(
elements, elements,
{ opacity: [0, 1] }, { opacity: [0, 1] },
{ {
duration: 0.6, duration: 0.6,
delay: stagger(0.6, { startDelay: 0.2 }), delay: stagger(0.6, { startDelay: 0.2 }),
ease: "easeIn", ease: "easeIn",
}, },
); );

9
src/pages/404.astro
View file

@ -2,19 +2,20 @@
import "/src/css/app.css"; import "/src/css/app.css";
--- ---
<html lang="en-us"> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>404</title> <title>404</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="darkreader-lock" /> <meta name="darkreader-lock" />
<link rel="icon" type="image/x-icon" href="/src/img/logo_bg.svg" /> <link rel="icon" type="image/x-icon" href="/src/img/logo_bg.svg" />
<link rel="icon" type="image/png" sizes="192x192" href="/src/img/logo_bg.svg" /> <link rel="icon" type="image/png" sizes="192x192" href="/src/img/logo_bg.svg" />
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/img/logo_bg.svg" /> <link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/img/logo_bg.svg" />
<link rel="preload" href="/fonts/SF-Pro.woff2" as="font" type="font/woff2" crossorigin />
</head> </head>
<body class="bg-gradient-to-b from-neutral-700 via-neutral-900 to-neutral-950 text-white overflow-hidden"> <body class="bg-linear-to-b/oklch from-neutral-700 to-black text-white overflow-hidden">
<div class="flex items-center justify-center min-h-screen"> <div class="flex items-center justify-center min-h-screen">
<div class="flex flex-col items-center justify-center w-full h-full max-w-[60vmin] max-h-[60vmin] md:max-w-[35vmin] md:max-h-[35vmin]"> <div id="fade" class="flex flex-col items-center justify-center w-full h-full max-w-[60vmin] max-h-[60vmin] md:max-w-[35vmin] md:max-h-[35vmin]">
<h1 class="text-4xl opacity-0 font-sfpro font-semibold">404</h1> <h1 class="text-4xl opacity-0 font-sfpro font-semibold">404</h1>
</div> </div>
</div> </div>

7
src/pages/index.astro
View file

@ -4,7 +4,7 @@ import logo from "/src/img/logo.svg";
import "/src/css/app.css"; import "/src/css/app.css";
--- ---
<html lang="en-us"> <html>
<head> <head>
<title>z0x</title> <title>z0x</title>
<meta charset="utf-8" /> <meta charset="utf-8" />
@ -14,10 +14,11 @@ import "/src/css/app.css";
<link rel="icon" type="image/x-icon" href="/src/img/logo_bg.svg" /> <link rel="icon" type="image/x-icon" href="/src/img/logo_bg.svg" />
<link rel="icon" type="image/png" sizes="192x192" href="/src/img/logo_bg.svg" /> <link rel="icon" type="image/png" sizes="192x192" href="/src/img/logo_bg.svg" />
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/img/logo_bg.svg" /> <link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/img/logo_bg.svg" />
<link rel="preload" href="/fonts/SF-Pro.woff2" as="font" type="font/woff2" crossorigin />
</head> </head>
<body class="bg-gradient-to-b from-neutral-700 via-neutral-900 to-neutral-950 text-white overflow-hidden"> <body class="bg-linear-to-b/oklch from-neutral-700 to-black text-white overflow-hidden">
<div class="flex items-center justify-center min-h-screen"> <div class="flex items-center justify-center min-h-screen">
<div class="flex flex-col items-center justify-center w-full h-full max-w-[60vmin] max-h-[60vmin] md:max-w-[35vmin] md:max-h-[35vmin]"> <div id="fade" class="flex flex-col items-center justify-center w-full h-full max-w-[60vmin] max-h-[60vmin] md:max-w-[35vmin] md:max-h-[35vmin]">
<Image src={logo} alt="logo" class="w-2/3 opacity-0" loading="eager" /> <Image src={logo} alt="logo" class="w-2/3 opacity-0" loading="eager" />
<h1 class="text-4xl opacity-0 font-sfpro font-semibold">z0x</h1> <h1 class="text-4xl opacity-0 font-sfpro font-semibold">z0x</h1>
</div> </div>

15
tailwind.config.mjs
View file

@ -1,15 +0,0 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
theme: {
extend: {},
},
plugins: [],
theme: {
extend: {
fontFamily: {
sfpro: ["sf-pro"],
},
},
},
};

2
tsconfig.json
View file

@ -1,3 +1,3 @@
{ {
"extends": "astro/tsconfigs/strict" "extends": "astro/tsconfigs/strictest"
} }