You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dlab.apache.org by an...@apache.org on 2019/07/02 12:10:03 UTC
[incubator-dlab] 04/05: [DLAB-827]: unify scrollers
This is an automated email from the ASF dual-hosted git repository.
ankovalyshyn pushed a commit to branch feature/projects
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git
commit 3653ab318a35d4e1a9feba671373e277623ff72d
Author: Andriana Kovalyshyn <An...@epam.com>
AuthorDate: Tue Jul 2 15:09:16 2019 +0300
[DLAB-827]: unify scrollers
---
.../src/app/shared/navbar/navbar.component.html | 2 +-
.../src/main/resources/webapp/src/styles.scss | 47 +++++++++++++++++++---
2 files changed, 42 insertions(+), 7 deletions(-)
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.html b/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.html
index c5a424f..ceb18f0 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.html
@@ -101,7 +101,7 @@
</nav>
</mat-nav-list>
</mat-sidenav>
- <mat-sidenav-content [style.margin-left]="isExpanded ? '220px' : '60px'">
+ <mat-sidenav-content id="scrolling" [style.margin-left]="isExpanded ? '220px' : '60px'">
<router-outlet></router-outlet>
</mat-sidenav-content>
</mat-sidenav-container>
diff --git a/services/self-service/src/main/resources/webapp/src/styles.scss b/services/self-service/src/main/resources/webapp/src/styles.scss
index bffb5bd..ed72357 100644
--- a/services/self-service/src/main/resources/webapp/src/styles.scss
+++ b/services/self-service/src/main/resources/webapp/src/styles.scss
@@ -47,10 +47,12 @@
background-color: rgba(53, 175, 213, 0.11) !important;
color: #577289;
}
+
.mat-tab-header-pagination.mat-tab-header-pagination-after,
.mat-tab-header-pagination.mat-tab-header-pagination-before {
display: none !important;
}
+
.mat-drawer-container {
height: calc(100% - 48px);
}
@@ -61,6 +63,7 @@ mat-chip.mat-chip {
font-size: 14px;
padding: 8px 18px;
}
+
mat-chip.mat-chip a {
display: inline-block;
width: 12px;
@@ -89,10 +92,12 @@ mat-chip.mat-chip strong {
margin-right: 15px;
float: right;
}
+
.rotate {
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}
+
.status {
text-transform: capitalize;
}
@@ -127,6 +132,7 @@ mat-chip.mat-chip strong {
color: #f1696e;
font-size: 12px;
}
+
.not-allowed {
cursor: not-allowed !important;
user-select: none;
@@ -143,6 +149,7 @@ mat-chip.mat-chip strong {
padding: 40px 20px;
text-align: center;
}
+
.info {
font-size: 15px;
font-weight: 300;
@@ -167,6 +174,7 @@ mat-chip.mat-chip strong {
0% {
-webkit-transform: rotate(0deg);
}
+
100% {
-webkit-transform: rotate(360deg);
}
@@ -176,6 +184,7 @@ mat-chip.mat-chip strong {
0% {
transform: rotate(0deg);
}
+
100% {
transform: rotate(360deg);
}
@@ -235,10 +244,12 @@ mat-chip.mat-chip strong {
}
/* IE can just show/hide with no transition */
-@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
+@media all and (-ms-high-contrast: none),
+(-ms-high-contrast: active) {
.tooltip-wrap .tooltip {
display: none;
}
+
.tooltip-wrap:hover .tooltip {
display: block;
}
@@ -259,32 +270,43 @@ input[type='number'] {
.text-center {
text-align: center !important;
}
+
.text-right {
text-align: right;
}
+
.m-top-10 {
margin-top: 10px;
}
+
.m-top-15 {
margin-top: 15px;
}
+
.m-top-20 {
margin-top: 20px;
}
+
.m-top-30 {
margin-top: 30px;
}
+
.m-bott-10 {
margin-bottom: 10px;
}
+
.m-top-10p {
margin-top: 10%;
}
-.ml-10 { margin-left: 10px; }
+
+.ml-10 {
+ margin-left: 10px;
+}
.full-height {
height: 100%;
}
+
.ani {
transition: all .35s ease-in-out;
}
@@ -295,6 +317,7 @@ input[type='number'] {
align-items: center;
justify-content: center;
height: 100%;
+
.content {
text-align: center;
}
@@ -302,7 +325,8 @@ input[type='number'] {
#scrolling::-webkit-scrollbar,
.list-selected mat-chip-list .mat-chip-list-wrapper::-webkit-scrollbar {
- width: 6px;
+ width: 5px;
+ height: 5px;
}
#scrolling::-webkit-scrollbar-track,
@@ -327,6 +351,7 @@ input[type='number'] {
color: #fff;
background: #e2747d;
word-break: break-word;
+
span {
position: absolute;
top: -12px;
@@ -346,20 +371,22 @@ input[type='number'] {
white-space: nowrap;
overflow: hidden;
}
+
.capitalize {
text-transform: capitalize;
}
.overlay-container {
#toast-container {
- > div.toast {
- box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
+ >div.toast {
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
border-radius: 2px;
background-color: #fff;
padding: 12px 20px;
overflow: inherit;
margin: 0 0 15px;
font-size: 14px;
+
&::before {
position: absolute;
left: -15px;
@@ -371,32 +398,40 @@ input[type='number'] {
padding: 7px;
box-sizing: border-box;
border-radius: 50%;
- box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}
+
&.toast-success {
background-image: none;
color: #49af38;
+
&::before {
content: "done";
}
}
+
&.toast-error {
background-image: none;
color: #e2747d;
+
&::before {
content: "priority_high";
}
}
+
&.toast-info {
background-image: none;
color: #35afd5;
+
&::before {
content: "priority_high";
}
}
+
&.toast-warning {
background-image: none;
color: #f7b500;
+
&::before {
content: "priority_high";
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org