Update AmountIn.js
This commit is contained in:
81
packages/react-app/src/components/AmountIn.js
vendored
81
packages/react-app/src/components/AmountIn.js
vendored
@@ -19,49 +19,48 @@ const AmountIn = () => {
|
||||
|
||||
return(
|
||||
<div className={styles.amountContainer}>
|
||||
<input
|
||||
placeholder="0.0"
|
||||
type="number"
|
||||
value={value}
|
||||
disabled={isSwapping}
|
||||
onChange={(e) => typeof onChange === "function" && onChange(e.target.value)}
|
||||
className={styles.amountInput}
|
||||
<input
|
||||
placeholder="0.0"
|
||||
type="number"
|
||||
value={value}
|
||||
disabled={isSwapping}
|
||||
onChange={(e) => typeof onChange === "function" && onChange(e.target.value)}
|
||||
className={styles.amountInput}
|
||||
/>
|
||||
|
||||
<div className="relative" onClick={() => setShowList(!showList)}>
|
||||
<button className={styles.currencyButton}>
|
||||
{activeCurrency}
|
||||
<img
|
||||
src={chevronDown}
|
||||
alt="cheveron-down"
|
||||
className={`w-4 h-4 object-contain ml-2 ${
|
||||
showList ? "rotate-180" : "rotate-0"
|
||||
}`}
|
||||
/>
|
||||
<div className="relative" onClick={() => setShowList(!showList)}>
|
||||
<button className={styles.currencyButton}>
|
||||
{"FHT"}
|
||||
<img
|
||||
src={chevronDown}
|
||||
alt="cheveron-down"
|
||||
className={`w-4 h-4 object-contain ml-2 ${
|
||||
showList ? "rotate-180" : "rotate-0"
|
||||
}`}
|
||||
/>
|
||||
</button>
|
||||
|
||||
{showList && (
|
||||
<ul ref={ref} className={styles.currencyList}>
|
||||
{Object.entries(currencies).map(([token, tokenName], index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`${styles.currencyListItem} ${
|
||||
activeCurrency === tokenName ? "bg-site-dim2" : ""
|
||||
} cursor-pointer`}
|
||||
onClick={() => {
|
||||
if (typeof onSelect === "function") onSelect(token);
|
||||
setActiveCurrency(tokenName);
|
||||
setShowList(false);
|
||||
}}
|
||||
>
|
||||
{tokenName}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
|
||||
</div>
|
||||
</button>
|
||||
|
||||
{showList && (
|
||||
<ul ref={ref} className={styles.currencyList}>
|
||||
{Object.entries(currencies).map(([token, tokenName], index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`${styles.currencyListItem} ${
|
||||
activeCurrency === tokenName ? "bg-site-dim2" : ""
|
||||
} cursor-pointer`}
|
||||
onClick={() => {
|
||||
if (typeof onSelect === "function") onSelect(token);
|
||||
setActiveCurrency(tokenName);
|
||||
setShowList(false);
|
||||
}}
|
||||
>
|
||||
{tokenName}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user