ng-deep 정리중(3차)

This commit is contained in:
khk 2020-02-12 14:13:23 +09:00
parent 729379d0f8
commit b60c6086d2
16 changed files with 68 additions and 301 deletions

View File

@ -76,13 +76,6 @@
}
}
/*::ng-deep .ps {
.ps-content {
position: relative;
width: 100%;
height: 100%;
}
}*/
// perfect-scrollbar right로 2px이동
::ng-deep .ps__rail-y {
& > .ps__thumb-y {

View File

@ -32,10 +32,3 @@
width: 100%;
height: 100%;
}
/*::ng-deep .cdk-virtual-scroll-orientation-vertical {
.cdk-virtual-scroll-content-wrapper {
width: 100%;
height: 100%;
contain: unset;
}
}*/

View File

@ -32,10 +32,7 @@
}
}
}
/*::ng-deep .mat-tab-body-content {
height: 100%;
overflow: unset;
}*/
.mat-menu-item {
display: flex;
align-items: center;

View File

@ -27,60 +27,3 @@ $tablet-s-width: 768px;
}
}
}
::ng-deep .footer-fix {
position: absolute;
bottom: 0;
min-height: 40px;
width: 100%;
flex-direction: column;
box-sizing: border-box;
display: flex;
border-top: 1px solid #dddddd;
.btn-box {
height: 50px;
padding-bottom: 10px;
width: 100%;
background-color: #ffffff;
button {
margin: 5px;
font-size: 0.9em;
padding: 0 12px;
}
}
.mat-paginator-page-size {
@media screen and (max-width: #{$tablet-s-width}), (max-height: 800px) {
display: none;
}
}
}
/*right-drawer tab 레이아웃
::ng-deep .rightDrawer-tab {
.mat-tab-labels {
display: flex;
width: 100%;
border-bottom: 2px solid #dddddd;
flex: 1 1 auto;
justify-content: space-around;
width: 100%;
padding: 0;
min-width: 0 !important;
.mat-tab-label {
width: 50%;
}
}
.mat-tab-header-pagination.mat-tab-header-pagination-disabled {
display: none !important;
}
.message-tab {
position: relative;
height: 100%;
& > .mat-tab-header {
width: 100%;
.mat-tab-label {
min-width: 33%;
}
}
}*/

View File

@ -148,6 +148,32 @@ $tablet-s-width: 768px;
font-size: 1em;
}
}
.footer-fix {
position: absolute;
bottom: 0;
min-height: 40px;
width: 100%;
flex-direction: column;
box-sizing: border-box;
display: flex;
border-top: 1px solid #dddddd;
.btn-box {
height: 50px;
padding-bottom: 10px;
width: 100%;
background-color: #ffffff;
button {
margin: 5px;
font-size: 0.9em;
padding: 0 12px;
}
}
.mat-paginator-page-size {
@media screen and (max-width: #{$tablet-s-width}), (max-height: 800px) {
display: none;
}
}
}
.mat-paginator-container {
display: flex;

View File

@ -95,27 +95,6 @@
}
}
/*::ng-deep .mat-paginator {
.mat-paginator-container {
justify-content: center;
}
.mat-paginator-navigation-first {
order: 1;
}
.mat-paginator-navigation-previous {
order: 2;
}
// override material paginator page switch
.mat-paginator-range-label {
order: 3;
}
.mat-paginator-navigation-next {
order: 4;
}
.mat-paginator-navigation-last {
order: 5;
}
}*/
.mat-form-field-appearance-legacy {
.mat-form-field-infix {
padding: 6px;

View File

@ -1,131 +1,3 @@
/*.clipboard-frame {
padding: 16px;
height: 100%;
min-width: 500px;
position: relative;
.mat-dialog-container {
position: relative;
}
.mat-card-header {
position: relative;
width: 100%;
border-bottom: 1px solid #dddddd;
margin-bottom: 12px;
.btn-dialog-close {
font-size: 20px;
display: flex;
margin-left: auto;
align-self: flex-start;
color: #444444;
}
}
.mat-card-content {
flex: 0 0 auto;
display: flex;
align-items: flex-start;
height: calc(100% - 100px);
border-bottom: 1px solid #dddddd;
.setting-tab {
position: relative;
width: 100%;
height: 100%;
.title-text {
padding-left: 5px;
}
.mat-tab-group {
flex-direction: row;
.mat-tab-header {
width: 160px;
.mat-tab-labels {
flex-direction: column;
.mat-tab-label {
padding: 0 10px;
align-content: flex-start;
text-align: left;
align-items: self-start;
justify-content: flex-start;
}
}
.mat-ink-bar {
display: none;
}
}
}
}
}
.button-farm {
text-align: right;
position: absolute;
width: 100%;
bottom: 10px;
.mat-primary {
margin-left: 4px;
}
}
}
::ng-deep .clipboard-tab {
.mat-tab-group {
position: relative;
height: 100%;
width: 100%;
.mat-tab-header {
width: 170px;
flex-flow: column;
border-right: 1px solid #dddddd;
.mat-tab-label-container {
.mat-tab-list {
.mat-tab-labels {
border-bottom: 0;
//padding-right: 10px;
.mat-tab-label {
padding: 0 10px;
}
}
}
}
}
.mat-tab-body-wrapper {
.mat-tab-body {
.mat-tab-body-conten {
position: relative;
width: 100%;
height: 100%;
.mat-list-base {
position: relative;
}
}
}
}
}
}
::ng-deep .setting-category {
.mat-list-base {
position: relative;
.mat-list-item {
font-size: 15px;
.mat-tab-header {
border-right: none;
}
}
.mat-divider {
//margin-top: 10px;
}
.mat-subheader {
font-weight: 600;
}
}
}
*/
.clipboard-frame {
padding: 16px;
height: 100%;

View File

@ -170,8 +170,3 @@
}
}
}
/*::ng-deep .ps-content {
.cdk-virtual-scroll-viewport {
height: 100%;
}
}*/

View File

@ -16,6 +16,7 @@
<mat-icon>add</mat-icon>
<span class="mat-fab__label">{{ 'group.addNew' | translate }}</span>
</button>
<div *ngIf="isShowAddGroupField" class="input-groupname-box">
<form name="inputForm" [formGroup]="inputForm" novalidate>
<mat-form-field

View File

@ -33,6 +33,7 @@
width: 40px;
height: 40px;
line-height: 40px;
margin-top: -8px;
}
.mat-fab__label {
color: #212121;
@ -71,7 +72,3 @@
}
}
}
::ng-deep .mat-mini-fab .mat-button-wrapper {
padding: 0;
}

View File

@ -68,6 +68,9 @@
text-align: left;
align-items: center;
justify-content: flex-start;
&.mat-tab-label-active {
opacity: 1;
}
}
}
.mat-ink-bar {
@ -80,57 +83,3 @@
border-left: 1px solid #dddddd;
}
}
/*::ng-deep .setting-tab {
.mat-tab-group {
.mat-tab-header {
width: 160px;
flex-flow: column;
flex: 0 0 auto;
border-right: 1px solid #dddddd;
.mat-tab-label-container {
.mat-tab-list {
.mat-tab-labels {
border-bottom: 0;
//padding-right: 10px;
.mat-tab-label {
padding: 0 10px;
}
}
}
}
}
.mat-tab-body-wrapper {
.mat-tab-body {
.mat-tab-body-conten {
position: relative;
width: 100%;
height: 100%;
.mat-list-base {
position: relative;
}
}
}
}
}
}
::ng-deep .setting-category {
.mat-list-base {
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

@ -49,14 +49,24 @@
</span>
</dt>
<dd>
<mat-icon
<span
*ngIf="!!message.resType && message.resType === ContentType.Image"
class="icon-img"
><i class="mid mid-18 mdi-image-outline"></i
></span>
<span
*ngIf="!!message.resType && message.resType === ContentType.AttachFile"
class="icon-img"
><i class="mid mid-18 mdi-floppy"></i
></span>
<!--<mat-icon
*ngIf="!!message.resType && message.resType === ContentType.Image"
>image</mat-icon
>
<mat-icon
*ngIf="!!message.resType && message.resType === ContentType.AttachFile"
>attach_file</mat-icon
>
>-->
<span class="final-message">{{ message.title }}</span>
</dd>
</dl>

View File

@ -91,7 +91,7 @@
}
}
::ng-deep .ucap-message-write {
.ucap-message-write {
padding: 0;
.add-row {
display: flex;
@ -100,19 +100,18 @@
margin-bottom: 10px;
border-bottom: 1px solid #dddddd;
.mat-mini-fab {
.mat-button-wrapper {
padding: 0;
.mat-icon {
width: 40px;
height: 40px;
line-height: 40px;
margin-top: -8px;
}
.mat-fab__label {
color: #212121;
margin-left: 10px;
}
}
}
.receiver-sum {
margin-left: auto;
}

View File

@ -77,6 +77,9 @@
.mat-tab-label {
width: 140px;
height: 120px;
&.mat-tab-label-active {
opacity: 1;
}
.mat-tab-label-content {
position: relative;
flex-flow: column;

View File

@ -54,6 +54,12 @@ mat-icon {
height: 24px;
line-height: 24px;
}
&-30 {
font-size: 30px;
width: 30px;
height: 30px;
line-height: 30px;
}
}
&:before {
display: inline-block;
@ -69,3 +75,6 @@ mat-icon {
opacity: 0.7;
}
}
.circle-button {
border-radius: 50%;
}

View File

@ -21,6 +21,7 @@ $tablet-s-width: 768px;
}
}
}
.sticker-item-box {
flex-wrap: wrap;
padding: 10px 20px 0;