Naviger til soek

navikt · May 22, 2024 · 88e9cbd · 88e9cbd
1 parent 3f08608
commit 88e9cbd
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 9 deletions.
diff --git a/apps/dolly-frontend/src/main/js/src/pages/tenorSoek/TenorSoekPage.tsx b/apps/dolly-frontend/src/main/js/src/pages/tenorSoek/TenorSoekPage.tsx
@@ -15,16 +15,15 @@ const initialState = {
 
 const NavigateButton = styled(Button)`
 	position: sticky;
-	top: 10px;
-	//padding-bottom: 30px;
+	top: ${(props) => (props.className === 'gaa-til-soek' ? '75px' : '10px')};
 	width: 80px;
 	transform: translateX(-120%);
 	display: grid;
 
 	&& {
 		svg {
-			width: 50px;
-			height: 50px;
+			width: 45px;
+			height: 45px;
 			margin: 0 auto 5px auto;
 		}
 	}
@@ -91,8 +90,8 @@ export default () => {
 		})
 	}
 
-	const navigateToTreff = () => {
-		const treff = document.getElementById('treff')?.offsetTop
+	const navigateTo = (element: string) => {
+		const treff = document.getElementById(element)?.offsetTop
 		window.scrollTo({ top: treff, behavior: 'smooth' })
 	}
 
@@ -101,8 +100,12 @@ export default () => {
 			<div className="flexbox--align-center--justify-start">
 				<Title title="Søk etter personer i Tenor" />
 			</div>
-			<div className="flexbox--flex-wrap">
-				<NavigateButton onClick={() => navigateToTreff()} kind="chevron-down-double-circle">
+			<div className="flexbox--flex-wrap" id="soek">
+				<NavigateButton
+					className="gaa-til-treff"
+					onClick={() => navigateTo('treff')}
+					kind="chevron-down-double-circle"
+				>
 					GÅ TIL TREFF
 				</NavigateButton>
 				<SoekForm
@@ -112,6 +115,13 @@ export default () => {
 				/>
 			</div>
 			<div id="treff">
+				<NavigateButton
+					className="gaa-til-soek"
+					onClick={() => navigateTo('soek')}
+					kind="chevron-up-double-circle"
+				>
+					GÅ TIL SØK
+				</NavigateButton>
 				<TreffListe
 					response={response?.data}
 					personListe={state.personListe}

diff --git a/apps/dolly-frontend/src/main/js/src/pages/tenorSoek/resultatVisning/TreffListe.tsx b/apps/dolly-frontend/src/main/js/src/pages/tenorSoek/resultatVisning/TreffListe.tsx
@@ -64,7 +64,7 @@ export const TreffListe = ({
 	const antallTreff = localStorage['antallTreff']
 
 	return (
-		<div className="flexbox--flex-wrap">
+		<div className="flexbox--flex-wrap" style={{ marginTop: '-70px' }}>
 			<div
 				className="flexbox--full-width"
 				style={{ marginBottom: '20px', position: 'sticky', top: '10px', zIndex: 1 }}