feat: fix modal colors

Author: nevo-david

apps/frontend/src/app/colors.scss

@@ -66,6 +66,8 @@
     --color-custom52: #eaeef2;
     --color-custom53: #7c7d86;
     --color-custom54: #afb8c1;
+    --color-custom55: #1b263b;
+    --color-modalCustom: #000000;
   }
   .light {
     --color-primary: #fff;
@@ -134,5 +136,7 @@
     --color-custom52: #eaeef2;
     --color-custom53: #7c7d86;
     --color-custom54: #afb8c1;
+    --color-custom55: #d5d7e1;
+    --color-modalCustom: transparent;
   }
 }

apps/frontend/src/app/global.scss

@@ -438,7 +438,7 @@ div div .set-font-family {
 .tags-top .react-tags__combobox {
   height: 44px;
   display: flex;
-  background-color: #141c2c;
+  background-color: var(--color-input);
   padding-left: 10px;
   padding-right: 10px;
   min-width: 150px;

apps/frontend/src/components/new-launch/add.post.button.tsx

@@ -29,7 +29,7 @@ export const AddPostButton: FC<{
           />
         </svg>
       </div>
-      <div className="text-white">{t('add_comment', 'Add comment')}</div>
+      <div className="!text-white">{t('add_comment', 'Add comment')}</div>
     </Button>
   );
 };

apps/frontend/src/components/new-launch/editor.tsx

@@ -369,7 +369,7 @@ export const Editor: FC<{
   return (
     <>
       <div className="relative bg-customColor2" id={id}>
-        <div className="flex gap-[5px] bg-[#1b263b] border-b border-t border-customColor3 justify-center items-center p-[5px]">
+        <div className="flex gap-[5px] bg-customColor55 border-b border-t border-customColor3 justify-center items-center p-[5px]">
           <SignatureBox editor={newRef?.current?.editor!} />
           <UText
             editor={newRef?.current?.editor!}
@@ -426,7 +426,7 @@ export const Editor: FC<{
           }}
         />
         {validateChars && props.value.length < 6 && (
-          <div className="px-3 text-sm bg-red-600 text-red-300 mb-[4px]">
+          <div className="px-3 text-sm bg-red-600 !text-white mb-[4px]">
             {t(
               'the_post_should_be_at_least_6_characters_long',
               'The post should be at least 6 characters long'

apps/frontend/src/components/new-launch/manage.modal.tsx

@@ -272,7 +272,7 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
     <>
       <div
         className={clsx(
-          'flex flex-col md:flex-row p-[10px] rounded-[4px] bg-primary gap-[20px]'
+          'flex flex-col md:flex-row p-[10px] rounded-[4px] bg-modalCustom gap-[20px]'
         )}
       >
         <div

apps/frontend/tailwind.config.js

@@ -70,6 +70,8 @@ module.exports = {
         customColor52: 'var(--color-custom52)',
         customColor53: 'var(--color-custom53)',
         customColor54: 'var(--color-custom54)',
+        customColor55: 'var(--color-custom55)',
+        modalCustom: 'var(--color-modalCustom)',
       },
       gridTemplateColumns: {
         13: 'repeat(13, minmax(0, 1fr));',