hardi
/
opt-cc
1
0
Fork 0
Code Pull Requests Releases 47 Activity

use sass magic

pull/57/head
HardiReady 2019-02-25 00:12:15 +01:00
parent d4347f9390
commit 16e7e655bb
4 changed files with 99 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
static/src/app/common/navigation/navigation-header.component.scss
View File

@ -1,31 +1,11 @@
li { @import url('../../style/blink-indicator.scss');
height: 50px;
line-height: 46px;
padding: 0 10px;
cursor: pointer;
}
li a { mat-toolbar {
font-size: 16px; height: 2.5em;
text-decoration: none; min-height: 50px;
color: #9d9d9d;
padding: 16px 5px;
}
li mat-list-item { &.mat-toolbar.mat-primary {
cursor: pointer; background: #222222;
}
li:hover {
a {
color: white;
}
}
li.active {
@extend li:hover;
background: #000000;
} }
.navigation-items { .navigation-items {
@ -34,13 +14,34 @@ li.active {
margin: 0; margin: 0;
} }
.mat-toolbar.mat-primary { li {
background: #222222; height: 50px;
line-height: 46px;
padding: 0 10px;
cursor: pointer;
mat-list-item {
cursor: pointer;
} }
mat-toolbar { a {
height: 2.5em; font-size: 16px;
min-height: 50px; text-decoration: none;
color: #9d9d9d;
padding: 16px 5px;
}
&:hover {
a {
color: white;
}
}
&.active {
@extend li:hover;
background: #000000;
}
} }
.brand-logo { .brand-logo {
@ -66,33 +67,4 @@ mat-toolbar {
} }
} }
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
} }

4
static/src/app/common/navigation/navigation-header.component.ts
View File

@ -24,12 +24,12 @@ export class NavigationHeaderComponent implements OnInit {
readonly availableLanguages = BaseConfig.i18n.availableLanguages; readonly availableLanguages = BaseConfig.i18n.availableLanguages;
readonly version = require('./../../../../../package.json').version;
config = RouteConfig; config = RouteConfig;
language; language;
version = require('./../../../../../package.json').version;
constructor(public loginService: LoginService, constructor(public loginService: LoginService,
private promotionService: PromotionService, private promotionService: PromotionService,
private awardingService: AwardingService, private awardingService: AwardingService,

33
static/src/app/common/navigation/sidenav-list.component.scss
View File

@ -1,3 +1,5 @@
@import url('../../style/blink-indicator.scss');
mat-list-item.mat-list-item, a.mat-list-item { mat-list-item.mat-list-item, a.mat-list-item {
font-size: 16px; font-size: 16px;
text-decoration: none; text-decoration: none;
@ -21,34 +23,3 @@ mat-divider {
margin: 15% 0; margin: 15% 0;
border-color: #9d9d9d; border-color: #9d9d9d;
} }
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}

30
static/src/app/style/blink-indicator.scss Normal file
View File

@ -0,0 +1,30 @@
.unprocessed {
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink;
animation-duration: 4s;
animation-iteration-count: infinite;
}
.unprocessed-child {
background-color: orange;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}
@keyframes color-blink {
from {
background-color: #222222;
}
to {
background-color: orange;
}
}