🏗️ Migrerer fra Next.js til Vite react
Co-authored-by: Øydis Kind Refsum <oydis.kind.refsum@nav.no> Co-authored-by: Christian Bulow Skovborg <christian.bulow.skovborg@nav.no> Co-authored-by: Amalie Mansåker <amalie.erdal.mansaker@nav.no> Co-authored-by: Sindre Kjelsrud <sindre.kjelsrud@nav.no>
This commit is contained in:
Markus Johansen
parent
aafa3cf243
commit
177d6c7cd8
40 changed files with 4738 additions and 2502 deletions
5
next-frontend/.eslintrc.json
Normal file
5
next-frontend/.eslintrc.json
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"extends": [
|
||||
"next/core-web-vitals"
|
||||
]
|
||||
}
|
||||
7
next-frontend/.stylelintrc
Normal file
7
next-frontend/.stylelintrc
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"stylelint": {
|
||||
"extends": [
|
||||
"@navikt/aksel-stylelint/recommended"
|
||||
]
|
||||
}
|
||||
}
|
||||
38
next-frontend/README.md
Normal file
38
next-frontend/README.md
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
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
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
|
||||
|
||||
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
|
||||
|
||||
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
|
||||
|
||||
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.
|
||||
33
next-frontend/components/BildeOpplastning.tsx
Normal file
33
next-frontend/components/BildeOpplastning.tsx
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
import { FileImageIcon, UploadIcon } from "@navikt/aksel-icons"
|
||||
import { Button } from "@navikt/ds-react"
|
||||
|
||||
|
||||
/**
|
||||
* Inkluderer en knapp for opplastning i finder/explorer.
|
||||
* Inkluderer et felt for drag and drop opplastning av bilder
|
||||
* @returns `Drag and drop` komponent for filopplastning av skjermbilder
|
||||
*/
|
||||
const BildeOpplastning = () => {
|
||||
return(
|
||||
<div className="flex gap-2 flex-col">
|
||||
<div className="
|
||||
h-48 p-5 bg-bg-subtle hover:bg-surface-selected border-2 border-blue-500
|
||||
rounded-lg border-dashed flex flex-col items-center justify-center text-center gap-2
|
||||
">
|
||||
<FileImageIcon
|
||||
fontSize="3.5rem"
|
||||
className="text-blue-500"
|
||||
/>
|
||||
<p className="text-surface-neutral">Dra og slipp skjermbilder her!</p>
|
||||
</div>
|
||||
<Button
|
||||
variant="secondary"
|
||||
icon={<UploadIcon />}
|
||||
>
|
||||
Last opp skjermbilder
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
export default BildeOpplastning
|
||||
47
next-frontend/components/CardsContainer.tsx
Normal file
47
next-frontend/components/CardsContainer.tsx
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
import FeilCard from "./FeilCard";
|
||||
|
||||
type FeilMelding = {
|
||||
tittel: String
|
||||
beskrivelse: String
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @returns Komponent for returnering av konteiner med alle feilinnmeldingene.
|
||||
*/
|
||||
const CardsContainer = () => {
|
||||
|
||||
const feilMeldinger: FeilMelding[] = [
|
||||
{
|
||||
tittel: "Mangel på hensyn til tariffoppgjør",
|
||||
beskrivelse: "Det har vært ett tariffoppgjør og speil sier sykepengene må tilbakekreves, noe som er feil. (sier vi.. har ikke domenekunnskap)"
|
||||
},
|
||||
{
|
||||
tittel: "Speil sier NAV må tilbakekreve sykepenger på feil grunnlag",
|
||||
beskrivelse: "baluba"
|
||||
},
|
||||
{
|
||||
tittel: "Feil A",
|
||||
beskrivelse: "Lorem Ipsum"
|
||||
},
|
||||
{
|
||||
tittel: "Feil B",
|
||||
beskrivelse: "dolor"
|
||||
},
|
||||
{
|
||||
tittel: "Håndkle på hue",
|
||||
beskrivelse: "Bombastic side eye"
|
||||
}
|
||||
]
|
||||
|
||||
return(
|
||||
<div>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
{feilMeldinger.map((feilMelding) => (
|
||||
<FeilCard key={feilMelding.toString()} tittel={feilMelding.tittel} beskrivelse={feilMelding.beskrivelse}/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
export default CardsContainer
|
||||
38
next-frontend/components/FeilCard.tsx
Normal file
38
next-frontend/components/FeilCard.tsx
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
import "@navikt/ds-css";
|
||||
import { ExpansionCard, Tag } from "@navikt/ds-react";
|
||||
|
||||
interface feilmeldingInterface {
|
||||
tittel: String,
|
||||
beskrivelse: String
|
||||
}
|
||||
|
||||
const TagBar = () => {
|
||||
return (
|
||||
<div className="flex gap-8 mt-4">
|
||||
<Tag variant="info">Jobbes med</Tag>
|
||||
<div className="flex gap-2">
|
||||
<Tag variant="neutral">Spleiselaget</Tag>
|
||||
<Tag variant="warning">Haster</Tag>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const FeilCard = (props: feilmeldingInterface) => {
|
||||
return (
|
||||
<ExpansionCard aria-label="tekst">
|
||||
<ExpansionCard.Header>
|
||||
<ExpansionCard.Title>{props.tittel}</ExpansionCard.Title>
|
||||
<ExpansionCard.Description>
|
||||
{props.beskrivelse}
|
||||
</ExpansionCard.Description>
|
||||
<TagBar />
|
||||
</ExpansionCard.Header>
|
||||
<ExpansionCard.Content>
|
||||
Hællæ
|
||||
</ExpansionCard.Content>
|
||||
</ExpansionCard>
|
||||
)
|
||||
}
|
||||
|
||||
export default FeilCard;
|
||||
21
next-frontend/components/Header.tsx
Normal file
21
next-frontend/components/Header.tsx
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
import { MenuGridIcon } from "@navikt/aksel-icons"
|
||||
import { InternalHeader, Dropdown } from "@navikt/ds-react"
|
||||
|
||||
const Header = () => {
|
||||
return(
|
||||
<InternalHeader>
|
||||
<InternalHeader.Title href="/#home">
|
||||
Sprik
|
||||
</InternalHeader.Title>
|
||||
<Dropdown>
|
||||
<InternalHeader.Button
|
||||
as={Dropdown.Toggle}
|
||||
>
|
||||
<MenuGridIcon title="MenuGridIconer og oppslagsverk" />
|
||||
</InternalHeader.Button>
|
||||
{/* <Dropdown.Menu /> */}
|
||||
</Dropdown>
|
||||
</InternalHeader>
|
||||
)
|
||||
}
|
||||
export default Header
|
||||
37
next-frontend/package.json
Normal file
37
next-frontend/package.json
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
{
|
||||
"name": "frontend",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "yarn dev",
|
||||
"build": "yarn build",
|
||||
"start": "yarn start",
|
||||
"lint": "yarn lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@navikt/aksel-icons": "^4.4.2",
|
||||
"@navikt/ds-css": "^4.4.2",
|
||||
"@navikt/ds-react": "^4.4.2",
|
||||
"@navikt/ds-tailwind": "^4.6.1",
|
||||
"@navikt/ds-tokens": "^4.6.1",
|
||||
"@types/node": "20.3.2",
|
||||
"@types/react": "18.2.14",
|
||||
"@types/react-dom": "18.2.6",
|
||||
"autoprefixer": "10.4.14",
|
||||
"axios": "^1.4.0",
|
||||
"eslint": "8.43.0",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"react-router-dom": "^6.14.0",
|
||||
"swr": "^2.2.0",
|
||||
"tailwindcss": "3.3.2",
|
||||
"typescript": "5.1.5"
|
||||
},
|
||||
|
||||
"devDependencies": {
|
||||
"@navikt/aksel-stylelint": "^4.5.0",
|
||||
"stylelint": "^15.10.1",
|
||||
"vite": "^4.4.4",
|
||||
"@vitejs/plugin-react": "^2.1.0"
|
||||
}
|
||||
}
|
||||
6
next-frontend/pages/_app.tsx
Normal file
6
next-frontend/pages/_app.tsx
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
import '@/styles/globals.css'
|
||||
import type { AppProps } from 'next/app'
|
||||
|
||||
export default function App({ Component, pageProps }: AppProps) {
|
||||
return <Component {...pageProps} />
|
||||
}
|
||||
13
next-frontend/pages/_document.tsx
Normal file
13
next-frontend/pages/_document.tsx
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
import { Html, Head, Main, NextScript } from 'next/document'
|
||||
|
||||
export default function Document() {
|
||||
return (
|
||||
<Html lang="en">
|
||||
<Head />
|
||||
<body>
|
||||
<Main />
|
||||
<NextScript />
|
||||
</body>
|
||||
</Html>
|
||||
)
|
||||
}
|
||||
13
next-frontend/pages/api/http.ts
Normal file
13
next-frontend/pages/api/http.ts
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
import axios from "axios";
|
||||
|
||||
export default function post(route: String, data?: Object) {
|
||||
axios.post("https://helse-sprik.intern.dev.nav.no" + route, data, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).then((response) => {
|
||||
console.log(response)
|
||||
}).catch((error) => {
|
||||
console.log(error);
|
||||
})
|
||||
}
|
||||
90
next-frontend/pages/feil/index.tsx
Normal file
90
next-frontend/pages/feil/index.tsx
Normal file
|
|
@ -0,0 +1,90 @@
|
|||
import "@navikt/ds-css";
|
||||
|
||||
import { ArrowLeftIcon, BugIcon, UploadIcon } from "@navikt/aksel-icons";
|
||||
import { Button, Heading, TextField, Textarea } from "@navikt/ds-react";
|
||||
import post from "../api/http";
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import router from "next/router";
|
||||
import BildeOpplastning from "@/components/BildeOpplastning";
|
||||
import Header from "@/components/Header";
|
||||
|
||||
export default function Feil() {
|
||||
const [tittel, setTittel] = useState("");
|
||||
const [beskrivelse, setBeskrivelse] = useState("");
|
||||
|
||||
const handleSubmit = () => {
|
||||
axios.post("https://helse-sprik.intern.dev.nav.no/nyFeil",
|
||||
{
|
||||
"data": {
|
||||
tittel: tittel,
|
||||
beskrivelse: beskrivelse,
|
||||
dato: new Date()
|
||||
}
|
||||
}, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).then((response) => {
|
||||
console.log(response)
|
||||
}).catch((error) => {
|
||||
console.log(error);
|
||||
})
|
||||
}
|
||||
|
||||
// TODO: clear data fra felter
|
||||
|
||||
|
||||
return (
|
||||
<main className="flex flex-col h-screen">
|
||||
<Header/>
|
||||
<div className="flex grow">
|
||||
<div className="w-1/4 bg-bg-subtle"></div>
|
||||
<div className="flex flex-col justify-center gap-16 p-8 px-16 grow">
|
||||
<div className=" flex flex-col gap-2 justify-center">
|
||||
<BugIcon
|
||||
title="Insekts ikon"
|
||||
fontSize="3rem"
|
||||
/>
|
||||
<Heading
|
||||
level="1"
|
||||
size="xlarge"
|
||||
>
|
||||
Innmelding av feil i speil
|
||||
</Heading>
|
||||
</div>
|
||||
<div className="w-1/2 flex flex-col gap-4 justify-center">
|
||||
<TextField
|
||||
label="Tittel"
|
||||
onChange={e => setTittel(e.target.value)}
|
||||
/>
|
||||
<Textarea
|
||||
label="Beskrivelse"
|
||||
description="Detaljert beskrivelse av problemet"
|
||||
onChange={e => setBeskrivelse(e.target.value)}
|
||||
/>
|
||||
<BildeOpplastning/>
|
||||
</div>
|
||||
<div className="w-1/2 flex flex-col gap-2 justify-center">
|
||||
<Button
|
||||
onClick={handleSubmit}
|
||||
variant="primary"
|
||||
>
|
||||
Meld inn feil
|
||||
</Button>
|
||||
<Button
|
||||
variant="tertiary"
|
||||
icon={<ArrowLeftIcon />}
|
||||
onClick={() => {
|
||||
router.push('/')
|
||||
}}
|
||||
>
|
||||
Gå tilbake til hovedmenyen
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-1/4 bg-bg-subtle"></div>
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
53
next-frontend/pages/index.tsx
Normal file
53
next-frontend/pages/index.tsx
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
import CardsContainer from "@/components/CardsContainer";
|
||||
import Header from "@/components/Header";
|
||||
import "@navikt/ds-css";
|
||||
import { Button, Heading, Search } from "@navikt/ds-react";
|
||||
import router from "next/router";
|
||||
|
||||
export default function Home() {
|
||||
const handleFeil = () => {
|
||||
router.push('/feil')
|
||||
}
|
||||
|
||||
return (
|
||||
<main className="flex flex-col h-screen">
|
||||
<Header/>
|
||||
<div className="flex justify-center grow">
|
||||
<div className="bg-bg-subtle w-1/6 p-8 flex flex-col justify-end">
|
||||
<div className="flex flex-col gap-4 text-center bottom-0">
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={handleFeil}
|
||||
>
|
||||
Meld inn feil
|
||||
</Button>
|
||||
<Button
|
||||
variant="secondary"
|
||||
>
|
||||
Meld inn funksjonalitetsønsker
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="p-8 grow flex gap-8 flex-col">
|
||||
<Search
|
||||
label="Søk gjennom innmeldte feil (nøkkelord, tags, status)"
|
||||
variant="primary"
|
||||
hideLabel={false}
|
||||
/>
|
||||
<Heading
|
||||
level="1"
|
||||
size="medium"
|
||||
>
|
||||
Innmeldte feil (saker, feilmeldinger poster, feil)
|
||||
</Heading>
|
||||
<CardsContainer/>
|
||||
</div>
|
||||
|
||||
<div className="bg-bg-subtle w-1/6 p-8">
|
||||
<h1>Filter to be</h1>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
6
next-frontend/postcss.config.js
Normal file
6
next-frontend/postcss.config.js
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
BIN
next-frontend/public/favicon.ico
Normal file
BIN
next-frontend/public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
1
next-frontend/public/next.svg
Normal file
1
next-frontend/public/next.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
1
next-frontend/public/vercel.svg
Normal file
1
next-frontend/public/vercel.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>
|
||||
|
After Width: | Height: | Size: 629 B |
4
next-frontend/styles/globals.css
Normal file
4
next-frontend/styles/globals.css
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
@import "tailwindcss/base";
|
||||
@import "@navikt/ds-css";
|
||||
@import "tailwindcss/components";
|
||||
@import "tailwindcss/utilities";
|
||||
303
next-frontend/tailwind.config.js
Normal file
303
next-frontend/tailwind.config.js
Normal file
|
|
@ -0,0 +1,303 @@
|
|||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
presets: [require("@navikt/ds-tailwind")],
|
||||
content: [
|
||||
'./pages/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
'./components/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
'./app/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
],
|
||||
"theme": {
|
||||
"colors": {
|
||||
"border-default": "rgba(0, 0, 0, 0.44)",
|
||||
"border-strong": "rgba(0, 0, 0, 0.65)",
|
||||
"border-divider": "rgba(0, 0, 0, 0.19)",
|
||||
"border-subtle-hover": "rgba(0, 0, 0, 0.19)",
|
||||
"border-subtle": "rgba(0, 0, 0, 0.1)",
|
||||
"border-action-selected": "rgba(0, 91, 130, 1)",
|
||||
"border-action": "rgba(0, 103, 197, 1)",
|
||||
"border-selected": "rgba(0, 103, 197, 1)",
|
||||
"border-success": "rgba(6, 137, 58, 1)",
|
||||
"border-danger": "rgba(195, 0, 0, 1)",
|
||||
"border-warning": "rgba(199, 115, 0, 1)",
|
||||
"border-info": "rgba(54, 141, 168, 1)",
|
||||
"border-focus-on-inverted": "rgba(153, 195, 255, 1)",
|
||||
"border-focus": "rgba(0, 52, 125, 1)",
|
||||
"border-on-inverted": "rgba(229, 229, 229, 1)",
|
||||
"border-on-inverted-subtle": "rgba(89, 89, 89, 1)",
|
||||
"border-alt-1": "rgba(130, 105, 162, 1)",
|
||||
"border-alt-2": "rgba(127, 137, 0, 1)",
|
||||
"border-alt-3": "rgba(0, 91, 130, 1)",
|
||||
"transparent": "rgba(255, 255, 255, 0)",
|
||||
"white": "rgba(255, 255, 255, 1)",
|
||||
"nav-red": "rgba(195, 0, 0, 1)",
|
||||
"gray-50": "rgba(247, 247, 247, 1)",
|
||||
"gray-100": "rgba(241, 241, 241, 1)",
|
||||
"gray-200": "rgba(229, 229, 229, 1)",
|
||||
"gray-300": "rgba(207, 207, 207, 1)",
|
||||
"gray-400": "rgba(176, 176, 176, 1)",
|
||||
"gray-500": "rgba(143, 143, 143, 1)",
|
||||
"gray-600": "rgba(112, 112, 112, 1)",
|
||||
"gray-700": "rgba(89, 89, 89, 1)",
|
||||
"gray-800": "rgba(64, 64, 64, 1)",
|
||||
"gray-900": "rgba(38, 38, 38, 1)",
|
||||
"grayalpha-50": "rgba(0, 0, 0, 0.03)",
|
||||
"grayalpha-100": "rgba(0, 0, 0, 0.05)",
|
||||
"grayalpha-200": "rgba(0, 0, 0, 0.1)",
|
||||
"grayalpha-300": "rgba(0, 0, 0, 0.19)",
|
||||
"grayalpha-400": "rgba(0, 0, 0, 0.31)",
|
||||
"grayalpha-500": "rgba(0, 0, 0, 0.44)",
|
||||
"grayalpha-600": "rgba(0, 0, 0, 0.56)",
|
||||
"grayalpha-700": "rgba(0, 0, 0, 0.65)",
|
||||
"grayalpha-800": "rgba(0, 0, 0, 0.75)",
|
||||
"grayalpha-900": "rgba(0, 0, 0, 0.85)",
|
||||
"blue-50": "rgba(230, 240, 255, 1)",
|
||||
"blue-100": "rgba(204, 225, 255, 1)",
|
||||
"blue-200": "rgba(153, 195, 255, 1)",
|
||||
"blue-300": "rgba(102, 165, 244, 1)",
|
||||
"blue-400": "rgba(51, 134, 224, 1)",
|
||||
"blue-500": "rgba(0, 103, 197, 1)",
|
||||
"blue-600": "rgba(0, 86, 180, 1)",
|
||||
"blue-700": "rgba(0, 69, 156, 1)",
|
||||
"blue-800": "rgba(0, 52, 125, 1)",
|
||||
"blue-900": "rgba(0, 34, 82, 1)",
|
||||
"red-50": "rgba(255, 230, 230, 1)",
|
||||
"red-100": "rgba(255, 194, 194, 1)",
|
||||
"red-200": "rgba(246, 130, 130, 1)",
|
||||
"red-300": "rgba(242, 92, 92, 1)",
|
||||
"red-400": "rgba(222, 46, 46, 1)",
|
||||
"red-500": "rgba(195, 0, 0, 1)",
|
||||
"red-600": "rgba(173, 0, 0, 1)",
|
||||
"red-700": "rgba(140, 0, 0, 1)",
|
||||
"red-800": "rgba(92, 0, 0, 1)",
|
||||
"red-900": "rgba(38, 0, 0, 1)",
|
||||
"deepblue-50": "rgba(230, 241, 248, 1)",
|
||||
"deepblue-100": "rgba(204, 226, 240, 1)",
|
||||
"deepblue-200": "rgba(153, 196, 221, 1)",
|
||||
"deepblue-300": "rgba(102, 163, 196, 1)",
|
||||
"deepblue-400": "rgba(51, 128, 165, 1)",
|
||||
"deepblue-500": "rgba(0, 91, 130, 1)",
|
||||
"deepblue-600": "rgba(0, 80, 119, 1)",
|
||||
"deepblue-700": "rgba(0, 67, 103, 1)",
|
||||
"deepblue-800": "rgba(0, 52, 83, 1)",
|
||||
"deepblue-900": "rgba(0, 36, 58, 1)",
|
||||
"green-50": "rgba(243, 252, 245, 1)",
|
||||
"green-100": "rgba(204, 241, 214, 1)",
|
||||
"green-200": "rgba(153, 222, 173, 1)",
|
||||
"green-300": "rgba(102, 199, 134, 1)",
|
||||
"green-400": "rgba(51, 170, 95, 1)",
|
||||
"green-500": "rgba(6, 137, 58, 1)",
|
||||
"green-600": "rgba(0, 124, 46, 1)",
|
||||
"green-700": "rgba(0, 106, 35, 1)",
|
||||
"green-800": "rgba(0, 85, 25, 1)",
|
||||
"green-900": "rgba(0, 59, 15, 1)",
|
||||
"lightblue-50": "rgba(235, 252, 255, 1)",
|
||||
"lightblue-100": "rgba(216, 249, 255, 1)",
|
||||
"lightblue-200": "rgba(181, 241, 255, 1)",
|
||||
"lightblue-300": "rgba(151, 230, 255, 1)",
|
||||
"lightblue-400": "rgba(124, 218, 248, 1)",
|
||||
"lightblue-500": "rgba(102, 203, 236, 1)",
|
||||
"lightblue-600": "rgba(76, 173, 205, 1)",
|
||||
"lightblue-700": "rgba(54, 141, 168, 1)",
|
||||
"lightblue-800": "rgba(35, 107, 125, 1)",
|
||||
"lightblue-900": "rgba(19, 72, 82, 1)",
|
||||
"limegreen-50": "rgba(253, 255, 230, 1)",
|
||||
"limegreen-100": "rgba(249, 252, 204, 1)",
|
||||
"limegreen-200": "rgba(236, 243, 153, 1)",
|
||||
"limegreen-300": "rgba(217, 227, 102, 1)",
|
||||
"limegreen-400": "rgba(193, 203, 51, 1)",
|
||||
"limegreen-500": "rgba(162, 173, 0, 1)",
|
||||
"limegreen-600": "rgba(147, 158, 0, 1)",
|
||||
"limegreen-700": "rgba(127, 137, 0, 1)",
|
||||
"limegreen-800": "rgba(102, 110, 0, 1)",
|
||||
"limegreen-900": "rgba(71, 78, 0, 1)",
|
||||
"orange-50": "rgba(255, 249, 240, 1)",
|
||||
"orange-100": "rgba(255, 236, 204, 1)",
|
||||
"orange-200": "rgba(255, 215, 153, 1)",
|
||||
"orange-300": "rgba(255, 193, 102, 1)",
|
||||
"orange-400": "rgba(255, 170, 51, 1)",
|
||||
"orange-500": "rgba(255, 145, 0, 1)",
|
||||
"orange-600": "rgba(199, 115, 0, 1)",
|
||||
"orange-700": "rgba(168, 100, 0, 1)",
|
||||
"orange-800": "rgba(125, 76, 0, 1)",
|
||||
"orange-900": "rgba(82, 51, 0, 1)",
|
||||
"purple-50": "rgba(239, 236, 244, 1)",
|
||||
"purple-100": "rgba(224, 216, 233, 1)",
|
||||
"purple-200": "rgba(192, 178, 210, 1)",
|
||||
"purple-300": "rgba(161, 141, 187, 1)",
|
||||
"purple-400": "rgba(130, 105, 162, 1)",
|
||||
"purple-500": "rgba(99, 70, 137, 1)",
|
||||
"purple-600": "rgba(82, 56, 116, 1)",
|
||||
"purple-700": "rgba(65, 43, 93, 1)",
|
||||
"purple-800": "rgba(48, 31, 70, 1)",
|
||||
"purple-900": "rgba(31, 20, 47, 1)",
|
||||
"text-default": "rgba(38, 38, 38, 1)",
|
||||
"text-subtle": "rgba(0, 0, 0, 0.56)",
|
||||
"text-visited": "rgba(99, 70, 137, 1)",
|
||||
"text-danger": "rgba(195, 0, 0, 1)",
|
||||
"text-action-selected": "rgba(0, 91, 130, 1)",
|
||||
"text-action-on-action-subtle": "rgba(0, 86, 180, 1)",
|
||||
"text-action": "rgba(0, 103, 197, 1)",
|
||||
"text-on-inverted": "rgba(255, 255, 255, 1)",
|
||||
"text-on-neutral": "rgba(255, 255, 255, 1)",
|
||||
"text-on-action": "rgba(255, 255, 255, 1)",
|
||||
"text-on-success": "rgba(255, 255, 255, 1)",
|
||||
"text-on-danger": "rgba(255, 255, 255, 1)",
|
||||
"text-on-warning": "rgba(38, 38, 38, 1)",
|
||||
"text-on-info": "rgba(38, 38, 38, 1)",
|
||||
"text-on-alt-1": "rgba(255, 255, 255, 1)",
|
||||
"text-on-alt-2": "rgba(38, 38, 38, 1)",
|
||||
"text-on-alt-3": "rgba(255, 255, 255, 1)",
|
||||
"bg-default": "rgba(255, 255, 255, 1)",
|
||||
"bg-subtle": "rgba(241, 241, 241, 1)",
|
||||
"surface-default": "rgba(255, 255, 255, 1)",
|
||||
"surface-hover": "rgba(0, 0, 0, 0.05)",
|
||||
"surface-active": "rgba(0, 0, 0, 0.1)",
|
||||
"surface-selected": "rgba(230, 240, 255, 1)",
|
||||
"surface-subtle": "rgba(247, 247, 247, 1)",
|
||||
"surface-transparent": "rgba(255, 255, 255, 0)",
|
||||
"surface-backdrop": "rgba(0, 0, 0, 0.65)",
|
||||
"surface-inverted-hover": "rgba(64, 64, 64, 1)",
|
||||
"surface-inverted-active": "rgba(89, 89, 89, 1)",
|
||||
"surface-inverted": "rgba(38, 38, 38, 1)",
|
||||
"surface-action-subtle-hover": "rgba(204, 225, 255, 1)",
|
||||
"surface-action-subtle": "rgba(230, 240, 255, 1)",
|
||||
"surface-action-hover": "rgba(0, 86, 180, 1)",
|
||||
"surface-action-active": "rgba(0, 91, 130, 1)",
|
||||
"surface-action-selected-hover": "rgba(0, 80, 119, 1)",
|
||||
"surface-action-selected": "rgba(0, 91, 130, 1)",
|
||||
"surface-action": "rgba(0, 103, 197, 1)",
|
||||
"surface-neutral-subtle-hover": "rgba(0, 0, 0, 0.1)",
|
||||
"surface-neutral-subtle": "rgba(0, 0, 0, 0.05)",
|
||||
"surface-neutral-hover": "rgba(64, 64, 64, 1)",
|
||||
"surface-neutral-selected": "rgba(38, 38, 38, 1)",
|
||||
"surface-neutral-active": "rgba(38, 38, 38, 1)",
|
||||
"surface-neutral": "rgba(89, 89, 89, 1)",
|
||||
"surface-success-subtle-hover": "rgba(153, 222, 173, 1)",
|
||||
"surface-success-subtle": "rgba(204, 241, 214, 1)",
|
||||
"surface-success": "rgba(6, 137, 58, 1)",
|
||||
"surface-success-hover": "rgba(0, 124, 46, 1)",
|
||||
"surface-danger-subtle-hover": "rgba(246, 130, 130, 1)",
|
||||
"surface-danger-subtle": "rgba(255, 194, 194, 1)",
|
||||
"surface-danger-hover": "rgba(173, 0, 0, 1)",
|
||||
"surface-danger-active": "rgba(140, 0, 0, 1)",
|
||||
"surface-danger": "rgba(195, 0, 0, 1)",
|
||||
"surface-warning-subtle-hover": "rgba(255, 215, 153, 1)",
|
||||
"surface-warning-subtle": "rgba(255, 236, 204, 1)",
|
||||
"surface-warning": "rgba(255, 145, 0, 1)",
|
||||
"surface-info-subtle-hover": "rgba(181, 241, 255, 1)",
|
||||
"surface-info-subtle": "rgba(216, 249, 255, 1)",
|
||||
"surface-info": "rgba(102, 203, 236, 1)",
|
||||
"surface-alt-1-subtle": "rgba(224, 216, 233, 1)",
|
||||
"surface-alt-1": "rgba(130, 105, 162, 1)",
|
||||
"surface-alt-2-subtle": "rgba(249, 252, 204, 1)",
|
||||
"surface-alt-2": "rgba(193, 203, 51, 1)",
|
||||
"surface-alt-3-subtle": "rgba(204, 226, 240, 1)",
|
||||
"surface-alt-3-strong": "rgba(0, 52, 83, 1)",
|
||||
"surface-alt-3": "rgba(0, 91, 130, 1)",
|
||||
"icon-default": "rgba(38, 38, 38, 1)",
|
||||
"icon-subtle": "rgba(112, 112, 112, 1)",
|
||||
"icon-action-selected": "rgba(0, 91, 130, 1)",
|
||||
"icon-action-on-action-subtle": "rgba(0, 86, 180, 1)",
|
||||
"icon-action": "rgba(0, 103, 197, 1)",
|
||||
"icon-success": "rgba(6, 137, 58, 1)",
|
||||
"icon-danger": "rgba(195, 0, 0, 1)",
|
||||
"icon-warning": "rgba(199, 115, 0, 1)",
|
||||
"icon-info": "rgba(35, 107, 125, 1)",
|
||||
"icon-alt-1": "rgba(99, 70, 137, 1)",
|
||||
"icon-alt-2": "rgba(127, 137, 0, 1)",
|
||||
"icon-alt-3": "rgba(51, 128, 165, 1)",
|
||||
"icon-on-neutral": "rgba(255, 255, 255, 1)",
|
||||
"icon-on-inverted": "rgba(255, 255, 255, 1)",
|
||||
"icon-on-action": "rgba(255, 255, 255, 1)",
|
||||
"icon-on-success": "rgba(255, 255, 255, 1)",
|
||||
"icon-on-danger": "rgba(255, 255, 255, 1)",
|
||||
"icon-on-warning": "rgba(38, 38, 38, 1)",
|
||||
"icon-on-info": "rgba(38, 38, 38, 1)"
|
||||
},
|
||||
"screen": {
|
||||
"sm": "480px",
|
||||
"md": "768px",
|
||||
"lg": "1024px",
|
||||
"xl": "1280px"
|
||||
},
|
||||
"extend": {
|
||||
"spacing": {
|
||||
"0": "0",
|
||||
"1": "0.25rem",
|
||||
"2": "0.5rem",
|
||||
"3": "0.75rem",
|
||||
"4": "1rem",
|
||||
"5": "1.25rem",
|
||||
"6": "1.5rem",
|
||||
"7": "1.75rem",
|
||||
"8": "2rem",
|
||||
"9": "2.25rem",
|
||||
"10": "2.5rem",
|
||||
"11": "2.75rem",
|
||||
"12": "3rem",
|
||||
"14": "3.5rem",
|
||||
"16": "4rem",
|
||||
"18": "4.5rem",
|
||||
"20": "5rem",
|
||||
"24": "6rem",
|
||||
"32": "8rem",
|
||||
"05": "0.125rem"
|
||||
},
|
||||
"zIndex": {
|
||||
"modal": 2000,
|
||||
"popover": 1000,
|
||||
"focus": 10,
|
||||
"tooltip": 3000
|
||||
},
|
||||
"boxShadow": {
|
||||
"xsmall": "0 1px 2px 0 rgba(0, 0, 0, 0.12)",
|
||||
"small": "0 1px 2px -1px rgba(0, 0, 0, 0.1), 0 1px 3px 0 rgba(0, 0, 0, 0.1)",
|
||||
"medium": "0 2px 4px -2px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.1)",
|
||||
"large": "0 4px 6px -4px rgba(0, 0, 0, 0.1), 0 10px 15px -3px rgba(0, 0, 0, 0.1)",
|
||||
"xlarge": "0 8px 10px -6px rgba(0, 0, 0, 0.1), 0 25px 50px -5px rgba(0, 0, 0, 0.1)",
|
||||
"focus-inverted": "0 0 0 3px rgba(153, 195, 255, 1)",
|
||||
"focus": "0 0 0 3px rgba(0, 52, 125, 1)"
|
||||
},
|
||||
"fontWeight": {
|
||||
"bold": "600",
|
||||
"regular": "400"
|
||||
},
|
||||
"fontSize": {
|
||||
"heading-2xlarge": "2.5rem",
|
||||
"heading-xlarge": "2rem",
|
||||
"heading-large": "1.75rem",
|
||||
"heading-medium": "1.5rem",
|
||||
"heading-small": "1.25rem",
|
||||
"heading-xsmall": "1.125rem",
|
||||
"xlarge": "1.25rem",
|
||||
"large": "1.125rem",
|
||||
"medium": "1rem",
|
||||
"small": "0.875rem"
|
||||
},
|
||||
"lineHeight": {
|
||||
"heading-2xlarge": "3.25rem",
|
||||
"heading-xlarge": "2.5rem",
|
||||
"heading-large": "2.25rem",
|
||||
"heading-medium": "2rem",
|
||||
"heading-small": "1.75rem",
|
||||
"heading-xsmall": "1.5rem",
|
||||
"xlarge": "1.75rem",
|
||||
"large": "1.5rem",
|
||||
"medium": "1.25rem"
|
||||
},
|
||||
"fontFamily": {
|
||||
"font-family": "\"Source Sans Pro\", Arial, sans-serif"
|
||||
},
|
||||
"borderRadius": {
|
||||
"small": "2px",
|
||||
"medium": "4px",
|
||||
"large": "8px",
|
||||
"xlarge": "12px",
|
||||
"full": "9999px"
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
|
||||
|
||||
26
next-frontend/tsconfig.json
Normal file
26
next-frontend/tsconfig.json
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
},
|
||||
"include": [
|
||||
"next-env.d.ts", "**/*.ts", "**/*.tsx"],
|
||||
"exclude": [
|
||||
"../frontend/node_modules"
|
||||
]
|
||||
}
|
||||
6
next-frontend/vite.config.ts
Normal file
6
next-frontend/vite.config.ts
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
})
|
||||
3870
next-frontend/yarn.lock
Normal file
3870
next-frontend/yarn.lock
Normal file
File diff suppressed because it is too large
Load diff
Reference in a new issue