fix: image input fix color

ungdev · Sep 27, 2024 · ec03230 · ec03230
1 parent 5857a0d
commit ec03230
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 2 deletions.
diff --git a/src/components/UI/FileInput.module.scss b/src/components/UI/FileInput.module.scss
@@ -51,7 +51,7 @@
 
         >p {
             position: absolute;
-            color: black;
+            color: white;
             font-weight: 600;
             top: 50%;
             left: 50%;

diff --git a/src/components/UI/FileInput.tsx b/src/components/UI/FileInput.tsx
@@ -6,13 +6,16 @@ import { ChangeEvent, useRef, useState } from 'react';
  * Renders a component that allows the user to upload a file.
  */
 const FileUpload = ({
+  textColor = 'white',
   label,
   value = '',
   onChange,
   type,
   className = '',
   bg = 'white',
 }: {
+  /** The text color when there no image has been uploaded */
+  textColor?: string;
   /** The label to display. */
   label: string;
   /** The value of the file. */
@@ -77,7 +80,7 @@ const FileUpload = ({
           </>
         )}
 
-        <p className={error || (value === '' && preview === null) ? 'black' : ''}>
+        <p style={{ color: textColor }} className={error || (value === '' && preview === null) ? 'black' : ''}>
           Choisir un fichier{' '}
           {type
             .map((t) => `.${t}`)

diff --git a/src/components/dashboard/ItemModal.tsx b/src/components/dashboard/ItemModal.tsx
@@ -135,6 +135,7 @@ const ItemModal = ({
         />
         <Textarea label="Description" value={infos ?? ''} onChange={setInfos} />
         <FileInput
+          textColor="black"
           label="Logo"
           value={item && item?.image ? getItemImageLink(item.id) : ''}
           onChange={setLogo}

diff --git a/src/components/dashboard/PartnerModal.tsx b/src/components/dashboard/PartnerModal.tsx
@@ -77,6 +77,7 @@ const PartnerModal = ({
         <Input label="Lien" value={link ?? ''} onChange={setLink} />
         <Textarea label="Description" value={description ?? ''} onChange={setDescription} />
         <FileInput
+          textColor="black"
           label="Logo"
           value={partner ? getPartnerLogoLink(partner.id) : ''}
           onChange={setLogo}

diff --git a/src/components/dashboard/TournamentModal.tsx b/src/components/dashboard/TournamentModal.tsx
@@ -141,18 +141,21 @@ const TournamentModal = ({
         </div>
 
         <FileInput
+          textColor="black"
           label="Image"
           value={tournament ? getTournamentImageLink(tournament.id) : ''}
           onChange={setImage}
           type={['jpg']}
         />
         <FileInput
+          textColor="black"
           label="Image de fond"
           value={tournament ? getTournamentBackgroundLink(tournament.id) : ''}
           onChange={setBackgroundImage}
           type={['jpg']}
         />
         <FileInput
+          textColor="black"
           label="Règles"
           value={tournament ? getTournamentRulesLink(tournament.id) : ''}
           onChange={setRules}