diff --git a/pos-frontend/README.md b/pos-frontend/README.md deleted file mode 100644 index c403366..0000000 --- a/pos-frontend/README.md +++ /dev/null @@ -1,36 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/pos-frontend/app/about/page.tsx b/pos-frontend/app/about/page.tsx new file mode 100644 index 0000000..ec1b2e7 --- /dev/null +++ b/pos-frontend/app/about/page.tsx @@ -0,0 +1,13 @@ +'use client' + +import React from "react" +import { Box } from '@chakra-ui/react' + +export default function Page() { + ( + + About + The stuff is here + + ) +} \ No newline at end of file diff --git a/pos-frontend/app/fonts.ts b/pos-frontend/app/fonts.ts new file mode 100644 index 0000000..271372f --- /dev/null +++ b/pos-frontend/app/fonts.ts @@ -0,0 +1,10 @@ +import { Rubik } from 'next/font/google' + +const rubik = Rubik({ + subsets: ['latin'], + variable: '--font-rubik', +}) + +export const fonts = { + rubik, +} \ No newline at end of file diff --git a/pos-frontend/app/layout.tsx b/pos-frontend/app/layout.tsx new file mode 100644 index 0000000..ea29154 --- /dev/null +++ b/pos-frontend/app/layout.tsx @@ -0,0 +1,16 @@ +import { Providers } from './providers' +import { fonts } from './fonts' + +export default function RootLayout({ + children, +}: { + children: React.ReactNode, +}) { + return ( + + + {children} + + + ) +} diff --git a/pos-frontend/app/page.tsx b/pos-frontend/app/page.tsx new file mode 100644 index 0000000..47316e7 --- /dev/null +++ b/pos-frontend/app/page.tsx @@ -0,0 +1,11 @@ +'use client' + +import { Link } from '@chakra-ui/next-js' + +export default function Page() { + return ( + + About + + ) +} \ No newline at end of file diff --git a/pos-frontend/src/app/providers.tsx b/pos-frontend/app/providers.tsx similarity index 90% rename from pos-frontend/src/app/providers.tsx rename to pos-frontend/app/providers.tsx index be7cf29..2d9170c 100644 --- a/pos-frontend/src/app/providers.tsx +++ b/pos-frontend/app/providers.tsx @@ -1,4 +1,3 @@ -// app/providers.tsx 'use client' import { ChakraProvider } from '@chakra-ui/react' diff --git a/pos-frontend/app/theme.ts b/pos-frontend/app/theme.ts new file mode 100644 index 0000000..eb41d4b --- /dev/null +++ b/pos-frontend/app/theme.ts @@ -0,0 +1,8 @@ +import { extendTheme } from "@chakra-ui/react" + +export const theme = extendTheme({ + fonts: { + heading: 'var(--font-rubik)', + body: 'var(--font-rubik)', + } +}) \ No newline at end of file diff --git a/pos-frontend/src/app/favicon.ico b/pos-frontend/src/app/favicon.ico deleted file mode 100644 index 718d6fe..0000000 Binary files a/pos-frontend/src/app/favicon.ico and /dev/null differ diff --git a/pos-frontend/src/app/globals.css b/pos-frontend/src/app/globals.css deleted file mode 100644 index f4bd77c..0000000 --- a/pos-frontend/src/app/globals.css +++ /dev/null @@ -1,107 +0,0 @@ -:root { - --max-width: 1100px; - --border-radius: 12px; - --font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", - "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", - "Fira Mono", "Droid Sans Mono", "Courier New", monospace; - - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; - - --primary-glow: conic-gradient( - from 180deg at 50% 50%, - #16abff33 0deg, - #0885ff33 55deg, - #54d6ff33 120deg, - #0071ff33 160deg, - transparent 360deg - ); - --secondary-glow: radial-gradient( - rgba(255, 255, 255, 1), - rgba(255, 255, 255, 0) - ); - - --tile-start-rgb: 239, 245, 249; - --tile-end-rgb: 228, 232, 233; - --tile-border: conic-gradient( - #00000080, - #00000040, - #00000030, - #00000020, - #00000010, - #00000010, - #00000080 - ); - - --callout-rgb: 238, 240, 241; - --callout-border-rgb: 172, 175, 176; - --card-rgb: 180, 185, 188; - --card-border-rgb: 131, 134, 135; -} - -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - - --primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0)); - --secondary-glow: linear-gradient( - to bottom right, - rgba(1, 65, 255, 0), - rgba(1, 65, 255, 0), - rgba(1, 65, 255, 0.3) - ); - - --tile-start-rgb: 2, 13, 46; - --tile-end-rgb: 2, 5, 19; - --tile-border: conic-gradient( - #ffffff80, - #ffffff40, - #ffffff30, - #ffffff20, - #ffffff10, - #ffffff10, - #ffffff80 - ); - - --callout-rgb: 20, 20, 20; - --callout-border-rgb: 108, 108, 108; - --card-rgb: 100, 100, 100; - --card-border-rgb: 200, 200, 200; - } -} - -* { - box-sizing: border-box; - padding: 0; - margin: 0; -} - -html, -body { - max-width: 100vw; - overflow-x: hidden; -} - -body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); -} - -a { - color: inherit; - text-decoration: none; -} - -@media (prefers-color-scheme: dark) { - html { - color-scheme: dark; - } -} diff --git a/pos-frontend/src/app/layout.tsx b/pos-frontend/src/app/layout.tsx deleted file mode 100644 index 74dc1d4..0000000 --- a/pos-frontend/src/app/layout.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import type { Metadata } from "next" -import { Inter } from "next/font/google" -import "./globals.css" - -const inter = Inter({ subsets: ["latin"] }) - -export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", -} - -export default function RootLayout({ - children, -}: Readonly<{ - children: React.ReactNode -}>) { - return ( - - {children} - - ) -} diff --git a/pos-frontend/src/app/page.module.css b/pos-frontend/src/app/page.module.css deleted file mode 100644 index 5c4b1e6..0000000 --- a/pos-frontend/src/app/page.module.css +++ /dev/null @@ -1,230 +0,0 @@ -.main { - display: flex; - flex-direction: column; - justify-content: space-between; - align-items: center; - padding: 6rem; - min-height: 100vh; -} - -.description { - display: inherit; - justify-content: inherit; - align-items: inherit; - font-size: 0.85rem; - max-width: var(--max-width); - width: 100%; - z-index: 2; - font-family: var(--font-mono); -} - -.description a { - display: flex; - justify-content: center; - align-items: center; - gap: 0.5rem; -} - -.description p { - position: relative; - margin: 0; - padding: 1rem; - background-color: rgba(var(--callout-rgb), 0.5); - border: 1px solid rgba(var(--callout-border-rgb), 0.3); - border-radius: var(--border-radius); -} - -.code { - font-weight: 700; - font-family: var(--font-mono); -} - -.grid { - display: grid; - grid-template-columns: repeat(4, minmax(25%, auto)); - max-width: 100%; - width: var(--max-width); -} - -.card { - padding: 1rem 1.2rem; - border-radius: var(--border-radius); - background: rgba(var(--card-rgb), 0); - border: 1px solid rgba(var(--card-border-rgb), 0); - transition: background 200ms, border 200ms; -} - -.card span { - display: inline-block; - transition: transform 200ms; -} - -.card h2 { - font-weight: 600; - margin-bottom: 0.7rem; -} - -.card p { - margin: 0; - opacity: 0.6; - font-size: 0.9rem; - line-height: 1.5; - max-width: 30ch; - text-wrap: balance; -} - -.center { - display: flex; - justify-content: center; - align-items: center; - position: relative; - padding: 4rem 0; -} - -.center::before { - background: var(--secondary-glow); - border-radius: 50%; - width: 480px; - height: 360px; - margin-left: -400px; -} - -.center::after { - background: var(--primary-glow); - width: 240px; - height: 180px; - z-index: -1; -} - -.center::before, -.center::after { - content: ""; - left: 50%; - position: absolute; - filter: blur(45px); - transform: translateZ(0); -} - -.logo { - position: relative; -} -/* Enable hover only on non-touch devices */ -@media (hover: hover) and (pointer: fine) { - .card:hover { - background: rgba(var(--card-rgb), 0.1); - border: 1px solid rgba(var(--card-border-rgb), 0.15); - } - - .card:hover span { - transform: translateX(4px); - } -} - -@media (prefers-reduced-motion) { - .card:hover span { - transform: none; - } -} - -/* Mobile */ -@media (max-width: 700px) { - .content { - padding: 4rem; - } - - .grid { - grid-template-columns: 1fr; - margin-bottom: 120px; - max-width: 320px; - text-align: center; - } - - .card { - padding: 1rem 2.5rem; - } - - .card h2 { - margin-bottom: 0.5rem; - } - - .center { - padding: 8rem 0 6rem; - } - - .center::before { - transform: none; - height: 300px; - } - - .description { - font-size: 0.8rem; - } - - .description a { - padding: 1rem; - } - - .description p, - .description div { - display: flex; - justify-content: center; - position: fixed; - width: 100%; - } - - .description p { - align-items: center; - inset: 0 0 auto; - padding: 2rem 1rem 1.4rem; - border-radius: 0; - border: none; - border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25); - background: linear-gradient( - to bottom, - rgba(var(--background-start-rgb), 1), - rgba(var(--callout-rgb), 0.5) - ); - background-clip: padding-box; - backdrop-filter: blur(24px); - } - - .description div { - align-items: flex-end; - pointer-events: none; - inset: auto 0 0; - padding: 2rem; - height: 200px; - background: linear-gradient( - to bottom, - transparent 0%, - rgb(var(--background-end-rgb)) 40% - ); - z-index: 1; - } -} - -/* Tablet and Smaller Desktop */ -@media (min-width: 701px) and (max-width: 1120px) { - .grid { - grid-template-columns: repeat(2, 50%); - } -} - -@media (prefers-color-scheme: dark) { - .vercelLogo { - filter: invert(1); - } - - .logo { - filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70); - } -} - -@keyframes rotate { - from { - transform: rotate(360deg); - } - to { - transform: rotate(0deg); - } -} diff --git a/pos-frontend/src/app/page.tsx b/pos-frontend/src/app/page.tsx deleted file mode 100644 index c6b15f1..0000000 --- a/pos-frontend/src/app/page.tsx +++ /dev/null @@ -1,95 +0,0 @@ -import Image from "next/image" -import styles from "./page.module.css" - -export default function Home() { - return ( -
-
-

- Get started by editing  - src/app/page.tsx -

-
- - By{" "} - Vercel Logo - -
-
- -
- Next.js Logo -
- -
- -

- Docs -> -

-

Find in-depth information about Next.js features and API.

- - - -

- Learn -> -

-

Learn about Next.js in an interactive course with quizzes!

- - - -

- Templates -> -

-

Explore starter templates for Next.js.

- - - -

- Deploy -> -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

- -
-
- ) -}