Files
roll20-character-sheets-tester/Crossed-Fates/source/app/components/header/header.scss
T
2021-06-01 14:47:53 -05:00

62 lines
1.1 KiB
SCSS

.rivals-header {
display: inline-grid;
grid-template-columns: auto 100px auto;
background-color: $light-gray;
@include fill-available();
height: 100px;
padding: 0.5em;
margin-bottom: 1em;
.rival {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.logo {
background-image: url();
background-repeat: no-repeat;
// background-position: bottom center;
}
.header-left, .header-right {
.rival-stat {
display: inline-grid;
grid-template-columns: 20% 80%;
border-bottom: 4px solid $dark-gray;
align-items: center;
@include fill-available();
.header-value {
margin-bottom: 0;
border: none;
}
.header-label {
font-weight: bold;
font-size: 1.2em;
@include std-font($narrow-font);
}
}
}
.header-right {
.rival-stat {
grid-template-columns: 80% 20%;
}
.header-label {
text-align: right;
}
.header-value { text-align: right; }
}
.header-left .header-label:after,
.header-right .header-label:before {
content: ' : ';
@include std-font($narrow-font);
}
}