parent
							
								
									44f9cabdb2
								
							
						
					
					
						commit
						e829dc6484
					
				
				 2 changed files with 60 additions and 58 deletions
			
			
		| @ -0,0 +1,59 @@ | ||||
| import React from "react"; | ||||
| import ItemColor from "./ItemColor"; | ||||
| 
 | ||||
| const ColorCard = ({ theme, text, dark, light, item, setItem }) => { | ||||
|   return ( | ||||
|     <div className="flex flex-col gap-y-3"> | ||||
|       <div | ||||
|         className={`w-[344px] h-[130px] flex flex-col cursor-pointer rounded-sm relative p-4 bg-${item} ${ | ||||
|           text ? `text-${item}Text` : "" | ||||
|         }`}
 | ||||
|         onClick={() => setItem(item)} | ||||
|       > | ||||
|         <ItemColor className=" text-2xl font-bold" item={item} theme={theme} /> | ||||
|         {text && ( | ||||
|           <ItemColor | ||||
|             className="self-end text-sm" | ||||
|             item={item + "Text"} | ||||
|             theme={theme} | ||||
|             onClick={(e) => { | ||||
|               e.stopPropagation(); | ||||
|               setItem(item + "Text"); | ||||
|             }} | ||||
|           /> | ||||
|         )} | ||||
|       </div> | ||||
|       <div className="flex flex-row justify-between"> | ||||
|         {" "} | ||||
|         {dark ? ( | ||||
|           <div | ||||
|             className={`flex-col cursor-pointer rounded-sm relative p-4 w-[165px] h-[75px] bg-${item}Dark ${ | ||||
|               text ? `text-${item}Text` : "" | ||||
|             }`}
 | ||||
|             onClick={() => setItem(item + "Dark")} | ||||
|           > | ||||
|             <ItemColor | ||||
|               className=" text-lg font-bold" | ||||
|               item={item + "Dark"} | ||||
|               theme={theme} | ||||
|             /> | ||||
|           </div> | ||||
|         ) : null} | ||||
|         {light ? ( | ||||
|           <div | ||||
|             className={`flex flex-col cursor-pointer rounded-sm relative p-4 w-[165px] h-[75px]  bg-${item}Light ${ | ||||
|               text ? `text-${item}Text` : "" | ||||
|             }`}
 | ||||
|             onClick={() => setItem(item + "Light")} | ||||
|           > | ||||
|             <ItemColor | ||||
|               className=" text-lg font-bold" | ||||
|               item={item + "Light"} | ||||
|               theme={theme} | ||||
|             /> | ||||
|           </div> | ||||
|         ) : null} | ||||
|       </div> | ||||
|     </div> | ||||
|   ); | ||||
| }; | ||||
					Loading…
					
					
				
		Reference in new issue