쪽지- 디자인 수정
This commit is contained in:
parent
26b5259b3c
commit
8629d1f321
|
@ -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"
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -439,4 +439,7 @@ $daesang-grey: (
|
|||
}
|
||||
}
|
||||
}
|
||||
.mat-calendar-body-selected{
|
||||
background-color: mat-color($accent);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
font-size: 1rem;
|
||||
color: inherit;
|
||||
outline: none;
|
||||
text-align: end;
|
||||
text-align: start;
|
||||
|
||||
&:disabled {
|
||||
background-color: transparent;
|
||||
|
|
Loading…
Reference in New Issue
Block a user