add button component

This commit is contained in:
João Geonizeli
2021-08-28 10:27:38 -03:00
parent c9785f8f57
commit 0b78ef504d
8 changed files with 56 additions and 19 deletions

View File

@@ -3,9 +3,8 @@ import type { ChangeEvent, FC } from "react";
import React, { useState } from "react";
import { useRelayEnvironment } from "react-relay";
import { Modal } from "../../../../components";
import { Button, Modal, Input } from "../../../../components";
import { commitCreateStakeRemoveOrderMutation } from "./commitCreateStakeRemoveOrder";
import { Input } from "../../../../components/Input/Input";
type RemoveStakeModal = {
setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
@@ -86,13 +85,9 @@ export const RemoveStakeModal: FC<RemoveStakeModal> = ({
{avaliableCake.isEqualTo(0) && (
<span className="text-red-500 mb-1">Você não possuí saldo.</span>
)}
<button
className="cursor-pointer py-2 px-4 disabled:opacity-50 disabled:cursor-default bg-red-600 hover:bg-red-700 focus:ring-red-500 focus:ring-offset-red-200 text-white w-full transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg"
disabled={!stakeAvaliable}
type="submit"
>
<Button variant="dangeour" disabled={!stakeAvaliable} type="submit">
Remover Stake
</button>
</Button>
</form>
</Modal>
);

View File

@@ -3,7 +3,7 @@ import React, { useState } from "react";
import { BigNumber } from "bignumber.js";
import { useRelayEnvironment } from "react-relay";
import { Modal } from "../../../components";
import { Button, Modal } from "../../../components";
import { commitCreateStakeOrderMutation } from "./createStakeOrder";
import { Input } from "../../../components/Input/Input";
@@ -86,13 +86,9 @@ export const StakeOrderModal: FC<Props> = ({ poolName, balance }) => {
{avaliableCake.isEqualTo(0) && (
<span className="text-red-500 mb-1">Você não possuí saldo.</span>
)}
<button
className="cursor-pointer py-2 px-4 disabled:opacity-50 disabled:cursor-default bg-blue-600 hover:bg-blue-700 focus:ring-blue-500 focus:ring-offset-blue-200 text-white w-full transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg"
disabled={!stakeAvaliable}
type="submit"
>
<Button disabled={!stakeAvaliable} type="submit">
Fazer Stake
</button>
</Button>
</form>
</Modal>
</div>

View File

@@ -11,7 +11,7 @@ import type { ExchangePanel_fiatBalances$key } from "./__generated__/ExchangePan
import type { ExchangePanel_balances$key } from "./__generated__/ExchangePanel_balances.graphql";
import { commitCreateSellCryptoOrderMutation } from "./createSellCryptoOrder";
import { commitCreateBuyCryptoOrderMutation } from "./createBuyCryptoOrder";
import { Input } from "../../../../components/Input/Input";
import { Input, Button } from "../../../../components";
const tabBaseStyles =
"w-full text-base font-bold text-black px-4 py-2 focus:ring-blue-500";
@@ -192,13 +192,13 @@ export const ExchangePanel: FC<Props> = ({
)}
</div>
<button
<Button
className="cursor-pointer py-2 px-4 disabled:opacity-50 disabled:cursor-default bg-blue-600 hover:bg-blue-700 focus:ring-blue-500 focus:ring-offset-blue-200 text-white w-full transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg"
type="submit"
disabled={submitDisabled}
>
{exchangeOption === "BUY" ? "Comprar" : "Vender"} CAKE
</button>
</Button>
</form>
</div>
);