fix: PoweredBy hover color

lifinance · Jun 27, 2022 · e6b75d1 · e6b75d1
1 parent 92eb8fa
commit e6b75d1
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 8 deletions.
diff --git a/packages/widget/src/components/Header/Header.style.ts b/packages/widget/src/components/Header/Header.style.ts
@@ -9,7 +9,7 @@ export const HeaderAppBar = styled(AppBar)(({ theme }) => ({
   position: 'relative',
   minHeight: 48,
   padding: theme.spacing(0, 3, 0, 3),
-  '&:first-of-type': {
+  ':first-of-type': {
     paddingTop: theme.spacing(1.5),
   },
 }));

diff --git a/packages/widget/src/components/LiFiLogo.tsx b/packages/widget/src/components/LiFiLogo.tsx
@@ -7,5 +7,5 @@ export const LiFiLogo: React.FC<{
   style?: CSSProperties;
 }> = ({ variant = 'icon', style }) => {
   const Component = variant === 'icon' ? LiFiIconLogo : LiFiFullLogo;
-  return <Component style={style} fill="currentColor" />;
+  return <Component style={style} fill="currentColor" color="currentColor" />;
 };
diff --git a/packages/widget/src/components/PoweredBy/PoweredBy.style.ts b/packages/widget/src/components/PoweredBy/PoweredBy.style.ts
@@ -0,0 +1,10 @@
+import { Link as MuiLink } from '@mui/material';
+import { styled } from '@mui/material/styles';
+
+export const Link = styled(MuiLink)(({ theme }) => ({
+  display: 'flex',
+  alignItems: 'center',
+  ':hover': {
+    color: theme.palette.primary.main,
+  },
+}));
diff --git a/packages/widget/src/components/PoweredBy.tsx → ...et/src/components/PoweredBy/PoweredBy.tsx b/packages/widget/src/components/PoweredBy.tsx → ...et/src/components/PoweredBy/PoweredBy.tsx
@@ -1,5 +1,6 @@
-import { Box, Link, Typography } from '@mui/material';
-import { LiFiLogo } from './LiFiLogo';
+import { Box, Typography } from '@mui/material';
+import { LiFiLogo } from '../LiFiLogo';
+import { Link } from './PoweredBy.style';
 
 export const PoweredBy: React.FC = () => {
   return (
@@ -15,10 +16,6 @@ export const PoweredBy: React.FC = () => {
       }}
     >
       <Link
-        sx={{
-          display: 'flex',
-          alignItems: 'center',
-        }}
         href="https://li.fi"
         target="_blank"
         underline="none"

diff --git a/packages/widget/src/components/PoweredBy/index.ts b/packages/widget/src/components/PoweredBy/index.ts
@@ -0,0 +1 @@
+export { PoweredBy } from './PoweredBy';