화상 회의, 다이얼로그 min-width변경

This commit is contained in:
khk 2020-02-24 18:22:22 +09:00
parent 657fecd104
commit 874052c017
3 changed files with 48 additions and 9 deletions

View File

@ -30,21 +30,25 @@
{{ conferenceDetail.title }} {{ conferenceDetail.title }}
</div> </div>
<div class="normal"> <div class="normal">
<span class="normal label bg-accent-color">{{ 'conference.videoConferenceRegister' | translate}}</span> <span class="normal label bg-accent-color">{{
'conference.videoConferenceRegister' | translate
}}</span>
<span class="name">{{ conferenceDetail.register }}</span> <span class="name">{{ conferenceDetail.register }}</span>
</div> </div>
<div class="underline"> <div class="underline">
<mat-accordion> <mat-accordion class="attendee-list">
<mat-expansion-panel> <mat-expansion-panel>
<mat-expansion-panel-header> <mat-expansion-panel-header>
<mat-panel-title> <mat-panel-title>
<span class="label bg-accent-color bg-warn-color">{{ 'conference.videoConferenceAttendee' | translate}}</span> <span class="label bg-accent-color bg-warn-color">{{
'conference.videoConferenceAttendee' | translate
}}</span>
</mat-panel-title> </mat-panel-title>
<mat-panel-description> <mat-panel-description class="text-accent-color">
{{ conferenceDetail.attendee }} {{ conferenceDetail.attendee }}
</mat-panel-description> </mat-panel-description>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-chip-list> <mat-chip-list class="attendee-list-name">
<mat-chip *ngFor="let attendee of conferenceDetail.attendees">{{ <mat-chip *ngFor="let attendee of conferenceDetail.attendees">{{
attendee attendee
}}</mat-chip> }}</mat-chip>
@ -53,7 +57,9 @@
</mat-accordion> </mat-accordion>
</div> </div>
<div class="normal"> <div class="normal">
<span class="label bg-accent-color">{{ 'conference.videoConferenceDate' | translate}}</span> <span class="label bg-accent-color">{{
'conference.videoConferenceDate' | translate
}}</span>
<span <span
>{{ >{{
conferenceDetail.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm' conferenceDetail.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm'
@ -65,13 +71,15 @@
> >
</div> </div>
<div class="underline"> <div class="underline">
<span class="label bg-accent-color">{{ 'conference.videoConferenceRoom' | translate}}</span> <span class="label bg-accent-color">{{
'conference.videoConferenceRoom' | translate
}}</span>
<span>{{ getJoinArray(conferenceDetail.conferenceRooms) }}</span> <span>{{ getJoinArray(conferenceDetail.conferenceRooms) }}</span>
</div> </div>
</div> </div>
</mat-card-content> </mat-card-content>
<mat-card-actions class="button-farm flex-row"> <mat-card-actions class="button-farm flex-row">
<button mat-stroked-button (click)="onClickConfirm()" class="mat-primary"> <button mat-flat-button (click)="onClickConfirm()" class="mat-primary">
{{ 'common.messages.confirm' | translate }} {{ 'common.messages.confirm' | translate }}
</button> </button>
</mat-card-actions> </mat-card-actions>

View File

@ -123,3 +123,35 @@
} }
} }
} }
.attendee-list {
.mat-expansion {
&-panel {
box-shadow: none;
&-header {
padding: 0;
height: 24px !important;
&-title {
display: inline-flex;
flex: 0 0 auto;
border-radius: 14px;
margin-right: 0;
color: #ffffff;
line-height: 20px;
justify-content: center;
}
&-description {
//color: rgb(0, 0, 0, 0.8);
}
}
}
&-indicator {
width: 20px;
}
}
}
::ng-deep .attendee-list {
.mat-expansion-panel-body {
margin-top: 10px;
}
}

View File

@ -40,7 +40,6 @@
} }
.mat-card { .mat-card {
min-width: 500px;
padding: 10px; padding: 10px;
.mat-card-header { .mat-card-header {
margin-bottom: 20px; margin-bottom: 20px;