app/assets/stylesheets/players/_show.scss
.player-summary {
position: relative;
@include clearfix;
}
.player-summary-content {
@include desktop {
@include calc(margin-left, "100px + 1em"); // avatar + gutter
}
ul {
list-style: none;
padding: 0;
strong {
margin-right: 5px;
}
}
}
.player-edit-link {
position: absolute;
top: 1em;
right: 1em;
}
.player-stats {
width: 100%;
thead {
@include mobile {
display: none;
}
}
th,
td {
padding: 0 10px;
@include desktop {
&:not(:first-child) {
text-align: center;
}
}
@include mobile {
display: block;
&:before {
content: attr(data-label);
font-weight: bold;
margin-right: 10px;
}
}
}
}
.player-win-percentages,
.player-match-history {
@include desktop {
width: 50%;
float: left;
padding-top: modular-scale(0);
&:first-child {
padding-right: modular-scale(2);
}
&:last-child {
padding-left: modular-scale(2);
}
}
}
.player-win-percentage-list {
width: 100%;
}
.player-summary-avatar {
height: 100px;
@include desktop {
float: left;
}
}
.player-elo-chart {
@include user-select(none);
float: left;
width: 100%;
}