From f07b630f82e23f42d4b492ee1d46decef58b8a9f Mon Sep 17 00:00:00 2001
From: Guilhem <guilhem@mbp-de-windmill.home>
Date: Tue, 1 Oct 2024 17:37:45 +0200
Subject: [PATCH] Add nord theme colors

---
 .../src/lib/components/common/button/Button.svelte |  7 +++++++
 frontend/tailwind.config.cjs                       | 14 ++++++++++++++
 2 files changed, 21 insertions(+)

diff --git a/frontend/src/lib/components/common/button/Button.svelte b/frontend/src/lib/components/common/button/Button.svelte
index 4e2d2fe08a..1fef9435a0 100644
--- a/frontend/src/lib/components/common/button/Button.svelte
+++ b/frontend/src/lib/components/common/button/Button.svelte
@@ -114,6 +114,13 @@
 			contained:
 				'bg-surface border-transparent hover:bg-surface-hover focus-visible:bg-surface-hover text-primary focus-visible:ring-surface-selected',
 			divider: 'divide-x divide-gray-200 dark:divide-gray-700'
+		},
+		nord: {
+			border:
+				'border-nord-200 bg-surface hover:bg-surface-hover focus-visible:bg-surface-hover text-primary hover:text-secondary focus-visible:text-secondary focus-visible:ring-surface-selected-inverse dark:border-nord-200',
+			contained:
+				'bg-nord-300 hover:bg-nord-0 focus-visible:bg-surface-hover-inverse text-primary-inverse focus-visible:ring-surface-selected-inverse dark:bg-nord-400 dark:hover:bg-nord-600 dark:text-primary-inverse',
+			divider: 'divide-x divide-gray-800 dark:divide-gray-200'
 		}
 	}
 
diff --git a/frontend/tailwind.config.cjs b/frontend/tailwind.config.cjs
index fe2a87aea3..483cd3a252 100644
--- a/frontend/tailwind.config.cjs
+++ b/frontend/tailwind.config.cjs
@@ -384,6 +384,20 @@ const config = {
 				400: '#394A6D',
 				500: '#323F5B'
 			},
+			nord: {
+				0: '#2E3440',
+				100: '#3B4252',
+				200: '#434C5E',
+				300: '#4C566A',
+				400: '#D8DEE9',
+				500: '#E5E9F0',
+				600: '#ECEFF4',
+				700: '#8FBCBB',
+				800: '#88C0D0',
+				900: '#81A1C1',
+				950: '#5E81AC'
+			},
+
 			surface: 'rgb(var(--color-surface) / <alpha-value>)',
 			'surface-secondary': 'rgb(var(--color-surface-secondary) / <alpha-value>)',
 			'surface-hover': 'rgb(var(--color-surface-hover) / <alpha-value>)',