1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-27 12:56:01 +01:00
metamask-extension/ui/components/app/edit-gas-fee-popover/network-statistics/status-slider/index.scss
Elliot Winkler a820bce99a
Wire up network stability slider in new gas modal (#13029)
Use the new `networkCongestion` property available when we fetch gas fee
estimates.
2021-12-09 14:34:38 -07:00

48 lines
882 B
SCSS

.status-slider {
display: flex;
flex-direction: column;
justify-content: center;
width: 56px;
&__line {
background-image: linear-gradient(to right, #037dd6, #d73a49);
height: 4px;
width: 100%;
border-radius: 100px;
display: block;
}
&__label {
font-size: 10px;
font-weight: bold;
margin-top: 4px;
text-align: center;
}
&__arrow-container {
margin-left: -10px;
width: 100%;
}
&__arrow-border {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid white;
position: relative;
margin-bottom: -2px;
}
&__arrow {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid black;
position: absolute;
bottom: 3px;
left: -5px;
}
}