💄 Alternativ Layout for redigeringsskjema (#25)
* 💄 Alternativ Layout for redigeringsskjema * 💄 Gjort endringer på Modal layout og lagt til header på redigering --------- Co-authored-by: Sid <93219711+SindreKjelsrud@users.noreply.github.com>
This commit is contained in:
parent
a399eb31d1
commit
937b3dac2d
3 changed files with 20 additions and 15 deletions
|
@ -11,7 +11,7 @@ interface modalInterface {
|
||||||
const FeilModal = (props: modalInterface) => {
|
const FeilModal = (props: modalInterface) => {
|
||||||
return(
|
return(
|
||||||
<Modal
|
<Modal
|
||||||
className="w-3/5 p-5"
|
className="w-3/5 min-w-2/4 p-5"
|
||||||
open={props.open}
|
open={props.open}
|
||||||
aria-label={" modal"}
|
aria-label={" modal"}
|
||||||
onClose={() => props.setOpen(false)}
|
onClose={() => props.setOpen(false)}
|
||||||
|
|
|
@ -6,7 +6,6 @@ import { useState } from "react"
|
||||||
import Skillelinje from "./Skillelinje"
|
import Skillelinje from "./Skillelinje"
|
||||||
import axios from "axios"
|
import axios from "axios"
|
||||||
|
|
||||||
|
|
||||||
const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
||||||
const [kommentar, setKommentar] = useState("")
|
const [kommentar, setKommentar] = useState("")
|
||||||
const [kommentarfelt, setKommentarfelt] = useState("")
|
const [kommentarfelt, setKommentarfelt] = useState("")
|
||||||
|
@ -33,8 +32,8 @@ const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
return(
|
return(
|
||||||
<div>
|
<>
|
||||||
<div className="flex justify-between">
|
<div className="flex justify-between ">
|
||||||
<FeilkortHeader
|
<FeilkortHeader
|
||||||
id={props.id}
|
id={props.id}
|
||||||
tittel={props.tittel}
|
tittel={props.tittel}
|
||||||
|
@ -55,7 +54,7 @@ const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
props.setVisModal(false)
|
props.setVisModal(false)
|
||||||
props.setRedigeringsmodus(false)
|
props.setRedigeringsmodus(false)
|
||||||
} }
|
}}
|
||||||
>
|
>
|
||||||
Lukk
|
Lukk
|
||||||
</Button>
|
</Button>
|
||||||
|
@ -74,7 +73,7 @@ const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
||||||
tekst={kommentar}
|
tekst={kommentar}
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
</div>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
export default FeilmeldingsInnhold;
|
export default FeilmeldingsInnhold;
|
||||||
|
|
|
@ -42,8 +42,12 @@ const RedigeringsVerktoy = (props: redigeringsInterface) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex justify-between">
|
<div className="flex flex-col gap-12 items-center px-12">
|
||||||
<div className="flex flex-col gap-4 w-1/2">
|
|
||||||
|
<div className="flex flex-col gap-6 w-full">
|
||||||
|
<Heading className="" size="large">
|
||||||
|
Rediger feil
|
||||||
|
</Heading>
|
||||||
<TextField
|
<TextField
|
||||||
label="Tittel"
|
label="Tittel"
|
||||||
value={tittel}
|
value={tittel}
|
||||||
|
@ -65,14 +69,16 @@ const RedigeringsVerktoy = (props: redigeringsInterface) => {
|
||||||
<Radio value={2}>Feilen er fikset</Radio>
|
<Radio value={2}>Feilen er fikset</Radio>
|
||||||
</RadioGroup>
|
</RadioGroup>
|
||||||
<Skillelinje/>
|
<Skillelinje/>
|
||||||
<Heading size="xsmall">
|
<div>
|
||||||
Haster det å fikse feilen?
|
<Heading size="xsmall">
|
||||||
</Heading>
|
Haster det å fikse feilen?
|
||||||
<Switch checked={haster} onClick={() => setHaster(!haster)}>
|
</Heading>
|
||||||
Feilen haster
|
<Switch checked={haster} onClick={() => setHaster(!haster)}>
|
||||||
</Switch>
|
Feilen haster
|
||||||
|
</Switch>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex gap-4 items-start">
|
<div className="flex gap-4 items-start w-full">
|
||||||
<Button
|
<Button
|
||||||
variant="primary"
|
variant="primary"
|
||||||
icon={<FloppydiskIcon/>}
|
icon={<FloppydiskIcon/>}
|
||||||
|
|
Reference in a new issue