ucap/next-ucap-messenger
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

Browse Source
This commit is contained in:
richard-loafle 2020-02-07 14:42:16 +09:00
commit c44e534bfc
8 changed files with 67 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html
View File

@ -154,7 +154,7 @@
>
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
</div>
<div *ngIf="isShowSearchArea" class="chat-search bg-accent-color">
<div *ngIf="isShowSearchArea" class="chat-search">
<ucap-chat-search
[totalCount]="searchTotalCount"
[curIndex]="searchCurrentIndex"

7
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html
View File

@ -77,7 +77,12 @@
fxFlexFill
class="guide-msg"
>
{{ 'common.file.errors.cantPlay' | translate }}
<div>
<span class="icon-img">
<i class="mid mdi-information-outline"></i>
</span>
{{ 'common.file.errors.cantPlay' | translate }}
</div>
</div>
</div>
<ul>

13
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss
View File

@ -41,6 +41,19 @@ $tablet-s-width: 768px;
border-bottom: 1px dotted #dddddd;
text-align: center;
padding-bottom: 10px;
.guide-msg {
div {
display: flex;
flex-flow: column;
height: 140px;
justify-content: center;
justify-items: center;
color: #999999;
.icon-img {
margin-bottom: 6px;
}
}
}
}
ul {
padding-top: 10px;

13
projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
View File

@ -420,12 +420,13 @@ $daesang-grey: (
}
}
}
.chat-search-frame {
/*.대화방 검색창 bg
chat-search-frame {
.chat-search {
//background-color: mat-color($accent, 600, 0.7);
background-color: mat-color($accent, 800, 0.8);
}
}
}*/
.translationForm {
background-color: mat-color($accent, 200, 0.4);
}
@ -454,4 +455,12 @@ $daesang-grey: (
background-color: mat-color($accent, 500);
}
}
.chatroom-search{
.search-form{
border: 2px solid mat-color($accent, B100);
}
.btns{
background-color: mat-color($accent, B100);
}
}
}

72
projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.html
View File

@ -1,61 +1,3 @@
<!--<div fxFlex fxLayout="row" class="chatroom-search">
<div
fxLayout="row"
fxLayoutAlign="start center"
class="input input-lineless search-form"
>
<form [formGroup]="fgSearch">
<span class="icon-img">
<i class="mid mdi-magnify"></i>
</span>
<mat-form-field floatLabel="never">
<input
matInput
#inputSearch
type="text"
placeholder="{{ 'chat.searchEventByText' | translate }}"
value=""
formControlName="searchInput"
(keydown.enter)="onKeyDownEnter($event, inputSearch.value)"
/>
<button
mat-button
matSuffix
mat-icon-button
aria-label="Clear"
*ngIf="inputSearch.value"
(click)="inputSearch.value = ''"
>
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<span class="text-amount">{{ curIndex }} / {{ totalCount }}</span>
</form>
</div>
<span class="stroke-bar"></span>
<div class="btns">
<button
*ngIf="false"
mat-stroked-button
(click)="onClickSearchAndPrev()"
class="btn-toggle"
>
<i class="mid mdi-arrow-up"></i>
</button>
<button class="icon-button btn-search" (click)="onClickPrevSearch()">
<i class="mid mdi-arrow-up mdi-chevron-up"></i>
</button>
<button class="icon-button btn-search" (click)="onClickNextSearch()">
<i class="mid mdi-arrow-down mdi-chevron-down"></i>
</button>
<button
class="icon-button btn-close-searchbox bg-accent-dark"
(click)="inputSearch.value = ''; onClickSearchCancel()"
>
<i class="mid mdi-window-close"></i>
</button>
</div>
</div>-->
<div fxFlex fxLayout="row" class="chatroom-search">
<div
fxLayout="row"
@ -66,7 +8,7 @@
<span class="icon-img">
<i class="mid mdi-magnify"></i>
</span>
<mat-form-field floatLabel="never">
<mat-form-field floatLabel="never" class="white">
<input
matInput
#inputSearch
@ -90,7 +32,7 @@
<span class="text-amount">{{ curIndex }} / {{ totalCount }}</span>
</form>
</div>
<span class="stroke-bar"></span>
<div class="btns">
<button
*ngIf="false"
@ -101,16 +43,18 @@
<i class="mid mdi-arrow-up"></i>
</button>
<button class="icon-button btn-search" (click)="onClickPrevSearch()">
<i class="mid mdi-chevron-up"></i>
<i class="mid mid-24 mdi-chevron-up"></i>
</button>
<span class="stroke-bar"></span>
<button class="icon-button btn-search" (click)="onClickNextSearch()">
<i class="mid mdi-chevron-down"></i>
<i class="mid mid-24 mdi-chevron-down"></i>
</button>
<span class="stroke-bar"></span>
<button
class="icon-button btn-close-searchbox bg-accent-dark"
class="icon-button btn-close-searchbox"
(click)="inputSearch.value = ''; onClickSearchCancel()"
>
<i class="mid mdi-window-close"></i>
<i class="mid mdi-window-close"></i>
</button>
</div>
</div>

26
projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.scss
View File

@ -1,21 +1,22 @@
$tablet-l-width: 1024px;
$tablet-s-width: 768px;
$search-item-color: #ffffff;
$search-item-color: #444444;
.chatroom-search {
display: flex;
flex: 0 0 auto;
flex: 1 1 auto;
justify-items: center;
width: 100%;
.search-form {
flex-flow: row;
padding: 0 0 0 20px;
padding: 0 0 0 10px;
margin-left: 10px;
width: calc(100% - 126px);
position: relative;
@media screen and (max-width: #{$tablet-s-width}),
(max-height: 600px) {
padding: 0 0 0 14px;
flex: 0 0 auto;
flex: 1 1 auto;
}
form {
display: inline-flex;
@ -34,6 +35,12 @@ $search-item-color: #ffffff;
.mat-hint {
color: rgba(0, 0, 0, 0.54);
}
&.white {
.mat-form-field-label,
.mat-hint {
color: rgba(0, 0, 0, 0.54);
}
}
}
}
}
@ -72,17 +79,17 @@ $search-item-color: #ffffff;
position: relative;
.btns {
display: flex;
flex: 0 0 0%;
flex: 1 1 auto;
margin-left: auto;
margin-top: 0;
height: 100%;
button {
margin-left: 4px;
&.btn-search.icon-button {
&.icon-button {
align-self: center;
width: 30px;
height: 30px;
color: $search-item-color;
color: #ffffff;
}
}
}
@ -94,14 +101,15 @@ $search-item-color: #ffffff;
display: flex;
justify-content: center;
justify-items: center;
margin-right: 4px;
}
}
.stroke-bar {
width: 2px;
width: 1px;
height: 20px;
background-color: rgba(255, 255, 255, 0.3);
display: inline-flex;
align-self: center;
margin: 0 6px;
margin: 0 4px;
}

4
projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss
View File

@ -43,7 +43,7 @@ $login-max-height: 800px;
position: relative;
justify-content: flex-start;
flex-flow: column;
width: 38%;
width: 40%;
height: 100%;
background: #64cddf;
color: #ffffff;
@ -163,7 +163,7 @@ $login-max-height: 800px;
}
.mat-card-content {
position: relative;
width: 62%;
width: 60%;
height: 100%;
padding-bottom: 10px;
margin-left: 30px;

12
projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss
View File

@ -21,7 +21,7 @@ textarea {
width: 100%;
.mat-form-field-appearance-legacy {
.mat-form-field-wrapper {
color: #ffffff;
//color: #ffffff;
width: 100%;
.mat-form-field-infix {
.mat-input-element {
@ -42,7 +42,8 @@ textarea {
}
}
.mat-form-field-label {
color: rgba(255, 255, 255, 0.7) !important;
color: currentColor;
opacity: 0.7;
font-size: 1em;
}
.mat-form-field-underline {
@ -73,6 +74,7 @@ textarea {
width: 90%;
align-items: center;
display: flex;
color: #ffffff;
.mat-form-field-wrapper {
padding: 0;
display: flex;
@ -89,7 +91,8 @@ textarea {
top: 0;
.mat-form-field-label {
top: 0;
color: rgba(255, 255, 255, 0.7) !important;
color: currentColor;
opacity: 0.7;
font-size: 0.9em;
}
}
@ -99,6 +102,9 @@ textarea {
}
}
//텍스트 선명도
&.white {
color: #333333;
}
}
}