|
|
|
@ -37,7 +37,7 @@ const ThemeColor = () => { |
|
|
|
|
<p className="text-[#64b6df] text-lg font-sansbold "> |
|
|
|
|
Original Colors |
|
|
|
|
</p> |
|
|
|
|
<div className="flex flex-row justify-between mt-2"> |
|
|
|
|
<div className="flex flex-row justify-between mt-2 gap-x-5"> |
|
|
|
|
<ColorCard |
|
|
|
|
theme={theme} |
|
|
|
|
item="primary" |
|
|
|
@ -80,7 +80,7 @@ const ColorCard = ({ theme, text, dark, light, item, setItem }) => { |
|
|
|
|
return ( |
|
|
|
|
<div className="flex flex-col gap-y-3"> |
|
|
|
|
<div |
|
|
|
|
className={`flex flex-col cursor-pointer rounded-lg relative p-4 bg-${item} ${ |
|
|
|
|
className={`w-[344px] h-[130px] flex flex-col cursor-pointer rounded-sm relative p-4 bg-${item} ${ |
|
|
|
|
text ? `text-${item}Text` : "" |
|
|
|
|
}`}
|
|
|
|
|
onClick={() => setItem(item)} |
|
|
|
@ -98,11 +98,11 @@ const ColorCard = ({ theme, text, dark, light, item, setItem }) => { |
|
|
|
|
/> |
|
|
|
|
)} |
|
|
|
|
</div> |
|
|
|
|
<div className="flex flex-row gap-x-3"> |
|
|
|
|
<div className="flex flex-row justify-around"> |
|
|
|
|
{" "} |
|
|
|
|
{dark ? ( |
|
|
|
|
<div |
|
|
|
|
className={`flex-col cursor-pointer rounded-lg relative p-4 bg-${item}Dark ${ |
|
|
|
|
className={`flex-col cursor-pointer rounded-sm relative p-4 w-[160px] h-[75px] bg-${item}Dark ${ |
|
|
|
|
text ? `text-${item}Text` : "" |
|
|
|
|
}`}
|
|
|
|
|
onClick={() => setItem(item + "Dark")} |
|
|
|
@ -116,7 +116,7 @@ const ColorCard = ({ theme, text, dark, light, item, setItem }) => { |
|
|
|
|
) : null} |
|
|
|
|
{light ? ( |
|
|
|
|
<div |
|
|
|
|
className={`flex-col cursor-pointer rounded-lg relative p-4 bg-${item}Light ${ |
|
|
|
|
className={`flex flex-col cursor-pointer rounded-sm relative p-4 w-[160px] h-[75px] bg-${item}Light ${ |
|
|
|
|
text ? `text-${item}Text` : "" |
|
|
|
|
}`}
|
|
|
|
|
onClick={() => setItem(item + "Light")} |
|
|
|
|