hrfee/jfa-go
1
0
Fork 0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-12-22 09:00:10 +00:00
Code Issues Projects Releases Wiki Activity

site: properly fix modals

Browse Source 
uncss was clearing out the "block" and "animate-fade-in/out", so removed
that step since tailwind does a similar thing anyway.
This commit is contained in:
Harvey Tindall 2022-12-29 21:15:07 +00:00
parent 6bab805528
commit 47d00d1f27
Signed by: hrfee
GPG Key ID: BBC65952848FB1A2
5 changed files with 29 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
site/Makefile
View File

@ -8,9 +8,7 @@ all:
../scripts/dark-variant.sh tempts
npx esbuild --bundle tempts/main.ts --outfile=out/main.js --minify
npx esbuild --bundle base.css --outfile=out/bundle.css --external:remixicon.css --external:modal.css --minify
npx tailwindcss -i out/bundle.css -o out/bundle.css
cd out && npx uncss index.html --stylesheets bundle.css > _bundle.css; cd ..
mv out/_bundle.css out/bundle.css
npx tailwindcss -c tailwind.config.js -i out/bundle.css -o out/bundle.css
cd out && npx uncss index.html --stylesheets remixicon.css > _remixicon.css; cd ..
mv out/_remixicon.css out/remixicon.css
cp ../static/* out/
@ -26,7 +24,7 @@ debug:
../scripts/dark-variant.sh tempts
npx esbuild --bundle base.css --outfile=out/bundle.css --external:remixicon.css --minify
npx esbuild --bundle ts/main.ts --sourcemap --outfile=out/main.js --minify
npx tailwindcss -i out/bundle.css -o out/bundle.css
npx tailwindcss -c tailwind.config.js -i out/bundle.css -o out/bundle.css
cp ../static/* out/
monitor:

1
site/base.css
View File

@ -1,4 +1,5 @@
@import "../css/base.css";
@import "../css/modal.css";
:root {
--c-1: #ffe3ef;

1
site/index.html
View File

@ -2,7 +2,6 @@
<html lang="en" class="light-theme">
<head>
<link rel="stylesheet" type="text/css" href="bundle.css">
<link rel="stylesheet" type="text/css" href="modal.css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="Description" content="jfa-go, a better way to manage Jellyfin users.">

23
site/safelist.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html lang="en" class="light-theme">
<head>
<link rel="stylesheet" type="text/css" href="bundle.css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="Description" content="jfa-go, a better way to manage Jellyfin users.">
<meta name="color-scheme" content="dark light">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#603cba">
<meta name="theme-color" content="#ffffff">
<title>jfa-go - a better way to manage Jellyfin users</title>
</head>
<body class="max-w-full overflow-x-hidden section">
<div id="modal-deb" class="modal block animate-fade-in animate-fade-out">
</div>
</body>
</html>

4
site/tailwind.config.js
View File

@ -2,8 +2,9 @@ let colors = require("tailwindcss/colors")
let dark = require("../css/dark");
module.exports = {
content: ["./index.html", "./out/main.js"],
content: ["./safelist.html", "./index.html", "./out/main.js"],
darkMode: 'class',
important: true,
theme: {
extend: {
keyframes: {
@ -44,5 +45,6 @@ module.exports = {
}
}
},
safelist: ["block", "animate-fade-in", "animate-fade-out"],
plugins: [require("a17t")],
}