lila/ui/storm/css/_high.scss

62 lines
1.1 KiB
SCSS

.storm-dashboard__high {
&__periods {
display: flex;
flex-flow: row wrap;
@include breakpoint($mq-xx-small) {
flex-flow: row nowrap;
}
}
&__period {
@extend %flex-column, %box-neat, %roboto;
align-items: center;
justify-content: center;
flex: 1 1 auto;
margin-right: 4%;
background: $c-bg-box;
padding: 3em 1em 1.5em 1em;
@include breakpoint($mq-not-xx-small) {
flex: 48% 0;
margin-bottom: 1vh;
&:nth-child(2) {
margin-right: 0;
}
}
strong {
font-family: 'storm';
font-weight: normal;
font-size: 3em;
@include breakpoint($mq-xx-small) {
font-size: 5em;
}
}
.highlight-alltime & {
&:first-child {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.3) 0%, transparent 45%) $c-brag;
color: $c-brag-over;
strong {
font-size: 4em;
line-height: .8em;
@include breakpoint($mq-xx-small) {
font-size: 9em;
}
}
}
}
&:last-child {
margin-right: 0;
}
}
}