diff options
author | Sebastian <sebasjm@gmail.com> | 2023-05-30 14:59:03 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2023-06-01 12:24:05 -0300 |
commit | 5e4c12831991660de627cad9c4ce0ee03ad5053d (patch) | |
tree | 5dce92a3f31c20c6da7e21bc466d17472378d697 /packages/taler-wallet-webextension/src/components/styled | |
parent | 592387cd742d2080eb3f53c755d53a4f017551be (diff) | |
download | wallet-core-5e4c12831991660de627cad9c4ce0ee03ad5053d.tar.xz |
use latest linaria lib
Diffstat (limited to 'packages/taler-wallet-webextension/src/components/styled')
-rw-r--r-- | packages/taler-wallet-webextension/src/components/styled/index.tsx | 30 |
1 files changed, 16 insertions, 14 deletions
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx index e36502333..92b8d2667 100644 --- a/packages/taler-wallet-webextension/src/components/styled/index.tsx +++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx @@ -16,7 +16,7 @@ // need to import linaria types, otherwise compiler will complain // eslint-disable-next-line @typescript-eslint/no-unused-vars -import type * as Linaria from "@linaria/core"; +// import type * as Linaria from "@linaria/core"; import { styled } from "@linaria/react"; @@ -24,7 +24,7 @@ export const PaymentStatus = styled.div<{ color: string }>` padding: 5px; border-radius: 5px; color: white; - background-color: ${(p) => p.color}; + background-color: ${(p: any) => p.color}; `; export const WalletAction = styled.div` @@ -100,7 +100,7 @@ export const WalletBox = styled.div<{ noPadding?: boolean }>` width: 800px; } & > section { - padding: ${({ noPadding }) => (noPadding ? "0px" : "8px")}; + padding: ${({ noPadding }: any) => (noPadding ? "0px" : "8px")}; margin-bottom: auto; overflow: auto; @@ -168,7 +168,7 @@ export const PopupBox = styled.div<{ noPadding?: boolean }>` justify-content: space-between; & > section { - padding: ${({ noPadding }) => (noPadding ? "0px" : "8px")}; + padding: ${({ noPadding }: any) => (noPadding ? "0px" : "8px")}; // this margin will send the section up when used with a header margin-bottom: auto; overflow-y: auto; @@ -411,7 +411,8 @@ export const Button = styled.button<{ upperCased?: boolean }>` cursor: pointer; user-select: none; box-sizing: border-box; - text-transform: ${({ upperCased }) => (upperCased ? "uppercase" : "none")}; + text-transform: ${({ upperCased }: any) => + upperCased ? "uppercase" : "none"}; font-family: inherit; font-size: 100%; @@ -461,7 +462,8 @@ export const Link = styled.a<{ upperCased?: boolean }>` cursor: pointer; user-select: none; box-sizing: border-box; - text-transform: ${({ upperCased }) => (upperCased ? "uppercase" : "none")}; + text-transform: ${({ upperCased }: any) => + upperCased ? "uppercase" : "none"}; font-family: inherit; font-size: 100%; @@ -539,7 +541,7 @@ export const LinkPrimary = styled(Link)` `; export const ButtonPrimary = styled(ButtonVariant)<{ small?: boolean }>` - font-size: ${({ small }) => (small ? "small" : "inherit")}; + font-size: ${({ small }: any) => (small ? "small" : "inherit")}; background-color: #0042b2; border-color: #0042b2; `; @@ -717,13 +719,13 @@ export const Input = styled.div<{ invalid?: boolean }>` & label { display: block; padding: 5px; - color: ${({ invalid }) => (!invalid ? "inherit" : "red")}; + color: ${({ invalid }: any) => (!invalid ? "inherit" : "red")}; } & input { display: block; padding: 5px; width: calc(100% - 4px - 10px); - border-color: ${({ invalid }) => (!invalid ? "inherit" : "red")}; + border-color: ${({ invalid }: any) => (!invalid ? "inherit" : "red")}; } `; @@ -735,7 +737,7 @@ export const InputWithLabel = styled.div<{ invalid?: boolean }>` font-weight: bold; margin-left: 0.5em; padding: 5px; - color: ${({ invalid }) => (!invalid ? "inherit" : "red")}; + color: ${({ invalid }: any) => (!invalid ? "inherit" : "red")}; } & div { @@ -761,7 +763,7 @@ export const InputWithLabel = styled.div<{ invalid?: boolean }>` /* border-color: lightgray; */ border-bottom-right-radius: 0.25em; border-top-right-radius: 0.25em; - border-color: ${({ invalid }) => (!invalid ? "lightgray" : "red")}; + border-color: ${({ invalid }: any) => (!invalid ? "lightgray" : "red")}; } margin-bottom: 16px; `; @@ -859,8 +861,8 @@ interface SvgIconProps { } export const SvgIcon = styled.div<SvgIconProps>` & > svg { - fill: ${({ color }) => color}; - transform: ${({ transform }) => (transform ? transform : "")}; + fill: ${({ color }: any) => color}; + transform: ${({ transform }: any) => (transform ? transform : "")}; } /* width: 24px; height: 24px; */ @@ -868,7 +870,7 @@ export const SvgIcon = styled.div<SvgIconProps>` margin-right: 8px; display: inline; padding: 4px; - cursor: ${({ onClick }) => (onClick ? "pointer" : "inherit")}; + cursor: ${({ onClick }: any) => (onClick ? "pointer" : "inherit")}; `; export const Icon = styled.div` |