wip

Author: Albert Folch

package-lock.json

@@ -46,7 +46,7 @@
   "dependencies": {
     "@apollo/client": "^3.8.1",
     "@bosonprotocol/chat-sdk": "^1.3.1-alpha.9",
-    "@bosonprotocol/react-kit": "^0.36.0-alpha.9",
+    "@bosonprotocol/react-kit": "^0.36.0-alpha.11",
     "@davatar/react": "^1.10.4",
     "@ethersproject/address": "^5.6.1",
     "@ethersproject/units": "^5.7.0",

package.json

@@ -1,4 +1,4 @@
-import { subgraph } from "@bosonprotocol/react-kit";
+import { colors, subgraph } from "@bosonprotocol/react-kit";
 import { Provider, WithdrawFundsButton } from "@bosonprotocol/react-kit";
 import {
   extractUserFriendlyError,
@@ -15,7 +15,6 @@ import {
 import { useState } from "react";
 import styled from "styled-components";
 
-import { colors } from "../../../../lib/styles/colors";
 import { useSigner } from "../../../../lib/utils/hooks/connection/connection";
 import { useAddPendingTransaction } from "../../../../lib/utils/hooks/transactions/usePendingTransactions";
 import { Spinner } from "../../../loading/Spinner";
@@ -30,7 +29,7 @@ import {
 } from "./FinancesStyles";
 
 const MaxLimitWrapper = styled.div`
-  color: ${colors.grey};
+  color: ${colors.greyDark};
   margin-top: 0.25rem;
 `;
 

src/components/modal/components/SellerFinance/FinanceWithdraw.tsx

@@ -1,5 +1,5 @@
 import { defaultFontFamily } from "lib/styles/fonts";
-import styled from "styled-components";
+import styled, { css } from "styled-components";
 
 import { colors } from "../../../../lib/styles/colors";
 import Button from "../../../ui/Button";
@@ -26,11 +26,11 @@ export const InputWrapper = styled(Grid)<{ $hasError?: boolean }>`
   margin-top: -1rem;
   padding: 1.125rem 1rem;
   max-height: 3.5rem;
-  background: ${colors.greyDark};
+  background: ${colors.greyLight};
   ${({ $hasError }) =>
     $hasError &&
-    `
-    border: 0.0625rem solid ${colors.red};
+    css`
+      border: 0.0625rem solid ${colors.red};
     `}
 `;
 
@@ -44,7 +44,6 @@ export const Input = styled.input`
   font-size: 1rem;
   font-weight: 500;
   line-height: 1.5;
-  color: ${colors.white};
   &:focus {
     outline: none;
   }