feat: frontend PWA scaffolding with React and Tailwind

This commit is contained in:
Daniel Bedeleanu
2026-04-10 14:05:50 +03:00
parent 373652e8b8
commit 7f8b24aabb
33622 changed files with 4317382 additions and 0 deletions

23
frontend/app/globals.css Normal file
View File

@@ -0,0 +1,23 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@import "bootstrap-icons/font/bootstrap-icons.css";
:root {
--background: #ffffff;
--foreground: #171717;
}
@media (prefers-color-scheme: dark) {
:root {
--background: #0a0a0a;
--foreground: #ededed;
}
}
body {
color: var(--foreground);
background: var(--background);
font-family: Arial, Helvetica, sans-serif;
}

33
frontend/app/layout.tsx Normal file
View File

@@ -0,0 +1,33 @@
import type { Metadata, Viewport } from "next";
import "./globals.css";
export const metadata: Metadata = {
title: "Inventory System",
description: "Web & Mobile Inventory Management",
};
export const viewport: Viewport = {
themeColor: "#3b82f6",
width: "device-width",
initialScale: 1,
maximumScale: 1,
userScalable: false,
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<head>
<link rel="manifest" href="/manifest.json" />
<link rel="apple-touch-icon" href="/icon-192x192.png" />
</head>
<body className="antialiased">
{children}
</body>
</html>
);
}

34
frontend/app/page.tsx Normal file
View File

@@ -0,0 +1,34 @@
export default function Home() {
return (
<main className="flex min-h-screen flex-col items-center justify-center p-24 bg-background text-foreground">
<div className="z-10 max-w-5xl w-full items-center justify-between font-mono text-sm flex">
<p className="fixed left-0 top-0 flex w-full justify-center border-b border-gray-300 bg-gradient-to-b from-zinc-200 pb-6 pt-8 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30">
Inventory API Status:&nbsp;
<code className="font-bold">Checking...</code>
</p>
</div>
<div className="flex flex-col items-center gap-8 mt-20">
<h1 className="text-4xl font-bold flex items-center gap-4">
<i className="bi bi-box-seam text-primary"></i>
Inventory PWA
</h1>
<p className="text-xl text-center max-w-md">
Welcome to your unified inventory management system.
Ready for mobile scanning and offline operations.
</p>
<div className="flex gap-4">
<button className="bg-primary text-white px-6 py-3 rounded-lg shadow-lg hover:bg-blue-600 transition-colors flex items-center gap-2">
<i className="bi bi-qr-code-scan"></i>
Start Scanning
</button>
<button className="border border-gray-300 px-6 py-3 rounded-lg hover:bg-gray-100 transition-colors flex items-center gap-2">
<i className="bi bi-list-ul"></i>
View Inventory
</button>
</div>
</div>
</main>
);
}