diff options
author | Sebastian <sebasjm@gmail.com> | 2021-09-20 00:18:52 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-09-20 00:18:52 -0300 |
commit | 08bc5c6d8913513ed8e4a2038968fa8f05969e90 (patch) | |
tree | c44c59ff29d734e950bf0fd1fc4c34d1825dc42a /packages/taler-wallet-webextension/src | |
parent | 62b64cb453f6a4fd62c64bdd8e3240d5d7f03ce4 (diff) | |
download | wallet-core-08bc5c6d8913513ed8e4a2038968fa8f05969e90.tar.xz |
fix some feedback from belen
Diffstat (limited to 'packages/taler-wallet-webextension/src')
3 files changed, 24 insertions, 12 deletions
diff --git a/packages/taler-wallet-webextension/src/components/ExchangeToS.tsx b/packages/taler-wallet-webextension/src/components/ExchangeToS.tsx index 0325daa04..b7b0d2fd9 100644 --- a/packages/taler-wallet-webextension/src/components/ExchangeToS.tsx +++ b/packages/taler-wallet-webextension/src/components/ExchangeToS.tsx @@ -28,6 +28,11 @@ export function ExchangeXmlTos({ doc }: { doc: Document }) { </Fragment> } +/** + * Map XML elements into HTML + * @param child + * @returns + */ function renderChild(child: Element): VNode { const children = Array.from(child.children) switch (child.nodeName) { @@ -55,13 +60,16 @@ function renderChild(child: Element): VNode { } } +/** + * Simple anchor with a state persisted into 'data-open' prop + * @returns + */ function AnchorWithOpenState(props: JSXInternal.HTMLAttributes<HTMLAnchorElement>) { const [open, setOpen] = useState<boolean>(false) function doClick(e: JSXInternal.TargetedMouseEvent<HTMLAnchorElement>) { setOpen(!open); - e.stopPropagation(); e.preventDefault(); } - return <a data-open={JSON.stringify(open)} onClick={doClick} {...props} /> + return <a data-open={open ? 'true' : 'false'} onClick={doClick} {...props} /> } diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx index a46f38ee9..23b0b1b57 100644 --- a/packages/taler-wallet-webextension/src/components/styled/index.tsx +++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx @@ -339,6 +339,9 @@ export const ButtonBoxSuccess = styled(ButtonBox)` export const ButtonWarning = styled(ButtonVariant)` background-color: rgb(223, 117, 20); ` +export const LinkWarning = styled(Link)` + color: rgb(223, 117, 20); +` export const ButtonBoxWarning = styled(ButtonBox)` color: rgb(223, 117, 20); border-color: rgb(223, 117, 20); @@ -641,14 +644,17 @@ export const TermsOfService = styled.div` } a { + text-decoration: none; + color: inherit; + flex-direction: column; + } + + & > a { border: 1px solid black; border-radius: 5px; padding: 1em; margin-top: 2px; margin-bottom: 2px; - text-decoration: none; - color: inherit; - flex-direction: column; display: flex; &[data-open="true"] { @@ -666,10 +672,10 @@ export const TermsOfService = styled.div` height: auto; } - &[data-open="true"] header:after { + &[data-open="true"] > header:after { content: '\\2227'; } - &[data-open="false"] header:after { + &[data-open="false"] > header:after { content: '\\2228'; } } diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx index 304313a9e..b8b8159f3 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx @@ -28,7 +28,7 @@ import { CheckboxOutlined } from '../components/CheckboxOutlined'; import { ExchangeXmlTos } from '../components/ExchangeToS'; import { LogoHeader } from '../components/LogoHeader'; import { Part } from '../components/Part'; -import { ButtonDestructive, ButtonSuccess, ButtonWarning, LinkSuccess, TermsOfService, WalletAction } from '../components/styled'; +import { ButtonDestructive, ButtonSuccess, ButtonWarning, LinkSuccess, LinkWarning, TermsOfService, WalletAction } from '../components/styled'; import { acceptWithdrawal, getExchangeWithdrawalInfo, getWithdrawalDetailsForUri, onUpdateNotification, setExchangeTosAccepted } from "../wxApi"; @@ -42,8 +42,6 @@ export interface ViewProps { details: ExchangeWithdrawDetails; amount: string; onWithdraw: () => Promise<void>; - // setCancelled: (b: boolean) => void; - // setSelecting: (b: boolean) => void; onReview: (b: boolean) => void; onAccept: (b: boolean) => void; reviewing: boolean; @@ -171,9 +169,9 @@ export function View({ details, amount, onWithdraw, terms, reviewing, onReview, </ButtonSuccess> } {terms.status === 'notfound' && - <ButtonDestructive upperCased disabled> + <LinkWarning upperCased> {i18n.str`Exchange doesn't have terms of service`} - </ButtonDestructive> + </LinkWarning> } </section> </WalletAction> |