From 526ffc04f68ac061327246c23a60b197365c37f9 Mon Sep 17 00:00:00 2001
From: Marc <rhyor420@gmail.com>
Date: Tue, 16 May 2023 13:47:47 +0200
Subject: [PATCH] bug fixes (#453)

* linkfy informasjonselement

* fix mobileview, use full height

* fix margin

* fix margin chat
---
 src/App.tsx                                     | 4 ++--
 src/view/aktivitet/DialogMedAktivitetHeader.tsx | 2 +-
 src/view/aktivitet/InformasjonElement.tsx       | 3 ++-
 src/view/dialogliste/DialogOversikt.tsx         | 2 +-
 src/view/melding/Melding.tsx                    | 4 +++-
 5 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 55a0fa15..6afe3abf 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -69,8 +69,8 @@ const App = (props: Props) => {
     return (
         <div
             className={cx('flex flex-col', {
-                'min-h-[calc(100vh-180px)] md:h-[calc(100vh-180px)]': erInternFlate,
-                'min-h-[calc(100vh-72px)] md:h-[calc(100vh-80px)]': !erInternFlate
+                'min-h-[calc(100vh-180px)] h-[calc(100vh-180px)]': erInternFlate,
+                'min-h-[calc(100vh-72px)] h-[calc(100vh-80px)]': !erInternFlate
             })}
         >
             <Provider fnr={fnr} erVeileder={!!fnr}>
diff --git a/src/view/aktivitet/DialogMedAktivitetHeader.tsx b/src/view/aktivitet/DialogMedAktivitetHeader.tsx
index 3c4623b1..93a49e9b 100644
--- a/src/view/aktivitet/DialogMedAktivitetHeader.tsx
+++ b/src/view/aktivitet/DialogMedAktivitetHeader.tsx
@@ -31,7 +31,7 @@ export function DialogMedAktivitetHeader(props: Props) {
             <div className="flex w-full flex-col md:flex-row">
                 <div className="flex flex-1 flex-row items-center gap-x-2 lg:max-w-lgContainer xl:max-w-none">
                     <TilbakeKnapp className="md:hidden" />
-                    <div className="ml-4">
+                    <div className="md:ml-4">
                         <Heading level="2" size="small" aria-label={`${typeTekst}: ${aktivitet?.tittel}`}>
                             {aktivitet?.tittel}
                         </Heading>
diff --git a/src/view/aktivitet/InformasjonElement.tsx b/src/view/aktivitet/InformasjonElement.tsx
index 92cba37a..06e94de6 100644
--- a/src/view/aktivitet/InformasjonElement.tsx
+++ b/src/view/aktivitet/InformasjonElement.tsx
@@ -4,6 +4,7 @@ import React, { ReactNode } from 'react';
 
 import EksternLenke from '../../felleskomponenter/EksternLenke';
 import { StringOrNull } from '../../utils/Typer';
+import { linkify } from '../melding/linkify';
 
 interface TekstomradeProps {
     merkelapptekst: string;
@@ -18,7 +19,7 @@ export default function InformasjonElement(props: TekstomradeProps) {
 
     return (
         <InformasjonElementRaw merkelapptekst={merkelapptekst}>
-            <span className="text-ellipsis overflow-hidden">{verdi}</span>
+            <span className="text-ellipsis overflow-hidden">{linkify(verdi)}</span>
         </InformasjonElementRaw>
     );
 }
diff --git a/src/view/dialogliste/DialogOversikt.tsx b/src/view/dialogliste/DialogOversikt.tsx
index 3a254db5..d1f2d7f5 100644
--- a/src/view/dialogliste/DialogOversikt.tsx
+++ b/src/view/dialogliste/DialogOversikt.tsx
@@ -46,7 +46,7 @@ const DialogOversikt = () => {
         <div
             className={classNames(
                 { hidden: !!dialog || isNyRoute } /* Hvis liten skjerm, bare vis dialog-liste på "Homepage"  */,
-                'border-r border-border-divider w-full h-full md:max-w-80 md:flex md:flex-col xl:max-w-none xl:min-w-[320px] xl:w-[16.7vw]'
+                'flex flex-col border-r border-border-divider w-full h-full md:max-w-80 md:flex md:flex-col xl:max-w-none xl:min-w-[320px] xl:w-[16.7vw]'
             )}
         >
             <DialogOversiktHeader erVeileder={erVeileder} />
diff --git a/src/view/melding/Melding.tsx b/src/view/melding/Melding.tsx
index 869b0b92..cdfad768 100644
--- a/src/view/melding/Melding.tsx
+++ b/src/view/melding/Melding.tsx
@@ -1,5 +1,6 @@
 import { PersonIcon } from '@navikt/aksel-icons';
 import { BodyShort, Chat, Link } from '@navikt/ds-react';
+import classNames from 'classnames';
 import React from 'react';
 
 import { ViktigMelding } from '../../felleskomponenter/etiketer/Etikett';
@@ -45,8 +46,9 @@ export function Melding(props: Props) {
                 position={erMeldingFraBruker ? 'right' : 'left'}
                 backgroundColor={backgroundColor}
                 avatarBgColor={avatarBgColor}
+                className={classNames('p-0', { 'md:pl-16': erMeldingFraBruker, 'md:pr-16': !erMeldingFraBruker })}
             >
-                <Chat.Bubble>
+                <Chat.Bubble className="">
                     <div className="flex flex-col items-start">
                         <ViktigMelding visible={viktigMarkering} />
                         <span className="mt-2 whitespace-pre-wrap">{linkify(tekst)}</span>