쪽지- 디자인 수정

This commit is contained in:
khk 2020-02-03 18:35:56 +09:00
parent 26b5259b3c
commit 8629d1f321
10 changed files with 94 additions and 31 deletions

View File

@ -128,9 +128,9 @@
</div>
<div class="message-section" [style.display]="isSearch ? 'block' : 'none'">
<div class="search-sub">
<div class="search-sub input-lineless">
<form [formGroup]="fgSearchType" class="w-100-p">
<mat-form-field style="width: 100px;">
<mat-form-field>
<mat-select
value="A"
formControlName="searchMessageType"

View File

@ -30,10 +30,36 @@
position: relative;
height: 100%;
}
.search-sub {
padding: 0 20px;
font-size: 0.9em;
height: 50px;
align-items: center;
display: flex;
border-bottom: 1px solid #dddddd;
form {
.mat-form-field {
width: 30%;
flex: 0 0 auto;
margin-right: 10px;
font-size: 1em;
}
.mat-radio-group {
.mat-radio-button {
margin: 0 4px;
.mat-radio-label {
.mat-radio-label-content {
padding-left: 4px;
}
}
}
}
}
}
.no-search-result {
padding-top: 10px;
padding-left: 10px;
justify-content: center;
align-items: center;
display: flex;
}
}
}

View File

@ -22,7 +22,6 @@
color: #444444;
}
}
.mat-card-content {
flex: 0 0 auto;
display: flex;
@ -46,16 +45,10 @@
align-items: self-start;
justify-content: flex-start;
}
.mat-ink-bar {
display: none;
}
}
}
.mat-tab-body-wrapper {
border-left: 1px solid #dddddd;
position: relative;
height: 100%;
padding: 0 0 10px 10px;
.mat-ink-bar {
display: none;
}
}
}
}
@ -77,9 +70,11 @@
position: relative;
height: 100%;
width: 100%;
.mat-tab-header {
width: 160px;
flex-flow: column;
border-right: 1px solid #dddddd;
.mat-tab-label-container {
.mat-tab-list {
.mat-tab-labels {
@ -113,8 +108,15 @@
position: relative;
.mat-list-item {
font-size: 15px;
.mat-tab-header {
border-right: none;
}
}
.mat-divider {
//margin-top: 10px;
}
.mat-subheader {
font-weight: 600;
}
}
}

View File

@ -439,4 +439,7 @@ $daesang-grey: (
}
}
}
.mat-calendar-body-selected{
background-color: mat-color($accent);
}
}

View File

@ -14,9 +14,11 @@
(selected)="onSelectedDate($event)"
></ucap-pick-date>
</div>
<div fxFlex="30px" style="margin-top: 30px;">
<span flFlex="1 1 auto"></span>
<span style="width: 100px;">
<div class="pick-time">
<span class="icon-img"
><i class="mid mdi-clock-check-outline"></i
></span>
<span class="pick-time-select">
<ucap-pick-time
[hour]="selectedDate.hour()"
[hourStep]="hourStep"
@ -33,8 +35,8 @@
</div>
<div fxFlex="40%" style="margin-left: 30px;">
<div fxLayout="column">
<div fxFlex="40px" style="margin-top: 30px;">
<span flFlexFill style="font-size: 22px;">
<div fxFlex="40px" style="margin-top: 30px;" class="Reservation-dete">
<span flFlexFill style="font-size: 20px;" class="text-accent-dark">
{{ selectedDate.format('MMM DD YYYY, HH:mm') }}
</span>
</div>
@ -102,12 +104,11 @@
</mat-card-content>
<mat-card-actions>
<div class="actions-container">
<div class="actions-message">
<div class="actions-message text-warn-color">
<span *ngIf="dateIsToEarly">
{{ 'message.errors.minTimeReservation' | translate }}
</span>
</div>
<div class="actions-spacer"></div>
<div class="actions">
<button
mat-stroked-button
@ -117,7 +118,7 @@
{{ 'common.messages.cancel' | translate }}
</button>
<button
mat-stroked-button
mat-flat-button
[disabled]="dateIsToEarly"
(click)="onClickSend()"
class="mat-primary"

View File

@ -4,9 +4,10 @@
.actions-container {
display: flex;
position: fixed;
flex-flow: column;
.actions-message {
font-size: 0.9em;
}
.actions-spacer {
@ -14,5 +15,22 @@
}
.actions {
margin-left: auto;
button {
margin-left: 8px;
}
}
}
.pick-time {
display: flex;
flex-flow: row;
margin-top: 20px;
width: 100%;
&-select {
width: 100%;
}
.icon-img {
margin-right: 20px;
}
}

View File

@ -79,10 +79,10 @@
'settings.notification.receiveForMobileTypeAlways' | translate
}}</mat-checkbox
>
<br />({{
<span class="text-guide">({{
'settings.notification.descriptionReceiveForMobileTypeAlways'
| translate
}})
}})</span>
</span>
</mat-list-item>
@ -102,10 +102,10 @@
'settings.notification.receiveForMessageTypePopup' | translate
}}</mat-checkbox
>
<br />({{
<span class="text-guide">({{
'settings.notification.descriptionReceiveForMobileTypePopup'
| translate
}})
}})</span>
</span>
</mat-list-item>
</mat-list>

View File

@ -9,3 +9,13 @@
.item-input[fullWidth] {
width: 100%;
}
.text-guide {
display: block;
font-size: 0.9em;
color: rgb(0, 0, 0, 0.7);
}
.mat-radio-container {
margin-right: 20px;
}

View File

@ -7,9 +7,12 @@
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
.hour-input {
width: 40px;
width: 60px;
+ span {
padding: 0 10px;
}
}
.minute-input {
width: 40px;
width: 60px;
}
}

View File

@ -26,7 +26,7 @@
font-size: 1rem;
color: inherit;
outline: none;
text-align: end;
text-align: start;
&:disabled {
background-color: transparent;