m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Dark Mode: Select Quote Popover (#14054)

Browse Source
This commit is contained in:
David Walsh 2022-03-21 08:33:22 -05:00 committed by GitHub
parent bb41494ccd
commit a79d3eb928
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/pages/swaps/exchange-rate-display/index.scss
View File

@ -46,8 +46,4 @@
-webkit-transform: rotate(180deg); -webkit-transform: rotate(180deg);
} }
} }
&--white {
color: var(--white);
}
} }

32
ui/pages/swaps/select-quote-popover/index.scss
View File

@ -72,18 +72,16 @@
@include H6; @include H6;
cursor: pointer; cursor: pointer;
color: var(--black); color: var(--color-text-default);
height: 49px; height: 49px;
border-bottom: 1px solid var(--color-background-alternative); border: 1px solid transparent;
margin-bottom: 8px; margin-bottom: 8px;
border-radius: 8px; border-radius: 8px;
background: var(--Grey-000); background: var(--color-background-alternative);
padding-right: 12px; padding-right: 12px;
border: none;
&:hover { &:hover {
border: 1px solid var(--color-primary-default); border: 1px solid var(--color-primary-default);
width: 101%;
padding-right: 11px; padding-right: 11px;
padding-left: 19.5px; padding-left: 19.5px;
} }
@ -98,32 +96,30 @@
} }
&--selected { &--selected {
color: var(--white); color: var(--color-text-default);
background: linear-gradient(90deg, var(--color-primary-default) 0%, var(--primary-alternative) 101.32%); background: linear-gradient(90deg, var(--color-primary-default) 0%, var(--primary-alternative) 101.32%);
box-shadow: 0 10px 39px rgba(3, 125, 214, 0.15); box-shadow: 0 10px 39px rgba(3, 125, 214, 0.15);
border-radius: 8px; border-radius: 8px;
border-bottom: none;
border-top: none;
height: 64px; height: 64px;
&:hover { &:hover {
color: var(--color-text-default);
background: linear-gradient(90deg, var(--color-primary-default) 0%, var(--color-primary-alternative) 101.32%); background: linear-gradient(90deg, var(--color-primary-default) 0%, var(--color-primary-alternative) 101.32%);
width: 100%; width: 100%;
padding-left: 20px; padding-left: 20px;
padding-right: 12px; padding-right: 12px;
border: none;
} }
.select-quote-popover__caret-right { .select-quote-popover__caret-right {
color: var(--white); color: var(--color-primary-inverse);
&:hover { &:hover {
color: var(--color-text-alternative); color: var(--color-text-default);
} }
} }
.select-quote-popover__zero-slippage { .select-quote-popover__zero-slippage {
color: var(--white); color: var(--color-primary-inverse);
} }
} }
} }
@ -159,7 +155,7 @@
&:hover { &:hover {
border-radius: 8px; border-radius: 8px;
background: white; background: var(--color-primary-inverse);
border: 1px solid var(--color-primary-default); border: 1px solid var(--color-primary-default);
} }
} }
@ -182,7 +178,7 @@
&__zero-slippage { &__zero-slippage {
font-size: 12px; font-size: 12px;
line-height: 100%; line-height: 100%;
color: #6a737d; color: var(--color-text-muted);
font-weight: normal; font-weight: normal;
} }
@ -239,7 +235,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
color: white; color: var(--color-primary-inverse);
border-radius: 5px; border-radius: 5px;
padding: 4px; padding: 4px;
font-size: 10px; font-size: 10px;
@ -247,15 +243,15 @@
padding-bottom: 2px; padding-bottom: 2px;
&--blue { &--blue {
background: var(--Blue-300); background: var(--color-primary-default);
} }
&--orange { &--orange {
background: var(--Orange-400); background: var(--color-secondary-default);
} }
&--green { &--green {
background: var(--Green-500); background: var(--color-success-default);
} }
} }
} }