feat: replace Tailwind CDN with self-hosted pre-built CSS

This commit is contained in:
M1 2026-03-17 09:32:34 +04:00
parent 3638ce3dd2
commit a995fe3c94
14 changed files with 40 additions and 37 deletions

View File

@ -4,7 +4,9 @@
"scripts": {
"dev": "bun run --hot src/index.ts",
"start": "bun run src/index.ts",
"build": "bun build src/index.ts --outdir dist"
"build": "bun build src/index.ts --outdir dist",
"css": "bunx tailwindcss -i src/tailwind.css -o src/dashboard/tailwind.css --minify",
"css:watch": "bunx tailwindcss -i src/tailwind.css -o src/dashboard/tailwind.css --watch"
},
"dependencies": {
"@elysiajs/cors": "^1.4.1",
@ -13,7 +15,9 @@
"postgres": "^3.4.8"
},
"devDependencies": {
"@tailwindcss/cli": "^4.2.1",
"@types/bun": "^1.3.10",
"tailwindcss": "^4.2.1",
"typescript": "^5.9.3"
}
}

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Monitor Detail</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<style>
body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; background: #0a0a0a; }
</style>

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Documentation</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<style>
body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; background: #0a0a0a; }
pre, code { font-family: inherit; }

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Dashboard</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<style>
body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; background: #0a0a0a; }
</style>

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Sign In</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<link rel="stylesheet" href="/dashboard/app.css">
</head>
<body class="bg-[#0a0a0a] text-gray-100 min-h-screen flex items-center justify-center p-4">

View File

@ -5,24 +5,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Uptime monitoring that thinks like a developer</title>
<meta name="description" content="Monitor uptime with a MongoDB-style query language. Inspect JSON, HTML, headers, certs, and more — not just ping.">
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: {
mono: ['JetBrains Mono', 'SF Mono', 'Fira Code', 'ui-monospace', 'monospace'],
sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],
},
colors: {
brand: '#3b82f6',
}
}
}
}
</script>
<style>
html { scroll-behavior: smooth; }
body { background: #0a0a0a; }

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — New Monitor</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<style>
body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; background: #0a0a0a; }
</style>

View File

@ -5,21 +5,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Privacy — PingQL</title>
<meta name="description" content="PingQL's privacy policy. No tracking, no data sales, no ads. We store what we need and nothing more.">
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: {
mono: ['JetBrains Mono', 'SF Mono', 'Fira Code', 'ui-monospace', 'monospace'],
sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],
}
}
}
}
</script>
<style>
body { background: #0a0a0a; }
.grid-bg {

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL — Settings</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<style>
body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; background: #0a0a0a; }
</style>

File diff suppressed because one or more lines are too long

View File

@ -79,6 +79,7 @@ const dashDir = resolve(import.meta.dir, "../dashboard");
export const dashboard = new Elysia()
.get("/dashboard/app.js", () => Bun.file(`${dashDir}/app.js`))
.get("/dashboard/app.css", () => Bun.file(`${dashDir}/app.css`))
.get("/dashboard/tailwind.css", () => Bun.file(`${dashDir}/tailwind.css`))
.get("/dashboard/query-builder.js", () => Bun.file(`${dashDir}/query-builder.js`))
// Login page

View File

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL<%= it.title ? ` — ${it.title}` : '' %></title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="/dashboard/tailwind.css">
<link rel="stylesheet" href="/dashboard/app.css">
<script src="/dashboard/app.js?v=2"></script>
<% if (it.scripts) { it.scripts.forEach(function(s) { %>

View File

@ -0,0 +1,20 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
darkMode: 'class',
content: [
'./src/**/*.{ts,html,ejs}',
'./src/dashboard/**/*.{html,js}',
],
theme: {
extend: {
fontFamily: {
mono: ['JetBrains Mono', 'SF Mono', 'Fira Code', 'ui-monospace', 'monospace'],
sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],
},
colors: {
brand: '#3b82f6',
},
},
},
plugins: [],
}