Fix war detail alignment
parent
1bb917add5
commit
148160dcb7
|
@ -8,10 +8,6 @@
|
|||
height: 100vh;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 0; /* remove scrollbar space */
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding: 10px;
|
||||
}
|
||||
|
|
|
@ -9,7 +9,7 @@ import {Location} from '@angular/common';
|
|||
@Component({
|
||||
selector: 'campaign-player-detail',
|
||||
templateUrl: './campaign-player-detail.component.html',
|
||||
styleUrls: ['./campaign-player-detail.component.css', '../../style/list-entry.css']
|
||||
styleUrls: ['./campaign-player-detail.component.css', '../../style/list-entry.css', '../../style/hide-scrollbar.css']
|
||||
})
|
||||
export class CampaignPlayerDetailComponent {
|
||||
|
||||
|
|
|
@ -1,13 +1,26 @@
|
|||
.vertical-spacer {
|
||||
height: 100vh;
|
||||
float: left;
|
||||
width: 4%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1500px) {
|
||||
.vertical-spacer {
|
||||
width: 15%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 2000px) {
|
||||
.vertical-spacer {
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
|
||||
.overview {
|
||||
position: fixed;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
border-left: thin solid lightgrey;
|
||||
bottom: 20px;
|
||||
width: 100%;
|
||||
padding-left: 50px;
|
||||
padding-top: 70px;
|
||||
margin-left: 10px;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
<div class="overview fade-in" xmlns="http://www.w3.org/1999/html">
|
||||
|
||||
<div style="min-height: 263px;">
|
||||
<div class="overview fade-in" xmlns="http://www.w3.org/1999/html">
|
||||
<div class=vertical-spacer>
|
||||
</div>
|
||||
<div style="overflow:hidden">
|
||||
<div style="width: 920px;min-height: 263px;">
|
||||
<h2>{{war.title}} - vom {{war.date | date: 'dd.MM.yyyy'}}</h2>
|
||||
<h3 class="pull-left" style="width: 250px">
|
||||
<h4>Endpunktestand:</h4>
|
||||
|
@ -80,5 +82,6 @@
|
|||
<ngx-datatable-column [width]="100" name="Tod" prop="death"></ngx-datatable-column>
|
||||
<ngx-datatable-column [width]="100" name="Respawn" prop="respawn"></ngx-datatable-column>
|
||||
</ngx-datatable>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -7,7 +7,7 @@ import {War} from "../../models/model-interfaces";
|
|||
@Component({
|
||||
selector: 'war-detail',
|
||||
templateUrl: './war-detail.component.html',
|
||||
styleUrls: ['./war-detail.component.css', '../../style/list-entry.css']
|
||||
styleUrls: ['./war-detail.component.css', '../../style/list-entry.css', '../../style/hide-scrollbar.css']
|
||||
})
|
||||
export class WarDetailComponent {
|
||||
|
||||
|
|
|
@ -0,0 +1,9 @@
|
|||
::-webkit-scrollbar {
|
||||
/*width: 0px; !* remove scrollbar space *!*/
|
||||
background: transparent; /* just make scrollbar invisible */
|
||||
}
|
||||
|
||||
/* show position indicator in red */
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgb(234, 234, 234);
|
||||
}
|
Loading…
Reference in New Issue