theo/werkzeugkiste
1
0
Fork 0
mirror of https://github.com/theoleuthardt/werkzeugkiste.git synced 2026-06-13 09:37:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: new dropdown menu for output file format as standalone component

Browse source
This commit is contained in:
theoleuthardt 2025-02-15 23:11:07 +01:00
parent 9e2215b70a
commit 2c582aaa60
2 changed files with 104 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

21
frontend/src/app/doc-converter/page.tsx
View file

@ -6,6 +6,7 @@ import Footer from "../../components/Footer";
import Button from "../../components/Button";
import Link from "next/link";
import { ChevronDown, ChevronUp } from "lucide-react";
import Dropdown from "@/components/Dropdown";
export default function DocConverter() {
const [file, setFile] = useState<File | null>(null);
@ -60,12 +61,16 @@ export default function DocConverter() {
<Navbar renderHomeLink={true} />
<div className="w-screen h-auto min-h-[calc(100vh-80px-60px)] flex flex-1 flex-col items-center justify-center">
<h2 className="text-5xl font-bold text-white mb-16">doc-converter</h2>
<input
type="file"
className="border-2 border-white p-3 rounded-xl text-center text-white"
id="documentUpload"
onChange={handleFileChange}
/>
<div className="h-36 flex flex-row items-center justify-center gap-20">
<input
type="file"
className="h-14 border-2 border-white p-3 rounded-xl text-center text-white"
id="documentUpload"
onChange={handleFileChange}
/>
{/* TODO: Fix Dropdown menu placement */}
<Dropdown content="output format" className="h-14" />
</div>
<div className={"flex flex-row items-center gap-4 mt-4 mb-16"}>
{downloadUrl ? (
<Link id="downloadPDF" href={downloadUrl}>
@ -84,10 +89,6 @@ export default function DocConverter() {
/>
)}
</div>
{
// TODO: Fix Table Head widths (fixed and the same as the max body width)
// TODO: Add hover animation to table head (scale-110, blue text, blue border)
}
<div className="overflow-hidden text-xl rounded-lg border border-white mb-16 transition-all duration-300 ease-in-out hover:border-blue-400">
<div
className="cursor-pointer flex justify-between items-center"