Merge branch 'master' of http://10.81.13.221:6990/Web/next-ucap-messenger
# Conflicts: # projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss
This commit is contained in:
commit
f90bb4c674
Binary file not shown.
Before Width: | Height: | Size: 105 KiB |
|
@ -103,10 +103,13 @@ body.theme-pink-dark {
|
|||
// -----------------------------------------------------------------------------------------------------
|
||||
|
||||
// Define the primary, accent and warn palettes
|
||||
$pink-light-theme-primary-palette: mat-palette($mat-grey,800);
|
||||
//$pink-light-theme-accent-palette: mat-palette($lg-red, 400);
|
||||
/*$pink-light-theme-primary-palette: mat-palette($mat-grey,800);
|
||||
$pink-light-theme-accent-palette: mat-palette($lg-red, 400);
|
||||
$pink-light-theme-warn-palette: mat-palette($mat-red);*/
|
||||
|
||||
$pink-light-theme-primary-palette: mat-palette($daesang-grey, 900);
|
||||
$pink-light-theme-accent-palette: mat-palette($daesang);
|
||||
$pink-light-theme-warn-palette: mat-palette($mat-red);
|
||||
$pink-light-theme-warn-palette: mat-palette($mat-deep-orange);
|
||||
|
||||
|
||||
// Create the Material theme object
|
||||
|
|
|
@ -38,9 +38,7 @@
|
|||
height: 100%;
|
||||
}
|
||||
::ng-deep .global-menu {
|
||||
border-right: 2px solid #4f4f4f;
|
||||
.mat-tab-label-container {
|
||||
background-color: #4f4f4f;
|
||||
.mat-tab-list {
|
||||
.mat-tab-labels {
|
||||
flex-flow: column;
|
||||
|
|
|
@ -1,11 +1,4 @@
|
|||
.current-head {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0 10px;
|
||||
height: 70px;
|
||||
background: #352a37;
|
||||
background: -webkit-linear-gradient(to right, #352a37, #f15f79);
|
||||
background: linear-gradient(to right, #352a37, #ef4c73);
|
||||
h3 {
|
||||
display: inline-flex;
|
||||
padding-left: 10px;
|
||||
|
@ -76,9 +69,17 @@
|
|||
|
||||
.app-layout-chat-left-sidenav-chat-list {
|
||||
height: calc(100% - 130px);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.app-layout-chat-left-sidenav-chat-list-viewport {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
::ng-deep .cdk-virtual-scroll-orientation-vertical {
|
||||
.cdk-virtual-scroll-content-wrapper{
|
||||
width: 100%;
|
||||
height:100%;
|
||||
contain: unset;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,13 +1,5 @@
|
|||
@charset 'utf-8';
|
||||
.current-head {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0 10px;
|
||||
height: 70px;
|
||||
background-color: #eeeeee;
|
||||
background: #f15f79;
|
||||
background: -webkit-linear-gradient(to right, #352a37, #f15f79);
|
||||
background: linear-gradient(to right, #352a37, #ef4c73);
|
||||
color: #ffffff;
|
||||
h3 {
|
||||
display: inline-flex;
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
}
|
||||
|
||||
.current-head {
|
||||
display: flex;
|
||||
/*display: flex;
|
||||
justify-content: center;
|
||||
padding: 0 10px;
|
||||
height: 70px;
|
||||
|
@ -24,7 +24,7 @@
|
|||
background: #f15f79;
|
||||
background: -webkit-linear-gradient(to right, #352a37, #f15f79);
|
||||
background: linear-gradient(to right, #352a37, #ef4c73);
|
||||
color: #ffffff;
|
||||
color: #ffffff;*/
|
||||
h3 {
|
||||
display: inline-flex;
|
||||
padding-left: 10px;
|
||||
|
@ -83,6 +83,7 @@
|
|||
display: flex;
|
||||
background-color: #f9f9f9;
|
||||
dt {
|
||||
font-weight:600;
|
||||
}
|
||||
dd {
|
||||
margin-left: auto;
|
||||
|
|
|
@ -164,10 +164,9 @@
|
|||
<div class="sticker-selector-container">
|
||||
<ucap-sticker-selector
|
||||
*ngIf="isShowStickerSelector"
|
||||
class="sticer-selector-zone"
|
||||
class="sticker-selector-zone"
|
||||
></ucap-sticker-selector>
|
||||
<div>
|
||||
</div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- / CHAT CONTENT -->
|
||||
|
|
|
@ -45,7 +45,6 @@
|
|||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
background-color: #604850;
|
||||
color: #efefef;
|
||||
font-size: 16px;
|
||||
line-height: 40px;
|
||||
|
@ -98,6 +97,7 @@
|
|||
padding: 10px 10px 0 10px;
|
||||
background-color: rgb(54, 54, 54, 0.8);
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -109,11 +109,12 @@
|
|||
height: 100%;
|
||||
background-color: transparent;
|
||||
|
||||
.sticer-selector-zone {
|
||||
.sticker-selector-zone {
|
||||
position: absolute;
|
||||
padding: 10px 10px 0 10px;
|
||||
background-color: rgb(54, 54, 54, 0.8);
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,8 +6,33 @@
|
|||
</mat-tab-group>
|
||||
</div>
|
||||
<div fxFlex="1 1 240px" class="select-filebox bg-accent-brightest">
|
||||
<ng-container *ngIf="!selectedFile">
|
||||
Select File.
|
||||
<!--<ng-container *ngIf="!selectedFile">-->
|
||||
<ng-container *ngIf="!selectedFile">
|
||||
<!--이미지 빈화면-->
|
||||
<div class="empty-msg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" />
|
||||
<circle cx="8.5" cy="8.5" r="1.5" />
|
||||
<path d="M20.4 14.5L16 10 4 20" />
|
||||
</svg>
|
||||
<span>Select File.</span>
|
||||
</div>
|
||||
<!--비디오 빈화면-->
|
||||
<div class="empty-msg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<rect x="2" y="2" width="20" height="20" rx="2.18" ry="2.18"></rect>
|
||||
<line x1="7" y1="2" x2="7" y2="22"></line>
|
||||
<line x1="17" y1="2" x2="17" y2="22"></line>
|
||||
<line x1="2" y1="12" x2="22" y2="12"></line>
|
||||
<line x1="2" y1="7" x2="7" y2="7"></line>
|
||||
<line x1="2" y1="17" x2="7" y2="17"></line>
|
||||
<line x1="17" y1="17" x2="22" y2="17"></line>
|
||||
<line x1="17" y1="7" x2="22" y2="7"></line>
|
||||
</svg>
|
||||
<span>Select File.</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="selectedFile">
|
||||
<div class="select-file">
|
||||
|
@ -25,10 +50,10 @@
|
|||
</video>
|
||||
</div>
|
||||
<ul>
|
||||
<li>name : {{ selectedFile.info.name }}</li>
|
||||
<li>size : {{ selectedFile.info.size | ucapBytes }}</li>
|
||||
<li class="name"> {{ selectedFile.info.name }}</li>
|
||||
<li><span class="text-accent-color">size :</span> {{ selectedFile.info.size | ucapBytes }}</li>
|
||||
<li>
|
||||
date :
|
||||
<span class="text-accent-color">date :</span>
|
||||
{{ selectedFile.info.sendDate | dateToStringFormat: 'YYYY.MM.DD' }}
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
@ -1,3 +1,18 @@
|
|||
@mixin ellipsis($row) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@if $row == 1 {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
} @else if $row >= 2 {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: $row;
|
||||
-webkit-box-orient: vertical;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
.album-box {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
|
@ -17,22 +32,32 @@
|
|||
margin:10px;
|
||||
padding:10px;
|
||||
border:1px solid #cccccc;
|
||||
.select-flie{
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
align-items: center;
|
||||
.select-file{
|
||||
color: #212121;
|
||||
align-items: center;
|
||||
border-bottom: 1px dotted #dddddd;
|
||||
text-align:center;
|
||||
ul{
|
||||
padding:0;
|
||||
margin-top:10px;
|
||||
.name{
|
||||
padding-bottom:10px;
|
||||
}
|
||||
ul{
|
||||
padding-top:10px;
|
||||
li{
|
||||
@include ellipsis(1);
|
||||
&.name{
|
||||
font-weight:600;
|
||||
}
|
||||
}
|
||||
}
|
||||
.empty-msg{
|
||||
display:inline-flex;
|
||||
flex-flow: column;
|
||||
margin:auto 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color:#999999;
|
||||
span{
|
||||
padding:6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-list{
|
||||
|
@ -41,11 +66,12 @@
|
|||
height: calc(100% - 450px);
|
||||
overflow-y: auto;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
.img-item {
|
||||
cursor: pointer;
|
||||
margin-bottom:10px;
|
||||
margin-right:9px;
|
||||
position: relative;
|
||||
height: 150px;
|
||||
dl{
|
||||
dt{
|
||||
display: flex;
|
||||
|
@ -55,6 +81,7 @@
|
|||
height: 120px;
|
||||
background-color: #efefef;
|
||||
border: 1px dotted #cccccc;
|
||||
box-sizing: border-box;
|
||||
img{
|
||||
width:100%;
|
||||
height:100%;
|
||||
|
@ -66,14 +93,15 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
& :nth-child(3n+0){
|
||||
&:nth-child(3n+0){
|
||||
margin-right:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.preview-image {
|
||||
max-height: 300px;
|
||||
.preview-image,
|
||||
.preview-video{
|
||||
max-height: 140px;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
|
|
|
@ -7,7 +7,13 @@
|
|||
</div>
|
||||
<div fxFlex="1 1 200px" class="select-filebox bg-accent-brightest">
|
||||
<ng-container *ngIf="!selectedFile" >
|
||||
Select File.
|
||||
<div class="empty-msg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<path d="M13 2H6a2 2 0 0 0-2 2v16c0 1.1.9 2 2 2h12a2 2 0 0 0 2-2V9l-7-7z" />
|
||||
<path d="M13 3v6h6" /></svg>
|
||||
<span>Select File.</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="selectedFile">
|
||||
<div class="select-flie">
|
||||
|
@ -21,7 +27,7 @@
|
|||
<div class="ico"></div>
|
||||
</div>
|
||||
<ul>
|
||||
<li class="name">name : {{ selectedFile.info.name }}</li>
|
||||
<li class="name"> {{ selectedFile.info.name }}</li>
|
||||
<li>size : {{ selectedFile.info.size | ucapBytes }}</li>
|
||||
<li>
|
||||
date :
|
||||
|
@ -29,8 +35,35 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
아이콘
|
||||
<div class="select-file-option">
|
||||
<!--툴팁 부탁해요 -->
|
||||
<span matTooltip="다운로드" class="text-accent-darkest">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5" /></svg>
|
||||
</span>
|
||||
<span matTooltip="나에게전달" class="text-accent-darkest">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<path d="M5.52 19c.64-2.2 1.84-3 3.22-3h6.52c1.38 0 2.58.8 3.22 3" />
|
||||
<circle cx="12" cy="10" r="3" />
|
||||
<circle cx="12" cy="12" r="10" /></svg>
|
||||
</span>
|
||||
<span matTooltip="파일전달" class="text-accent-darkest">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<path d="M18 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8c0-1.1.9-2 2-2h5M15 3h6v6M10 14L20.2 3.8" />
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
<span matTooltip="파일삭제" class="text-accent-darkest">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
||||
<path d="M20 11.08V8l-6-6H6a2 2 0 0 0-2 2v16c0 1.1.9 2 2 2h6" />
|
||||
<path d="M14 3v5h5M15.88 20.12l4.24-4.24M15.88 15.88l4.24 4.24" /></svg>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
|
|
@ -28,10 +28,10 @@
|
|||
}
|
||||
|
||||
.select-filebox {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
border: 1px solid #cccccc;
|
||||
.select-flie {
|
||||
display: flex;
|
||||
|
@ -39,6 +39,7 @@
|
|||
align-items: center;
|
||||
color: #212121;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
border-bottom: 1px dotted #dddddd;
|
||||
ul {
|
||||
padding: 0;
|
||||
|
@ -47,6 +48,43 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.empty-msg {
|
||||
display: inline-flex;
|
||||
flex-flow: column;
|
||||
margin: auto 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #999999;
|
||||
span {
|
||||
padding: 6px;
|
||||
}
|
||||
}
|
||||
.select-file-option {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
bottom: 4px;
|
||||
span {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: inline-flex;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 20px;
|
||||
cursor: pointer;
|
||||
svg {
|
||||
}
|
||||
&:hover {
|
||||
border-radius: 50%;
|
||||
background-color: #999999;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mat-table {
|
||||
|
@ -75,7 +113,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.table-box{
|
||||
.table-box {
|
||||
height: calc(100% - 450px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
@ -89,13 +127,14 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer-fix{
|
||||
.footer-fix {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height:160px;
|
||||
height: 160px;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
border-top: 1px solid #dddddd;
|
||||
.btn-box {
|
||||
height: 50px;
|
||||
padding-bottom: 10px;
|
||||
|
@ -128,3 +167,8 @@
|
|||
order: 5;
|
||||
}
|
||||
}
|
||||
::ng-deep .mat-form-field-appearance-legacy {
|
||||
.mat-form-field-infix {
|
||||
padding: 6px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -207,4 +207,4 @@ export class FileBoxComponent implements OnInit, OnDestroy {
|
|||
onClickRow(row: FileInfoTotal) {
|
||||
this.selectedFile = row;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,3 +1,4 @@
|
|||
@import "../../../../../../../ucap-webmessenger-ui/src/assets/scss/partials/presence";
|
||||
.list {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
|
@ -94,7 +94,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.mat-tab-group > .mat-tab-header .mat-tab-label {
|
||||
::ng-deep .mat-card > .mat-tab-labels {
|
||||
border-bottom: 2px solid #dddddd;
|
||||
}
|
||||
::ng-deep .ps-content {
|
||||
|
|
|
@ -9,7 +9,6 @@
|
|||
display: flex;
|
||||
padding: 0 10px;
|
||||
cursor: pointer;
|
||||
background: #4f4f4f;
|
||||
height: 30px;
|
||||
color:#ffffff;
|
||||
//background: rgba(37, 27, 30, 0.9);
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div class="container">
|
||||
<div class="main-container">
|
||||
<as-split
|
||||
unit="pixel"
|
||||
gutterSize="5"
|
||||
|
|
|
@ -1,11 +1,9 @@
|
|||
.container {
|
||||
.main-container {
|
||||
height:100%;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
padding-top: 30px;
|
||||
border: 3px solid #4f4f4f;
|
||||
padding-top: 27px;
|
||||
border-top: none;
|
||||
|
||||
.split-area{
|
||||
overflow: hidden;
|
||||
.left-side {
|
||||
|
@ -25,10 +23,13 @@
|
|||
height: 100%;
|
||||
}
|
||||
.rightDrawer{
|
||||
width:420px;
|
||||
width:400px;
|
||||
height: 100%;
|
||||
flex: 0 0 auto;
|
||||
overflow: hidden;
|
||||
-webkit-box-shadow: -1px 0px 3px 0px rgba(0,0,0,0.3);
|
||||
-moz-box-shadow: -1px 0px 3px 0px rgba(0,0,0,0.3);
|
||||
box-shadow: -1px 0px 3px 0px rgba(0,0,0,0.3);
|
||||
}
|
||||
}
|
||||
.right-side {
|
||||
|
|
|
@ -60,6 +60,7 @@ $lg-red: (
|
|||
A200: #ff4081,
|
||||
A400: #ff3399,
|
||||
A700: #c51162,
|
||||
B100:#4f4f4f,
|
||||
G100: #ef4c73,
|
||||
G900: #352a37,
|
||||
contrast: (
|
||||
|
@ -77,28 +78,30 @@ $lg-red: (
|
|||
A200: $light-primary-text,
|
||||
A400: $light-primary-text,
|
||||
A700: $light-primary-text,
|
||||
B100: $light-primary-text,
|
||||
G100:$dark-primary-text,
|
||||
G900:$light-primary-text
|
||||
)
|
||||
);
|
||||
|
||||
$daesang: (
|
||||
50: #e0f7fa,
|
||||
50: #f9feff,//#e0f7fa,
|
||||
100: #b2ebf2,
|
||||
200: #80deea,
|
||||
200: #4dd0e1,//#80deea,
|
||||
300: #4dd0e1,
|
||||
400: #26c6da,
|
||||
500: #00bcd4,
|
||||
/*600: #00acc1,*/ 600: #00b6d5,
|
||||
700: #0097a7,
|
||||
800: #2c8493,
|
||||
900: #126a79,
|
||||
800: #0367A6,
|
||||
900: #024873,
|
||||
A100: #84ffff,
|
||||
A200: #18ffff,
|
||||
A400: #00e5ff,
|
||||
A700: #00b8d4,
|
||||
G100: #6dd5ed,
|
||||
/*G900: #192a2c,*/G900: #2193b0,
|
||||
B100:#2d3a4a,//,#47667fbackgroundcolor
|
||||
G100: #0367A6,
|
||||
/*G900: #192a2c,*/G900: #6dd5ed,
|
||||
contrast: (
|
||||
50: $dark-primary-text,
|
||||
100: $dark-primary-text,
|
||||
|
@ -114,10 +117,44 @@ $daesang: (
|
|||
A200: $dark-primary-text,
|
||||
A400: $dark-primary-text,
|
||||
A700: $dark-primary-text,
|
||||
B100: $light-primary-text,
|
||||
G100: $dark-primary-text,
|
||||
G900: $light-primary-text
|
||||
)
|
||||
);
|
||||
$daesang-grey: (
|
||||
50: #fafafa,
|
||||
100: #f5f5f5,
|
||||
200: #eeeeee,
|
||||
300: #e0e0e0,
|
||||
400: #bdbdbd,
|
||||
500: #9e9e9e,
|
||||
600: #757575,
|
||||
700: #616161,
|
||||
800: #424242,
|
||||
900: #2d3a4a,
|
||||
A100: #ffffff,
|
||||
A200: #eeeeee,
|
||||
A400: #bdbdbd,
|
||||
A700: #616161,
|
||||
contrast: (
|
||||
50: $dark-primary-text,
|
||||
100: $dark-primary-text,
|
||||
200: $dark-primary-text,
|
||||
300: $dark-primary-text,
|
||||
400: $dark-primary-text,
|
||||
500: $dark-primary-text,
|
||||
600: $light-primary-text,
|
||||
700: $light-primary-text,
|
||||
800: $light-primary-text,
|
||||
900: $light-primary-text,
|
||||
A100: $dark-primary-text,
|
||||
A200: $dark-primary-text,
|
||||
A400: $dark-primary-text,
|
||||
A700: $light-primary-text,
|
||||
)
|
||||
);
|
||||
|
||||
|
||||
@mixin ucap-material-theme($theme) {
|
||||
@include ucap-core-theme($theme);
|
||||
|
@ -133,6 +170,7 @@ $daesang: (
|
|||
$gradient-darkest:mat-color($accent, G900);
|
||||
$gradient-light:mat-color($accent, G100);
|
||||
|
||||
//basic
|
||||
.bg-primary-dark{
|
||||
background: mat-color($primary, 900);
|
||||
color: mat-color($primary, default-contrast);
|
||||
|
@ -168,6 +206,9 @@ $daesang: (
|
|||
.text-primary-color {
|
||||
color: mat-color($primary);
|
||||
}
|
||||
.text-accent-darkest {
|
||||
color: mat-color($accent, 900);
|
||||
}
|
||||
.text-accent-color {
|
||||
color: mat-color($accent);
|
||||
}
|
||||
|
@ -180,6 +221,18 @@ $daesang: (
|
|||
.border-accent-color {
|
||||
border: 1px solid mat-color($accent);
|
||||
}
|
||||
|
||||
// sass 정의
|
||||
.mat-toolbar{
|
||||
background-color: mat-color($accent , B100);
|
||||
}
|
||||
.main-container {
|
||||
border:3px solid mat-color($accent, B100);
|
||||
}
|
||||
.global-menu{
|
||||
background-color: mat-color($accent , B100);
|
||||
}
|
||||
|
||||
.mat-tab-group.mat-primary .mat-ink-bar,
|
||||
body.theme-default .mat-tab-nav-bar.mat-primary .mat-ink-bar {
|
||||
background-color: mat-color($accent, 400);
|
||||
|
@ -187,9 +240,7 @@ $daesang: (
|
|||
.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary {
|
||||
background-color: mat-color($accent, 200);
|
||||
}
|
||||
/*.mat-form-field-appearance-legacy .mat-hint{
|
||||
color: mat-color($accent, 800);
|
||||
}*/
|
||||
|
||||
.global-menu {
|
||||
.mat-tab-label[aria-selected='true']{
|
||||
.mat-tab-label-content{
|
||||
|
@ -236,4 +287,12 @@ $daesang: (
|
|||
background: linear-gradient(to right, $gradient-darkest, $gradient-light);
|
||||
color:#ffffff;
|
||||
}
|
||||
.messages .container{
|
||||
background: mat-color($accent, 50);
|
||||
}
|
||||
.profile-img{
|
||||
.responsive-chats-button:last-child {
|
||||
background-color: $gradient-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
.file-thumbimg{
|
||||
display:inline-flex;
|
||||
img {
|
||||
width:200px;
|
||||
height:140px;
|
||||
padding-right: 20px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
|
|
@ -144,7 +144,7 @@ $meBox-bg: #ffffff;
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
background-color: #dddddd;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
@ -160,7 +160,6 @@ $meBox-bg: #ffffff;
|
|||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-right: 40px;
|
||||
margin-left: 0;
|
||||
.profile-img {
|
||||
flex: 0 0 auto;
|
||||
|
@ -172,7 +171,7 @@ $meBox-bg: #ffffff;
|
|||
&.me {
|
||||
.chat-row {
|
||||
flex-direction: row-reverse;
|
||||
margin-left: 40px;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.profile-info {
|
||||
flex-direction: row-reverse;
|
||||
|
|
|
@ -139,7 +139,6 @@ $thumbnail-msize: 40px;
|
|||
margin-left: 6px;
|
||||
border-radius: 3px;
|
||||
padding: 1px 6px;
|
||||
background-color: #ef4c73;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -17,32 +17,25 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
.file-upload-item {
|
||||
background-color: #eeeeee;
|
||||
min-width: 200px;
|
||||
margin: 0 0.5%;
|
||||
margin: 0 1%;
|
||||
margin-bottom: 10px;
|
||||
width: 32%;
|
||||
width: 48%;
|
||||
border-radius: 3px;
|
||||
background-color:#f9f9f9;
|
||||
border:1px solid #dddddd;
|
||||
.file-upload-info {
|
||||
padding: 10px;
|
||||
background-color:#ffffff;
|
||||
border-bottom: 1px solid #dddddd;
|
||||
svg {
|
||||
margin-right: 6px;
|
||||
}
|
||||
.file-upload-name {
|
||||
height: 40px;
|
||||
height: 20px;
|
||||
@include ellipsis(2);
|
||||
}
|
||||
}
|
||||
.file-upload-progress {
|
||||
padding: 6px 10px;
|
||||
}
|
||||
&:nth-child(3n + 1) {
|
||||
margin-left: 1%;
|
||||
}
|
||||
&:nth-child(3n + 0) {
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user