fix: rename css file to force update cache, fixes #141

This commit is contained in:
C4illin 2024-09-25 23:47:18 +02:00
parent fa5446c446
commit 47139a550b
5 changed files with 43 additions and 24 deletions

2
.gitignore vendored
View file

@ -48,4 +48,4 @@ package-lock.json
/data /data
/Bruno /Bruno
/tsconfig.tsbuildinfo /tsconfig.tsbuildinfo
/src/public/style.css /src/public/generated.css

View file

@ -56,7 +56,7 @@ RUN apk --no-cache add \
COPY --from=install /temp/prod/node_modules node_modules COPY --from=install /temp/prod/node_modules node_modules
COPY --from=builder /root/.cargo/bin/resvg /usr/local/bin/resvg COPY --from=builder /root/.cargo/bin/resvg /usr/local/bin/resvg
COPY --from=prerelease /app/src/public/style.css /app/src/public/ COPY --from=prerelease /app/src/public/generated.css /app/src/public/
# COPY --from=prerelease /app/src/index.tsx /app/src/ # COPY --from=prerelease /app/src/index.tsx /app/src/
# COPY --from=prerelease /app/package.json . # COPY --from=prerelease /app/package.json .
COPY . . COPY . .

View file

@ -7,7 +7,7 @@ export const BaseHtml = ({
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title safe>{title}</title> <title safe>{title}</title>
<link rel="stylesheet" href="/style.css" /> <link rel="stylesheet" href="/generated.css" />
<link <link
rel="apple-touch-icon" rel="apple-touch-icon"
sizes="180x180" sizes="180x180"

View file

@ -9,7 +9,7 @@ export const generateTailwind = async () => {
return postcss([tw(config)]).process(sourceText, { return postcss([tw(config)]).process(sourceText, {
from: "./src/main.css", from: "./src/main.css",
to: "./public/style.css", to: "./public/generated.css",
}); });
}); });

View file

@ -1,12 +1,12 @@
import { randomInt, randomUUID } from "node:crypto";
import { rmSync } from "node:fs";
import { mkdir, unlink } from "node:fs/promises";
import cookie from "@elysiajs/cookie"; import cookie from "@elysiajs/cookie";
import { html } from "@elysiajs/html"; import { html } from "@elysiajs/html";
import { jwt, type JWTPayloadSpec } from "@elysiajs/jwt"; import { jwt, type JWTPayloadSpec } from "@elysiajs/jwt";
import { staticPlugin } from "@elysiajs/static"; import { staticPlugin } from "@elysiajs/static";
import { Database } from "bun:sqlite"; import { Database } from "bun:sqlite";
import { Elysia, t } from "elysia"; import { Elysia, t } from "elysia";
import { randomInt, randomUUID } from "node:crypto";
import { rmSync } from "node:fs";
import { mkdir, unlink } from "node:fs/promises";
import { BaseHtml } from "./components/base"; import { BaseHtml } from "./components/base";
import { Header } from "./components/header"; import { Header } from "./components/header";
import { import {
@ -173,7 +173,8 @@ const app = new Elysia({
Report any issues on{" "} Report any issues on{" "}
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href="https://github.com/C4illin/ConvertX"> href="https://github.com/C4illin/ConvertX"
>
GitHub GitHub
</a> </a>
. .
@ -343,7 +344,11 @@ const app = new Elysia({
</fieldset> </fieldset>
<div role="group"> <div role="group">
{ACCOUNT_REGISTRATION ? ( {ACCOUNT_REGISTRATION ? (
<a href="/register" role="button" class="btn-primary w-full"> <a
href="/register"
role="button"
class="btn-primary w-full"
>
Register an account Register an account
</a> </a>
) : null} ) : null}
@ -528,7 +533,8 @@ const app = new Elysia({
</div> </div>
<div <div
id="dropzone" id="dropzone"
class="relative flex h-48 w-full items-center justify-center rounded border border-dashed border-gray-700 transition-all hover:border-gray-600 [&.dragover]:border-4 [&.dragover]:border-gray-500"> class="relative flex h-48 w-full items-center justify-center rounded border border-dashed border-gray-700 transition-all hover:border-gray-600 [&.dragover]:border-4 [&.dragover]:border-gray-500"
>
<span> <span>
<b>Choose a file</b> or drag it here <b>Choose a file</b> or drag it here
</span> </span>
@ -543,7 +549,8 @@ const app = new Elysia({
<form <form
method="post" method="post"
action="/convert" action="/convert"
class="relative mx-auto mb-[35vh] w-full max-w-4xl"> class="relative mx-auto mb-[35vh] w-full max-w-4xl"
>
<input type="hidden" name="file_names" id="file_names" /> <input type="hidden" name="file_names" id="file_names" />
<article class="article w-full"> <article class="article w-full">
<input <input
@ -559,7 +566,8 @@ const app = new Elysia({
([converter, targets]) => ( ([converter, targets]) => (
<article <article
class="convert_to_group w-full border-b border-gray-700 p-4" class="convert_to_group w-full border-b border-gray-700 p-4"
data-converter={converter}> data-converter={converter}
>
<header class="mb-2 w-full text-xl font-bold" safe> <header class="mb-2 w-full text-xl font-bold" safe>
{converter} {converter}
</header> </header>
@ -573,7 +581,8 @@ const app = new Elysia({
data-target={target} data-target={target}
data-converter={converter} data-converter={converter}
type="button" type="button"
safe> safe
>
{target} {target}
</button> </button>
))} ))}
@ -588,7 +597,8 @@ const app = new Elysia({
name="convert_to" name="convert_to"
aria-label="Convert to" aria-label="Convert to"
required required
hidden> hidden
>
<option selected disabled value=""> <option selected disabled value="">
Convert to Convert to
</option> </option>
@ -624,7 +634,8 @@ const app = new Elysia({
([converter, targets]) => ( ([converter, targets]) => (
<article <article
class="convert_to_group w-full border-b border-gray-700 p-4" class="convert_to_group w-full border-b border-gray-700 p-4"
data-converter={converter}> data-converter={converter}
>
<header class="mb-2 w-full text-xl font-bold" safe> <header class="mb-2 w-full text-xl font-bold" safe>
{converter} {converter}
</header> </header>
@ -638,7 +649,8 @@ const app = new Elysia({
data-target={target} data-target={target}
data-converter={converter} data-converter={converter}
type="button" type="button"
safe> safe
>
{target} {target}
</button> </button>
))} ))}
@ -901,7 +913,8 @@ const app = new Elysia({
<td> <td>
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href={`/results/${job.id}`}> href={`/results/${job.id}`}
>
View View
</a> </a>
</td> </td>
@ -966,7 +979,8 @@ const app = new Elysia({
onclick="downloadAll()" onclick="downloadAll()"
{...(files.length !== job.num_files {...(files.length !== job.num_files
? { disabled: true, "aria-busy": "true" } ? { disabled: true, "aria-busy": "true" }
: "")}> : "")}
>
{files.length === job.num_files {files.length === job.num_files
? "Download All" ? "Download All"
: "Converting..."} : "Converting..."}
@ -995,7 +1009,8 @@ const app = new Elysia({
<td> <td>
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href={`/download/${outputPath}${file.output_file_name}`}> href={`/download/${outputPath}${file.output_file_name}`}
>
View View
</a> </a>
</td> </td>
@ -1003,7 +1018,8 @@ const app = new Elysia({
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href={`/download/${outputPath}${file.output_file_name}`} href={`/download/${outputPath}${file.output_file_name}`}
download={file.output_file_name}> download={file.output_file_name}
>
Download Download
</a> </a>
</td> </td>
@ -1066,7 +1082,8 @@ const app = new Elysia({
onclick="downloadAll()" onclick="downloadAll()"
{...(files.length !== job.num_files {...(files.length !== job.num_files
? { disabled: true, "aria-busy": "true" } ? { disabled: true, "aria-busy": "true" }
: "")}> : "")}
>
{files.length === job.num_files {files.length === job.num_files
? "Download All" ? "Download All"
: "Converting..."} : "Converting..."}
@ -1095,7 +1112,8 @@ const app = new Elysia({
<td> <td>
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href={`/download/${outputPath}${file.output_file_name}`}> href={`/download/${outputPath}${file.output_file_name}`}
>
View View
</a> </a>
</td> </td>
@ -1103,7 +1121,8 @@ const app = new Elysia({
<a <a
class="text-lime-500 underline hover:text-lime-400" class="text-lime-500 underline hover:text-lime-400"
href={`/download/${outputPath}${file.output_file_name}`} href={`/download/${outputPath}${file.output_file_name}`}
download={file.output_file_name}> download={file.output_file_name}
>
Download Download
</a> </a>
</td> </td>
@ -1240,7 +1259,7 @@ if (process.env.NODE_ENV !== "production") {
await import("./helpers/tailwind").then(async ({ generateTailwind }) => { await import("./helpers/tailwind").then(async ({ generateTailwind }) => {
const result = await generateTailwind(); const result = await generateTailwind();
app.get("/style.css", ({ set }) => { app.get("/generated.css", ({ set }) => {
set.headers["content-type"] = "text/css"; set.headers["content-type"] = "text/css";
return result; return result;
}); });