diff --git a/web/src/app/foreninger/[slug]/page.tsx b/web/src/app/foreninger/[slug]/page.tsx index 79fb1fe..cfdcf12 100644 --- a/web/src/app/foreninger/[slug]/page.tsx +++ b/web/src/app/foreninger/[slug]/page.tsx @@ -71,12 +71,6 @@ export default async function Page({ params }: { params: { slug: string } }) { return (
- {association.lead && ( -
- )}
); diff --git a/web/src/components/associations/AssociationHeader.tsx b/web/src/components/associations/AssociationHeader.tsx index 11660be..f25a04b 100644 --- a/web/src/components/associations/AssociationHeader.tsx +++ b/web/src/components/associations/AssociationHeader.tsx @@ -10,10 +10,16 @@ export const AssociationHeader = ({ association: AssociationFragment; }) => { return ( -
+

{association.title}

+ {association.lead && ( +
+ )} {association.websiteUrl && ( Besøk nettside diff --git a/web/src/components/associations/associationHeader.module.scss b/web/src/components/associations/associationHeader.module.scss index 4c763bf..d45b8b9 100644 --- a/web/src/components/associations/associationHeader.module.scss +++ b/web/src/components/associations/associationHeader.module.scss @@ -1,25 +1,38 @@ .associationHeader { display: grid; - grid-template-columns: 2fr 1fr; + grid-template-columns: 1fr; column-gap: var(--spacing-gap-column); row-gap: var(--spacing-gap-row); + align-items: center; max-width: var(--size-width-p); margin: 0 auto var(--spacing-section-bottom); - &.hasLogo { + &.wide { max-width: var(--size-width-lead); } + &.hasLogo { + grid-template-columns: 2fr 1fr; + } + h1 { font-size: var(--font-size-h1); margin-bottom: var(--spacing-m); } + + p { + margin-bottom: var(--spacing-m); + } } @media (max-width: 600px) { .associationHeader { grid-template-columns: 1fr; + &.hasLogo { + grid-template-columns: 1fr; + } + img { max-width: 16rem; }