Merge pull request #36 from joncrangle/tailwind-cli-build
improvement: Use Tailwind CLI to build stylesheet instead of using Play CDN
This commit is contained in:
mms-gianni
GitHub
37
.github/workflows/build-css.yaml
vendored
Normal file
37
.github/workflows/build-css.yaml
vendored
Normal file
@@ -0,0 +1,37 @@
|
||||
name: Build Tailwind CSS
|
||||
|
||||
on:
|
||||
push:
|
||||
paths:
|
||||
- "handlers/form.html"
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
tailwindbuilder:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
-
|
||||
name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
-
|
||||
name: Install pnpm
|
||||
uses: pnpm/action-setup@v2
|
||||
with:
|
||||
version: 8
|
||||
-
|
||||
name: Build Tailwind CSS
|
||||
run: pnpm build
|
||||
-
|
||||
name: Commit generated stylesheet
|
||||
run: |
|
||||
if git diff --quiet; then
|
||||
echo "No changes to commit."
|
||||
exit 0
|
||||
else
|
||||
echo "Changes detected, committing..."
|
||||
git config --global user.name "Github action"
|
||||
git config --global user.email "username@users.noreply.github.com"
|
||||
git add cmd
|
||||
git commit -m "Generated stylesheet"
|
||||
git push
|
||||
fi
|
||||
2
.gitignore
vendored
2
.gitignore
vendored
@@ -2,3 +2,5 @@
|
||||
ladder
|
||||
|
||||
VERSION
|
||||
output.css
|
||||
styles.css
|
||||
10
README.md
10
README.md
@@ -170,3 +170,13 @@ See in [ruleset.yaml](ruleset.yaml) for an example.
|
||||
- match: ^ # regex to match part of path
|
||||
replace: /amp/ # (modify the url from https://www.demo.com/article/ to https://www.demo.de/amp/article/)
|
||||
```
|
||||
|
||||
## Development
|
||||
|
||||
To run a development server at http://localhost:8080:
|
||||
|
||||
```bash
|
||||
RULETSET='RULESET="./ruleset.yaml" go run cmd/main.go'
|
||||
```
|
||||
|
||||
This project uses [pnpm](https://pnpm.io/) to build a stylesheet with the [Tailwind CSS](https://tailwindcss.com/) classes. For local development, if you modify styles in `form.html`, run `pnpm build` to generate a new stylesheet.
|
||||
|
||||
12
cmd/main.go
12
cmd/main.go
@@ -1,7 +1,7 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
_ "embed"
|
||||
"embed"
|
||||
"fmt"
|
||||
"log"
|
||||
"os"
|
||||
@@ -17,6 +17,8 @@ import (
|
||||
|
||||
//go:embed favicon.ico
|
||||
var faviconData string
|
||||
//go:embed styles.css
|
||||
var cssData embed.FS
|
||||
|
||||
func main() {
|
||||
parser := argparse.NewParser("ladder", "Every Wall needs a Ladder")
|
||||
@@ -75,6 +77,14 @@ func main() {
|
||||
}
|
||||
|
||||
app.Get("/", handlers.Form)
|
||||
app.Get("/styles.css", func(c *fiber.Ctx) error {
|
||||
cssData, err := cssData.ReadFile("styles.css")
|
||||
if err != nil {
|
||||
return c.Status(fiber.StatusInternalServerError).SendString("Internal Server Error")
|
||||
}
|
||||
c.Set("Content-Type", "text/css")
|
||||
return c.Send(cssData)
|
||||
})
|
||||
app.Get("ruleset", handlers.Ruleset)
|
||||
|
||||
app.Get("raw/*", handlers.Raw)
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>ladder</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="/styles.css">
|
||||
</head>
|
||||
|
||||
<body class="antialiased text-slate-500 dark:text-slate-400 bg-white dark:bg-slate-900">
|
||||
@@ -20,12 +20,12 @@
|
||||
<form id="inputForm" method="get" class="mx-4 relative">
|
||||
<div>
|
||||
<input type="text" id="inputField" placeholder="Proxy Search" name="inputField" class="w-full text-sm leading-6 text-slate-400 rounded-md ring-1 ring-slate-900/10 shadow-sm py-1.5 pl-2 pr-3 hover:ring-slate-300 dark:bg-slate-800 dark:highlight-white/5 dark:hover:bg-slate-700" required autofocus>
|
||||
<button id="clearButton" type="button" aria-label="Clear Search" title="Clear Search" class="hidden absolute inset-y-0 right-0 flex items-center pr-2 hover:text-slate-400 hover:dark:text-slate-300" tabindex="-1">
|
||||
<button id="clearButton" type="button" aria-label="Clear Search" title="Clear Search" class="hidden absolute inset-y-0 right-0 items-center pr-2 hover:text-slate-400 hover:dark:text-slate-300" tabindex="-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round""><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<footer class="mt-10 text-center text-slate-600 dark:text-slate-400 mx-4">
|
||||
<footer class="mt-10 mx-4 text-center text-slate-600 dark:text-slate-400">
|
||||
<p>
|
||||
Code Licensed Under GPL v3.0 |
|
||||
<a href="https://github.com/everywall/ladder" class="hover:text-blue-500 hover:underline underline-offset-2 transition-colors duration-300">View Source</a> |
|
||||
|
||||
9
package.json
Normal file
9
package.json
Normal file
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"scripts": {
|
||||
"build": "pnpx tailwindcss -i ./styles/input.css -o ./styles/output.css --build && pnpx minify ./styles/output.css > ./cmd/styles.css"
|
||||
},
|
||||
"devDependencies": {
|
||||
"minify": "^10.5.2",
|
||||
"tailwindcss": "^3.3.5"
|
||||
}
|
||||
}
|
||||
3
styles/input.css
Normal file
3
styles/input.css
Normal file
@@ -0,0 +1,3 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
9
tailwind.config.js
Normal file
9
tailwind.config.js
Normal file
@@ -0,0 +1,9 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: ["./handlers/**/*.html"],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user