✨ Ny hovedside etter oppdatert skisser
Mangler scrollbar og noen små detaljer, men layout er fikset.
This commit is contained in:
parent
eabfd2b291
commit
6906609bf5
3 changed files with 58 additions and 36 deletions
46
frontend/src/components/Filtermeny.tsx
Normal file
46
frontend/src/components/Filtermeny.tsx
Normal file
|
@ -0,0 +1,46 @@
|
||||||
|
import { Accordion } from "@navikt/ds-react"
|
||||||
|
|
||||||
|
|
||||||
|
const Filtermeny = () => {
|
||||||
|
return (
|
||||||
|
<div className="bg-bg-default w-500">
|
||||||
|
<Accordion>
|
||||||
|
<Accordion.Item>
|
||||||
|
<Accordion.Header>
|
||||||
|
Kategori
|
||||||
|
</Accordion.Header>
|
||||||
|
<Accordion.Content>
|
||||||
|
Hvis du er mellom 62 og 67 år når du søker, må du som hovedregel ha
|
||||||
|
hatt en pensjonsgivende inntekt som tilsvarer x G, året før du fikk
|
||||||
|
nedsatt arbeidsevnen. NAV kan gjøre <a href="#Unntak">unntak</a>.
|
||||||
|
</Accordion.Content>
|
||||||
|
</Accordion.Item>
|
||||||
|
<Accordion.Item defaultOpen>
|
||||||
|
<Accordion.Header>
|
||||||
|
Status
|
||||||
|
</Accordion.Header>
|
||||||
|
<Accordion.Content>
|
||||||
|
Da er det lite som trengs å gjøres.
|
||||||
|
</Accordion.Content>
|
||||||
|
</Accordion.Item>
|
||||||
|
<Accordion.Item>
|
||||||
|
<Accordion.Header>
|
||||||
|
Prioritet
|
||||||
|
</Accordion.Header>
|
||||||
|
<Accordion.Content>
|
||||||
|
Da er det lite som trengs å gjøres.
|
||||||
|
</Accordion.Content>
|
||||||
|
</Accordion.Item>
|
||||||
|
<Accordion.Item>
|
||||||
|
<Accordion.Header>
|
||||||
|
Mine innmeldinger
|
||||||
|
</Accordion.Header>
|
||||||
|
<Accordion.Content>
|
||||||
|
Da er det lite som trengs å gjøres.
|
||||||
|
</Accordion.Content>
|
||||||
|
</Accordion.Item>
|
||||||
|
</Accordion>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Filtermeny
|
|
@ -2,51 +2,24 @@ import CardsContainer from "./components/CardsContainer";
|
||||||
import "@navikt/ds-css";
|
import "@navikt/ds-css";
|
||||||
import { Button, Heading, Search } from "@navikt/ds-react";
|
import { Button, Heading, Search } from "@navikt/ds-react";
|
||||||
import Header from "./components/Header";
|
import Header from "./components/Header";
|
||||||
|
import { PlusIcon } from "@navikt/aksel-icons";
|
||||||
|
import Filtermeny from "./components/Filtermeny";
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
// const handleFeil = () => {
|
|
||||||
// router.push('/feil')
|
|
||||||
// }
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className="flex flex-col h-screen">
|
<main className="flex flex-col h-screen">
|
||||||
<Header/>
|
<Header/>
|
||||||
<div className="flex justify-center grow">
|
<div className="flex grow">
|
||||||
<div className="bg-bg-subtle w-1/6 p-8 flex flex-col justify-end">
|
<Filtermeny/>
|
||||||
<div className="flex flex-col gap-4 text-center bottom-0">
|
<div className="grow bg-bg-subtle px-32 py-10 flex flex-col gap-10">
|
||||||
<Button
|
<div className="flex gap-12 items-end">
|
||||||
variant="primary"
|
<Search label="Søkefelt" hideLabel={false}/>
|
||||||
// onClick={handleFeil}
|
<Button className="w-64 h-min" icon={<PlusIcon/>}>
|
||||||
>
|
|
||||||
Meld inn feil
|
Meld inn feil
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
|
||||||
variant="secondary"
|
|
||||||
>
|
|
||||||
Meld inn funksjonalitetsønsker
|
|
||||||
</Button>
|
|
||||||
</div>
|
</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/>
|
<CardsContainer/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="bg-bg-subtle w-1/6 p-8">
|
|
||||||
<h1>Filter to be</h1>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
)
|
)
|
||||||
|
|
|
@ -293,7 +293,10 @@ module.exports = {
|
||||||
"large": "8px",
|
"large": "8px",
|
||||||
"xlarge": "12px",
|
"xlarge": "12px",
|
||||||
"full": "9999px"
|
"full": "9999px"
|
||||||
}
|
},
|
||||||
|
"width": {
|
||||||
|
"500": "500px",
|
||||||
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
plugins: [],
|
plugins: [],
|
||||||
|
|
Reference in a new issue