Merge pull request #4734 from emanuelschuetze/motionMobileView

Fixed motion mobile view on iOS.
This commit is contained in:
Emanuel Schütze 2019-05-22 23:17:01 +02:00 committed by GitHub
commit a403715736
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 12 deletions

View File

@ -132,18 +132,15 @@
</div>
<ng-template #mobileView>
<div *ngIf="motion">
<!-- Meta info -->
<div class="hspacing"><ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container></div>
<div *ngIf="motion" class="mobile-view">
<mat-divider *ngIf="!editMotion" class="spacer-top-10 spacer-bottom-20"></mat-divider>
<!-- Meta info -->
<div class="on-transition-fade"><ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container></div>
<!-- Content -->
<div class="hspacing" [ngClass]="editMotion ? 'os-form-card-mobile' : 'os-card-mobile'">
<mat-card [ngClass]="editMotion ? 'os-form-card-mobile' : 'os-card'">
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
</div>
<mat-divider *ngIf="!editMotion" class="spacer-top-10 spacer-bottom-20"></mat-divider>
</mat-card>
<!-- Comments -->
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
@ -157,9 +154,7 @@
<div class="desktop-view" *ngIf="motion">
<div class="desktop-left on-transition-fade">
<!-- Meta Info -->
<div class="meta-info-block meta-info-desktop">
<ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container>
</div>
<div><ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container></div>
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
<os-personal-note *ngIf="!editMotion && !operator.isAnonymous" [motion]="motion"></os-personal-note>

View File

@ -156,6 +156,12 @@ span {
}
}
.mobile-view {
.os-card {
padding: 27px;
max-width: calc(100% - 54px);
}
}
.title-line {
display: flex;
}

View File

@ -90,7 +90,7 @@
<!-- recommendation line -->
<div
*ngIf="motion.recommendation && motion.state.next_states_id.length > 0"
class="ellipsis-overflow white"
class="ellipsis-overflow white spacer-top-3"
>
<mat-basic-chip class="bluegrey" [disabled]="true">
{{ getRecommendationLabel(motion) }}

View File

@ -266,6 +266,7 @@ mat-card {
margin-left: auto !important;
margin-right: auto !important;
font-size: 16px;
padding: 27px;
.mat-form-field {
width: 100%;
@ -274,6 +275,9 @@ mat-card {
}
.os-form-card-mobile {
margin-top: 20px !important;
margin-bottom: 20px !important;
.mat-form-field,
.mat-select {
width: 100%;
@ -498,6 +502,9 @@ button.mat-menu-item.selected {
}
/** helper classes for margin/padding */
.spacer-top-3 {
margin-top: 3px !important;
}
.spacer-top-10 {
margin-top: 10px !important;
}