src/modules/market-charts/components/market-outcome-charts--orders/market-outcome-charts--orders.styles.less
@import (reference) '~assets/styles/shared';
.MarketOutcomeOrderBook {
display: flex;
flex-direction: column;
height: 100%;
}
.MarketOutcomeOrderBook__stats {
flex: 0;
margin: 0.4em 0 -3px;
}
.MarketOutcomeOrderBook__Side {
&:extend(.caps--small);
flex: 1 1;
}
.MarketOutcomeOrderBook__side--asks {
border-top: 1px solid @color-gray;
height: auto;
justify-content: flex-end;
position: relative;
}
.MarketOutcomeOrderBook__container {
bottom: 0;
left: 0;
max-height: 100%;
overflow-y: auto;
position: absolute;
right: 0;
top: 0;
}
.MarketOutcomeOrderBook__container--asks {
top: unset;
}
.MarketOutcomeOrderBook__side--bids {
border-bottom: 1px solid @color-gray;
height: auto;
justify-content: flex-end;
position: relative;
}
.MarketOutcomeOrderBook__row {
display: flex;
padding: 0.3em 0;
width: 100%;
}
.MarketOutcomeOrderBook__row--head-ask {
.MarketOutcomeOrderBook__RowItem_ask {
color: @color-white;
}
}
.MarketOutcomeOrderBook__row--head-bid {
.MarketOutcomeOrderBook__RowItem_bid {
color: @color-white;
}
}
.MarketOutcomeOrderBook__row--hover {
background-color: fade(@color-white, 10%);
}
.MarketOutcomeOrderbook__row--hover-encompassed {
background-color: fade(@color-white, 5%);
}
.MarketOutcomeOrderBook__RowItem_ask {
color: @color-gray;
display: flex;
flex: 1;
font-size: 0.75rem;
font-weight: 700;
justify-content: flex-end;
overflow: hidden;
&:nth-child(2) {
color: @color-negative;
}
}
.MarketOutcomeOrderBook__RowItem_bid {
color: @color-gray;
display: flex;
flex: 1;
font-size: 0.75rem;
font-weight: 700;
justify-content: flex-end;
overflow: hidden;
&:nth-child(2) {
color: @color-positive;
}
}
.MarketOutcomeOrderBook__Midmarket {
margin: 1rem 0;
}