From 3292de4db2716e2143dc6939e4a01a8052ca0d73 Mon Sep 17 00:00:00 2001
From: emilielr <43408175+emilielr@users.noreply.github.com>
Date: Mon, 28 Oct 2024 16:01:59 +0100
Subject: [PATCH] style(organizations): change background color on card to grey
 (#1702)

---
 .../(admin)/organizations/components/Organizations.tsx    | 8 ++++----
 tavla/app/globals.css                                     | 3 +++
 tavla/tailwind.config.ts                                  | 1 +
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/tavla/app/(admin)/organizations/components/Organizations.tsx b/tavla/app/(admin)/organizations/components/Organizations.tsx
index b3d3c1424..168d482f8 100644
--- a/tavla/app/(admin)/organizations/components/Organizations.tsx
+++ b/tavla/app/(admin)/organizations/components/Organizations.tsx
@@ -1,5 +1,5 @@
 import { TOrganization } from 'types/settings'
-import EnturLogoBlue from 'assets/logos/Tavla-blue.svg'
+import EnturLogo from 'assets/logos/Tavla-white.svg'
 import Image from 'next/image'
 import { Link } from '@entur/typography'
 import NextLink from 'next/link'
@@ -28,17 +28,17 @@ function Organizations({
                     className=" border rounded-md shadow-sm"
                     key={organization.id}
                 >
-                    <div className="flex flex-col">
+                    <div className="flex flex-col bg-grey60">
                         <div className="h-36 flex align-center justify-center relative">
                             <Image
-                                src={organization.logo ?? EnturLogoBlue}
+                                src={organization.logo ?? EnturLogo}
                                 alt="Logo til organisasjonen"
                                 fill
                                 objectFit="contain"
                                 className="py-12 px-8"
                             />
                         </div>
-                        <div className="bg-gray-100 p-4 flex flex-row justify-between gap-4">
+                        <div className="bg-grey80 p-4 flex flex-row justify-between gap-4">
                             <Link
                                 as={NextLink}
                                 href={`/organizations/${organization.id}`}
diff --git a/tavla/app/globals.css b/tavla/app/globals.css
index b27d75ae2..37b80be06 100644
--- a/tavla/app/globals.css
+++ b/tavla/app/globals.css
@@ -25,6 +25,7 @@
         --blue80: var(--colors-blues-blue80);
         --blue90: var(--colors-blues-blue90);
 
+        --grey60: var(--colors-greys-grey60);
         --grey70: var(--colors-greys-grey70);
         --grey80: var(--colors-greys-grey80);
 
@@ -80,6 +81,7 @@
         --blue80: var(--colors-blues-blue80);
         --blue90: var(--colors-blues-blue90);
 
+        --grey60: var(--colors-greys-grey60);
         --grey70: var(--colors-greys-grey70);
         --grey80: var(--colors-greys-grey80);
 
@@ -130,6 +132,7 @@
         --blue80: var(--colors-blues-blue80);
         --blue90: var(--colors-blues-blue90);
 
+        --grey60: var(--colors-greys-grey60);
         --grey70: var(--colors-greys-grey70);
         --grey80: var(--colors-greys-grey80);
 
diff --git a/tavla/tailwind.config.ts b/tavla/tailwind.config.ts
index 99afd4ddd..0ffe7f60f 100644
--- a/tavla/tailwind.config.ts
+++ b/tavla/tailwind.config.ts
@@ -38,6 +38,7 @@ module.exports = {
                 secondary: 'var(--secondary-background-color)',
                 tertiary: 'var(--tertiary-background-color)',
                 contrast: 'var(--contrast-background-color)',
+                grey60: 'var(--grey60)',
                 grey70: 'var(--grey70)',
                 grey80: 'var(--grey80)',
                 blue80: 'var(--blue80)',