Fixed motion mobile view on iOS.
This commit is contained in:
parent
f52ca7d941
commit
63daac7b65
@ -132,18 +132,15 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ng-template #mobileView>
|
<ng-template #mobileView>
|
||||||
<div *ngIf="motion">
|
<div *ngIf="motion" class="mobile-view">
|
||||||
<!-- Meta info -->
|
|
||||||
<div class="hspacing"><ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container></div>
|
|
||||||
|
|
||||||
<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 -->
|
<!-- 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>
|
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
|
||||||
</div>
|
</mat-card>
|
||||||
|
|
||||||
<mat-divider *ngIf="!editMotion" class="spacer-top-10 spacer-bottom-20"></mat-divider>
|
|
||||||
|
|
||||||
<!-- Comments -->
|
<!-- Comments -->
|
||||||
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
|
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
|
||||||
@ -157,9 +154,7 @@
|
|||||||
<div class="desktop-view" *ngIf="motion">
|
<div class="desktop-view" *ngIf="motion">
|
||||||
<div class="desktop-left on-transition-fade">
|
<div class="desktop-left on-transition-fade">
|
||||||
<!-- Meta Info -->
|
<!-- Meta Info -->
|
||||||
<div class="meta-info-block meta-info-desktop">
|
<div><ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container></div>
|
||||||
<ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
|
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
|
||||||
<os-personal-note *ngIf="!editMotion && !operator.isAnonymous" [motion]="motion"></os-personal-note>
|
<os-personal-note *ngIf="!editMotion && !operator.isAnonymous" [motion]="motion"></os-personal-note>
|
||||||
|
@ -156,6 +156,12 @@ span {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mobile-view {
|
||||||
|
.os-card {
|
||||||
|
padding: 27px;
|
||||||
|
max-width: calc(100% - 54px);
|
||||||
|
}
|
||||||
|
}
|
||||||
.title-line {
|
.title-line {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
@ -90,7 +90,7 @@
|
|||||||
<!-- recommendation line -->
|
<!-- recommendation line -->
|
||||||
<div
|
<div
|
||||||
*ngIf="motion.recommendation && motion.state.next_states_id.length > 0"
|
*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">
|
<mat-basic-chip class="bluegrey" [disabled]="true">
|
||||||
{{ getRecommendationLabel(motion) }}
|
{{ getRecommendationLabel(motion) }}
|
||||||
|
@ -266,6 +266,7 @@ mat-card {
|
|||||||
margin-left: auto !important;
|
margin-left: auto !important;
|
||||||
margin-right: auto !important;
|
margin-right: auto !important;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
|
padding: 27px;
|
||||||
|
|
||||||
.mat-form-field {
|
.mat-form-field {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -274,6 +275,9 @@ mat-card {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.os-form-card-mobile {
|
.os-form-card-mobile {
|
||||||
|
margin-top: 20px !important;
|
||||||
|
margin-bottom: 20px !important;
|
||||||
|
|
||||||
.mat-form-field,
|
.mat-form-field,
|
||||||
.mat-select {
|
.mat-select {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -498,6 +502,9 @@ button.mat-menu-item.selected {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/** helper classes for margin/padding */
|
/** helper classes for margin/padding */
|
||||||
|
.spacer-top-3 {
|
||||||
|
margin-top: 3px !important;
|
||||||
|
}
|
||||||
.spacer-top-10 {
|
.spacer-top-10 {
|
||||||
margin-top: 10px !important;
|
margin-top: 10px !important;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user