From 5e1499ed8246bc99b15c853ae97a3bdad72692d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= <git@mkljczk.pl>
Date: Sun, 24 Mar 2024 20:37:39 +0100
Subject: [PATCH] More colors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
---
 src/components/autosuggest-input.tsx                       | 4 ++--
 src/components/dropdown-menu/dropdown-menu-item.tsx        | 2 +-
 src/components/ui/input/input.tsx                          | 2 +-
 src/components/ui/select/select.tsx                        | 2 +-
 src/features/compose/editor/plugins/autosuggest-plugin.tsx | 4 ++--
 src/styles/components/compose-form.scss                    | 6 +++---
 src/styles/components/datepicker.scss                      | 2 +-
 7 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/autosuggest-input.tsx b/src/components/autosuggest-input.tsx
index c24643228..94e613d36 100644
--- a/src/components/autosuggest-input.tsx
+++ b/src/components/autosuggest-input.tsx
@@ -199,8 +199,8 @@ export default class AutosuggestInput extends ImmutablePureComponent<IAutosugges
         key={key}
         data-index={i}
         className={clsx({
-          'px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-primary-800 group': true,
-          'bg-gray-100 dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800': i === selectedSuggestion,
+          'px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-primary-800 group black:hover:bg-gray-900 black:focus:bg-gray-900': true,
+          'bg-gray-100 dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800 black:bg-gray-900 black:hover:bg-gray-900': i === selectedSuggestion,
         })}
         onMouseDown={this.onSuggestionClick}
         onTouchEnd={this.onSuggestionClick}
diff --git a/src/components/dropdown-menu/dropdown-menu-item.tsx b/src/components/dropdown-menu/dropdown-menu-item.tsx
index 8c74e652a..adf4f1526 100644
--- a/src/components/dropdown-menu/dropdown-menu-item.tsx
+++ b/src/components/dropdown-menu/dropdown-menu-item.tsx
@@ -86,7 +86,7 @@ const DropdownMenuItem = ({ index, item, onClick }: IDropdownMenuItem) => {
         title={item.text}
         className={
           clsx({
-            'flex px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-gray-800 focus:outline-none cursor-pointer': true,
+            'flex px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-gray-800 focus:outline-none cursor-pointer black:hover:bg-gray-900 black:focus:bg-gray-900': true,
             'text-danger-600 dark:text-danger-400': item.destructive,
           })
         }
diff --git a/src/components/ui/input/input.tsx b/src/components/ui/input/input.tsx
index bb8db57f3..e1a069dd0 100644
--- a/src/components/ui/input/input.tsx
+++ b/src/components/ui/input/input.tsx
@@ -92,7 +92,7 @@ const Input = React.forwardRef<HTMLInputElement, IInput>(
               ['normal', 'search'].includes(theme),
             'text-gray-900 dark:text-gray-100': !props.disabled,
             'text-gray-600': props.disabled,
-            'rounded-md bg-white dark:bg-gray-900 border-gray-400 dark:border-gray-800': theme === 'normal',
+            'rounded-md bg-white dark:bg-gray-900 border-gray-400 dark:border-gray-800 black:bg-black': theme === 'normal',
             'rounded-full bg-gray-200 border-gray-200 dark:bg-gray-800 dark:border-gray-800 focus:bg-white dark:focus:bg-gray-900': theme === 'search',
             'pr-10 rtl:pl-10 rtl:pr-3': isPassword || append,
             'pl-8': typeof icon !== 'undefined',
diff --git a/src/components/ui/select/select.tsx b/src/components/ui/select/select.tsx
index 4c4c6c2c1..b67ebe975 100644
--- a/src/components/ui/select/select.tsx
+++ b/src/components/ui/select/select.tsx
@@ -13,7 +13,7 @@ const Select = React.forwardRef<HTMLSelectElement, ISelect>((props, ref) => {
     <select
       ref={ref}
       className={clsx(
-        'w-full truncate rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-primary-500 focus:outline-none focus:ring-primary-500 disabled:opacity-50 sm:text-sm dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:focus:border-primary-500 dark:focus:ring-primary-500',
+        'w-full truncate rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-primary-500 focus:outline-none focus:ring-primary-500 disabled:opacity-50 black:bg-black sm:text-sm dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:focus:border-primary-500 dark:focus:ring-primary-500',
         className,
       )}
       {...filteredProps}
diff --git a/src/features/compose/editor/plugins/autosuggest-plugin.tsx b/src/features/compose/editor/plugins/autosuggest-plugin.tsx
index 5afc6c748..834d04721 100644
--- a/src/features/compose/editor/plugins/autosuggest-plugin.tsx
+++ b/src/features/compose/editor/plugins/autosuggest-plugin.tsx
@@ -378,8 +378,8 @@ const AutosuggestPlugin = ({
         key={key}
         data-index={i}
         className={clsx({
-          'snap-start snap-always px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-primary-800 group': true,
-          'snap-start snap-always bg-gray-100 dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800': i === selectedSuggestion,
+          'snap-start snap-always px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800 focus:bg-gray-100 dark:focus:bg-primary-800 group black:hover:bg-gray-900 black:focus:bg-gray-900': true,
+          'snap-start snap-always bg-gray-100 dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800 black:bg-gray-900 black:hover:bg-gray-900': i === selectedSuggestion,
         })}
         onMouseDown={handleSelectSuggestion}
       >
diff --git a/src/styles/components/compose-form.scss b/src/styles/components/compose-form.scss
index 8b9614c1d..dd1b17802 100644
--- a/src/styles/components/compose-form.scss
+++ b/src/styles/components/compose-form.scss
@@ -128,7 +128,7 @@
   }
 
   &__dropdown {
-    @apply absolute bg-white dark:bg-gray-900 z-[1000] rounded-md shadow-lg ml-10 text-sm overflow-hidden;
+    @apply absolute bg-white dark:bg-gray-900 z-[1000] rounded-md shadow-lg ml-10 text-sm overflow-hidden black:bg-black black:border black:border-gray-800;
 
     &.top {
       transform-origin: 50% 100%;
@@ -140,10 +140,10 @@
   }
 
   &__option {
-    @apply flex p-2.5 text-sm text-gray-700 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 cursor-pointer;
+    @apply flex p-2.5 text-sm text-gray-700 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 cursor-pointer black:hover:bg-gray-900;
 
     &.active {
-      @apply bg-gray-100 dark:bg-gray-800;
+      @apply bg-gray-100 dark:bg-gray-800 black:bg-gray-900;
     }
 
     &:hover,
diff --git a/src/styles/components/datepicker.scss b/src/styles/components/datepicker.scss
index b1acb8313..13bc71585 100644
--- a/src/styles/components/datepicker.scss
+++ b/src/styles/components/datepicker.scss
@@ -12,7 +12,7 @@
 
 .react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before,
 .react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::after {
-  @apply border-b-white dark:border-b-gray-900;
+  @apply border-b-white dark:border-b-gray-900 black:border-b-black;
 }
 
 .react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before {