From 702d4ea1a273c7e1a6be2a67b205c99de217fdd9 Mon Sep 17 00:00:00 2001
From: MartinBraquet <martin.braquet@gmail.com>
Date: Fri, 13 Feb 2026 00:44:13 +0100
Subject: [PATCH] Fix button UI, default gray

---
 web/components/buttons/button.tsx             |  4 +--
 .../messaging/new-message-button.tsx          | 28 +++++++++----------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/web/components/buttons/button.tsx b/web/components/buttons/button.tsx
index a027a8f..7a9b4df 100644
--- a/web/components/buttons/button.tsx
+++ b/web/components/buttons/button.tsx
@@ -65,7 +65,7 @@ export function buttonClass(size: SizeType, color: ColorType) {
     ],
     color === 'gray' &&
       'bg-ink-300 text-ink-900 disabled:bg-ink-200 disabled:text-ink-500 hover:bg-ink-200 dark:enabled:hover:bg-ink-400 hover:text-ink-1000',
-    color === 'gray-outline' && [outline, 'text-ink-600 hover:bg-canvas-200'],
+    color === 'gray-outline' && [outline, 'text-ink-600 hover:bg-canvas-100'],
     color === 'gradient' && [gradient, 'from-primary-500 to-blue-400'],
     color === 'gradient-pink' && [gradient, 'from-primary-500 to-fuchsia-500'],
     color === 'gray-white' &&
@@ -91,7 +91,7 @@ export const Button = forwardRef(function Button(
     children,
     className,
     size = 'md',
-    color = 'indigo',
+    color = 'gray-outline',
     type = 'button',
     disabled = false,
     loading,
diff --git a/web/components/messaging/new-message-button.tsx b/web/components/messaging/new-message-button.tsx
index 3301a94..b867982 100644
--- a/web/components/messaging/new-message-button.tsx
+++ b/web/components/messaging/new-message-button.tsx
@@ -1,24 +1,24 @@
-import { PlusIcon } from '@heroicons/react/solid'
-import { Button } from '../buttons/button'
-import { useState } from 'react'
-import { MODAL_CLASS, Modal } from '../layout/modal'
-import { Col } from '../layout/col'
-import { api } from 'web/lib/api'
-import { useRouter } from 'next/router'
+import {PlusIcon} from '@heroicons/react/solid'
+import {Button} from '../buttons/button'
+import {useState} from 'react'
+import {Modal, MODAL_CLASS} from '../layout/modal'
+import {Col} from '../layout/col'
+import {api} from 'web/lib/api'
+import {useRouter} from 'next/router'
 import clsx from 'clsx'
-import { Row } from 'web/components/layout/row'
-import { SelectUsers } from 'web/components/select-users'
-import { DisplayUser } from 'common/api/user-types'
-import { usePrivateUser } from 'web/hooks/use-user'
-import { buildArray } from 'common/util/array'
-import { useT } from 'web/lib/locale'
+import {Row} from 'web/components/layout/row'
+import {SelectUsers} from 'web/components/select-users'
+import {DisplayUser} from 'common/api/user-types'
+import {usePrivateUser} from 'web/hooks/use-user'
+import {buildArray} from 'common/util/array'
+import {useT} from 'web/lib/locale'
 
 export default function NewMessageButton() {
   const [open, setOpen] = useState(false)
   const t = useT()
   return (
     <>
-      <Button className="h-fit gap-1" onClick={() => setOpen(true)}>
+      <Button className="h-fit gap-1" color={'gray-outline'} onClick={() => setOpen(true)}>
         <PlusIcon className="h-5 w-5" aria-hidden="true" />
         {t('messages.new_message', 'New Message')}
       </Button>