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`