refactor!: change css library to picocss

This commit is contained in:
Alexander Navarro 2025-04-15 14:08:31 -04:00
parent 48b0252ec4
commit 27037a9f75
6 changed files with 25 additions and 21 deletions

View file

@ -15,7 +15,6 @@ fn cmd(cmd: &mut Command) {
fn main() {
let out_dir = env::var("OUT_DIR").unwrap();
cmd(Command::new("bun").args(["install"]));
cmd(Command::new("bun").args([
"run",
"tmpl-build-and-load",

View file

@ -4,8 +4,8 @@
"": {
"name": "compendium",
"dependencies": {
"@mini-strap/components": "^0.1.0",
"@mini-strap/core": "^0.1.2",
"@picocss/pico": "^2.1.1",
"htmx.org": "2.0.4",
},
"devDependencies": {
@ -22,8 +22,6 @@
"@alecodes/tmpl-build-and-load": ["@alecodes/tmpl-build-and-load@0.1.3", "https://git.alecodes.page/api/packages/alecodes/npm/%40alecodes%2Ftmpl-build-and-load/-/0.1.3/tmpl-build-and-load-0.1.3.tgz", { "dependencies": { "@alecodes/bun-plugin-sass": "^0.1.3" }, "peerDependencies": { "typescript": "^5" }, "bin": { "@alecodes/tmpl-build-and-load": "index.ts" } }, "sha512-MsLmMxxrPtAJXYC1QrTVIiuKSNOeNgX/Z5u9jsSlc+pUzxnBGIEctiqqt6rYn1lqdD8M4aTmVlZqzvacE6dujQ=="],
"@mini-strap/components": ["@mini-strap/components@0.1.0", "https://git.alecodes.page/api/packages/alecodes/npm/%40mini-strap%2Fcomponents/-/0.1.0/components-0.1.0.tgz", { "peerDependencies": { "typescript": "^5.0.0" } }, "sha512-0FQxVSnk+YcFZpw7ldKncjVxtWWtMMUD9akNy4c1T4M3hgKf1s4ymo0lsTSMmM4o811VeSYfEWKXFXJWH9nU2A=="],
"@mini-strap/core": ["@mini-strap/core@0.1.2", "https://git.alecodes.page/api/packages/alecodes/npm/%40mini-strap%2Fcore/-/0.1.2/core-0.1.2.tgz", { "peerDependencies": { "typescript": "^5.0.0" }, "bin": { "@mini-strap/core": "build.ts" } }, "sha512-bt9su5jpslUMYmoNLz7s8P6RlN7Knriy8BtHBfVnpEizOh3DroStRr+yDCSLfhyByKXo6sa9ZNytc25ianEtbA=="],
"@parcel/watcher": ["@parcel/watcher@2.5.1", "", { "dependencies": { "detect-libc": "^1.0.3", "is-glob": "^4.0.3", "micromatch": "^4.0.5", "node-addon-api": "^7.0.0" }, "optionalDependencies": { "@parcel/watcher-android-arm64": "2.5.1", "@parcel/watcher-darwin-arm64": "2.5.1", "@parcel/watcher-darwin-x64": "2.5.1", "@parcel/watcher-freebsd-x64": "2.5.1", "@parcel/watcher-linux-arm-glibc": "2.5.1", "@parcel/watcher-linux-arm-musl": "2.5.1", "@parcel/watcher-linux-arm64-glibc": "2.5.1", "@parcel/watcher-linux-arm64-musl": "2.5.1", "@parcel/watcher-linux-x64-glibc": "2.5.1", "@parcel/watcher-linux-x64-musl": "2.5.1", "@parcel/watcher-win32-arm64": "2.5.1", "@parcel/watcher-win32-ia32": "2.5.1", "@parcel/watcher-win32-x64": "2.5.1" } }, "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg=="],
@ -54,6 +52,8 @@
"@parcel/watcher-win32-x64": ["@parcel/watcher-win32-x64@2.5.1", "", { "os": "win32", "cpu": "x64" }, "sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA=="],
"@picocss/pico": ["@picocss/pico@2.1.1", "", {}, "sha512-kIDugA7Ps4U+2BHxiNHmvgPIQDWPDU4IeU6TNRdvXQM1uZX+FibqDQT2xUOnnO2yq/LUHcwnGlu1hvf4KfXnMg=="],
"@types/bun": ["@types/bun@1.2.2", "", { "dependencies": { "bun-types": "1.2.2" } }, "sha512-tr74gdku+AEDN5ergNiBnplr7hpDp3V1h7fqI2GcR/rsUaM39jpSeKH0TFibRvU0KwniRx5POgaYnaXbk0hU+w=="],
"@types/node": ["@types/node@22.13.4", "", { "dependencies": { "undici-types": "~6.20.0" } }, "sha512-ywP2X0DYtX3y08eFVx5fNIw7/uIv8hYUKgXoK8oayJlLnKcRfEYCxWMVE1XagUdVtCJlZT1AU4LXEABW+L1Peg=="],

View file

@ -1 +1,11 @@
@use "@mini-strap/core";
@use "@picocss/pico/scss/pico.scss" with (
$theme-color: "cyan",
$enable-semantic-container: true
);
:root {
--pico-form-element-spacing-vertical: 0.25rem;
--pico-form-element-spacing-horizontal: 0.5rem;
}

View file

@ -3,14 +3,9 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="@mini-strap/core" />
<link rel="stylesheet" href="@mini-strap/components/offcanvas/style.scss" />
<link rel="stylesheet"
href="@mini-strap/components/accordion/accordion.scss" />
<link rel="stylesheet" href="@mini-strap/components/navbar/navbar.scss" />
<meta name="color-scheme" content="dark light">
<link rel="stylesheet" href="../css/style.scss" />
<script type="module" src="htmx.org"></script>
<script type="module" src="@mini-strap/components/offcanvas/index.ts"></script>
<title>
{% block title %}Axum web service!{% endblock %}
</title>
@ -18,14 +13,14 @@
<body>
<header>
{% include "partials/header.html" %}
{% include "partials/header.html" ignore missing %}
</header>
<main class="msp-container">
<nav class="msp-d-sm-none msp-d-flex msp-justify-content-end">
<button class="msp-offcanvas-toggle" data-msp-target="#main-offcanvas">Toggle</button>
</nav>
<main>
{% block content %}{% endblock %}
</main>
<footer>
{% include "partials/footer.html" ignore missing %}
</footer>
</body>
</html>

View file

@ -2,14 +2,14 @@
{% block content %}
<div class="msp-hstack msp-justify-content-end msp-mb-3">
<button class="msp-btn-sm" hx-get="/" hx-target="#example-table">Refresh</button>
<div class="msp-hstack msp-justify-content-between">
<h1>Axum example!</h1>
<button class="" hx-get="/" hx-target="#example-table">Refresh</button>
</div>
<h1>Axum example!</h1>
{% block htmx %}
<table id="example-table">
<table id="example-table" class="striped">
<thead>
<tr>
<th class="msp-text-center">Database</th>

View file

@ -11,8 +11,8 @@
},
"type": "module",
"dependencies": {
"@mini-strap/components": "^0.1.0",
"@mini-strap/core": "^0.1.2",
"@picocss/pico": "^2.1.1",
"htmx.org": "2.0.4"
}
}