Refine text opacity in keywords hint and remove redundant background color in message header component.

Author: MartinBraquet

web/components/messaging/send-message-button.tsx

@@ -196,7 +196,7 @@ export const SendMessageButton = (props: {
             <>
               {!!profile.keywords?.length && (
                 <div className={'w-full border border-canvas-100 rounded-xl p-2'}>
-                  <p className={'text-ink-1000/55 mb-2 text-xs'}>
+                  <p className={'text-ink-1000/75 mb-2 text-xs'}>
                     {t(
                       'send_message.keywords_hint',
                       `Insert some of {name} topics in your message`,

web/pages/messages/[channelId].tsx

@@ -253,7 +253,7 @@ export const PrivateChat = (props: {
 
   return (
     <Col className="w-full">
-      <Row className={'border-ink-200 bg-canvas-50 h-14 items-center gap-1 border-b rounded-xl'}>
+      <Row className={'border-ink-200 h-14 items-center gap-1 border-b rounded-xl'}>
         <BackButton className="self-stretch" />
         {members && members.length > 0 ? (
           <MultipleOrSingleAvatars

web/styles/globals.css

@@ -244,8 +244,8 @@
     /*--color-ink-50: 17 17 17; !* #111111 *!*/
     /*--color-ink-0: 0 0 0; !* black *!*/
 
-    --color-canvas-25: 0 0 0;
-    --color-canvas-0: 20 20 20;
+    --color-canvas-0: 0 0 0;
+    --color-canvas-25: 20 20 20;
     --color-canvas-50: 20 20 20;
     --color-canvas-100: 40 40 40;
     --color-canvas-200: 60 60 60;