chore: remove theme.blue200 (#4533)
* chore: remove theme.blue200 * favorite button changes
This commit is contained in:
parent
98d4e108e6
commit
f194845b2b
@ -15,9 +15,9 @@ const FavoriteButtonContent = styled.div`
|
||||
const StyledFavoriteButton = styled.button<{ active: boolean }>`
|
||||
padding: 0px 16px;
|
||||
border-radius: 12px;
|
||||
background-color: ${({ theme, active }) => (active ? theme.accentAction : theme.backgroundInteractive)};
|
||||
background-color: ${({ theme, active }) => (active ? theme.accentActiveSoft : theme.backgroundInteractive)};
|
||||
border: none;
|
||||
color: ${({ theme, active }) => (active ? theme.white : theme.textPrimary)};
|
||||
color: ${({ theme, active }) => (active ? theme.accentActive : theme.textPrimary)};
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
@ -38,7 +38,11 @@ export default function FavoriteButton() {
|
||||
return (
|
||||
<StyledFavoriteButton onClick={() => setShowFavorites(!showFavorites)} active={showFavorites}>
|
||||
<FavoriteButtonContent>
|
||||
<Heart size={17} color={showFavorites ? theme.white : theme.textPrimary} fill="transparent" />
|
||||
<Heart
|
||||
size={17}
|
||||
color={showFavorites ? theme.accentActive : theme.textPrimary}
|
||||
fill={showFavorites ? theme.accentActive : 'transparent'}
|
||||
/>
|
||||
<FavoriteText>
|
||||
<Trans>Favorites</Trans>
|
||||
</FavoriteText>
|
||||
|
@ -63,7 +63,7 @@ const MenuTimeFlyout = styled.span`
|
||||
const StyledMenuButton = styled.button<{ open: boolean }>`
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: ${({ theme, open }) => (open ? theme.blue200 : theme.textPrimary)};
|
||||
color: ${({ theme, open }) => (open ? theme.accentActive : theme.textPrimary)};
|
||||
border: none;
|
||||
background-color: ${({ theme, open }) => (open ? theme.accentActiveSoft : theme.backgroundInteractive)};
|
||||
margin: 0;
|
||||
@ -115,7 +115,7 @@ const StyledMenuContent = styled.div`
|
||||
|
||||
const Chevron = styled.span<{ open: boolean }>`
|
||||
padding-top: 1px;
|
||||
color: ${({ open, theme }) => (open ? theme.blue200 : theme.textSecondary)};
|
||||
color: ${({ open, theme }) => (open ? theme.accentActive : theme.textSecondary)};
|
||||
`
|
||||
const NetworkLabel = styled.div`
|
||||
display: flex;
|
||||
|
@ -81,7 +81,7 @@ const StyledMenuButton = styled.button<{ open: boolean }>`
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
color: ${({ theme, open }) => (open ? theme.blue200 : theme.textPrimary)};
|
||||
color: ${({ theme, open }) => (open ? theme.accentActive : theme.textPrimary)};
|
||||
margin: 0;
|
||||
background-color: ${({ theme, open }) => (open ? theme.accentActiveSoft : theme.backgroundInteractive)};
|
||||
padding: 6px 12px 6px 12px;
|
||||
@ -131,7 +131,7 @@ const StyledMenuContent = styled.div`
|
||||
|
||||
const Chevron = styled.span<{ open: boolean }>`
|
||||
padding-top: 1px;
|
||||
color: ${({ open, theme }) => (open ? theme.blue200 : theme.textSecondary)};
|
||||
color: ${({ open, theme }) => (open ? theme.accentActive : theme.textSecondary)};
|
||||
`
|
||||
|
||||
// TODO: change this to reflect data pipeline
|
||||
|
@ -131,7 +131,6 @@ function uniswapThemeColors(darkMode: boolean): ThemeColors {
|
||||
chain_421611: colorsDark.chain_421611,
|
||||
chain_80001: colorsDark.chain_80001,
|
||||
|
||||
blue200: ColorsPalette.blue200,
|
||||
shallowShadow: darkMode ? colorsDark.shallowShadow : colorsLight.shallowShadow,
|
||||
deepShadow: darkMode ? colorsDark.deepShadow : colorsLight.deepShadow,
|
||||
hoverState: opacify(24, ColorsPalette.blue200),
|
||||
|
1
src/theme/styled.d.ts
vendored
1
src/theme/styled.d.ts
vendored
@ -53,7 +53,6 @@ export interface ThemeColors {
|
||||
chain_421611: Color
|
||||
chain_80001: Color
|
||||
|
||||
blue200: Color
|
||||
shallowShadow: Color
|
||||
deepShadow: Color
|
||||
hoverState: Color
|
||||
|
Loading…
Reference in New Issue
Block a user