(css) vertical-center modals, bullet as separator

This commit is contained in:
Rigel Kent 2019-12-20 20:14:58 +01:00
parent 223b24e618
commit 3921166d78
No known key found for this signature in database
GPG Key ID: 5E53E96A494E452F
4 changed files with 25 additions and 4 deletions

View File

@ -23,7 +23,7 @@ export class ActionDropdownComponent<T> {
@Input() actions: DropdownAction<T>[] | DropdownAction<T>[][] = []
@Input() entry: T
@Input() placement = 'bottom-left'
@Input() placement = 'bottom-left auto'
@Input() buttonSize: DropdownButtonSize = 'normal'
@Input() buttonDirection: DropdownDirection = 'horizontal'

View File

@ -20,7 +20,7 @@
<my-date-toggle *ngIf="displayOptions.date" [date]="video.publishedAt"></my-date-toggle>
<span class="views">
<ng-container *ngIf="displayOptions.date && displayOptions.views"> - </ng-container>
<ng-container *ngIf="displayOptions.date && displayOptions.views"> </ng-container>
<ng-container i18n *ngIf="displayOptions.views">{{ video.views | myNumberFormatter }} views</ng-container>
</span>
</span>

View File

@ -43,7 +43,7 @@
<h1 class="video-info-name">{{ video.name }}</h1>
<div i18n class="video-info-date-views">
Published <my-date-toggle [date]="video.publishedAt"></my-date-toggle> <span class="views"> - {{ video.views | myNumberFormatter }} views</span>
Published <my-date-toggle [date]="video.publishedAt"></my-date-toggle> <span class="views"> {{ video.views | myNumberFormatter }} views</span>
</div>
</div>
@ -54,7 +54,7 @@
<div class="video-info-first-row-bottom">
<div i18n class="d-none d-md-block video-info-date-views">
Published <my-date-toggle [date]="video.publishedAt"></my-date-toggle> <span class="views"> - {{ video.views | myNumberFormatter }} views</span>
Published <my-date-toggle [date]="video.publishedAt"></my-date-toggle> <span class="views"> {{ video.views | myNumberFormatter }} views</span>
</div>
<div class="video-actions-rates">

View File

@ -37,7 +37,28 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
}
}
@media screen and (min-width: 768px) {
.modal:before {
display: inline-block;
vertical-align: middle;
content: " ";
height: 100%;
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
min-width: 500px;
width: 40vw;
max-width: 900px;
}
}
.modal {
text-align: center;
.modal-content {
background-color: var(--mainBackgroundColor);
}