mobile ready rank overview
parent
6f0428ea66
commit
1938d74b08
|
@ -90,7 +90,7 @@ h1 {
|
|||
|
||||
@media all and (max-width: 959px) {
|
||||
width: 33%;
|
||||
float:left;
|
||||
float: left;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
import {Component, OnDestroy, OnInit} from '@angular/core';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
|
||||
import {Fraction} from '../../utils/fraction.enum';
|
||||
import {Decoration} from '../../models/model-interfaces';
|
||||
import {DecorationService} from '../../services/army-management/decoration.service';
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div style="width: 1000px; margin:auto; position: relative;">
|
||||
<div class="rank-overview-container">
|
||||
<h1>{{'public.ranks.headline' | translate}}</h1>
|
||||
|
||||
<div class="column-container pull-left">
|
||||
|
|
|
@ -1,5 +1,52 @@
|
|||
@import url('../../style/background-image.scss');
|
||||
|
||||
.rank-overview-container {
|
||||
width: 1000px;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media all and (max-width: 959px) {
|
||||
.rank-overview-container {
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
div.column-container {
|
||||
width: 49vw;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 26px;
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.mat-column-picture {
|
||||
max-width: 4vw;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
max-width: 7.5vw;
|
||||
}
|
||||
|
||||
td.mat-cell:first-child {
|
||||
padding-left: 1vw;
|
||||
}
|
||||
|
||||
td > img {
|
||||
height: 13vh !important;
|
||||
max-height: 120px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
:host {
|
||||
margin-bottom: -50vh;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue