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

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

@ -1,98 +1,70 @@
li { @import url('../../style/blink-indicator.scss');
height: 50px;
line-height: 46px;
padding: 0 10px;
cursor: pointer;
}
li a {
font-size: 16px;
text-decoration: none;
color: #9d9d9d;
padding: 16px 5px;
}
li mat-list-item {
cursor: pointer;
}
li:hover {
a {
color: white;
}
}
li.active {
@extend li:hover;
background: #000000;
}
.navigation-items {
list-style-type: none;
padding: 0;
margin: 0;
}
.mat-toolbar.mat-primary {
background: #222222;
}
mat-toolbar { mat-toolbar {
height: 2.5em; height: 2.5em;
min-height: 50px; min-height: 50px;
}
&.mat-toolbar.mat-primary {
.brand-logo { background: #222222;
padding-top: 6px; }
margin-right: -10px;
.navigation-items {
mat-icon { list-style-type: none;
color: #dadada; padding: 0;
width: 135px; margin: 0;
height: 40px; }
stroke: #dadada;
} li {
height: 50px;
.version-label { line-height: 46px;
position: relative; padding: 0 10px;
left: -42px; cursor: pointer;
font-size: 12px;
color: #bebebe; mat-list-item {
} cursor: pointer;
}
@media all and (max-width: 959px) {
margin: auto; a {
} font-size: 16px;
} text-decoration: none;
color: #9d9d9d;
.unprocessed { padding: 16px 5px;
-webkit-animation-name: color-blink; /* Safari 4.0 - 8.0 */ }
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: color-blink; &:hover {
animation-duration: 4s; a {
animation-iteration-count: infinite; color: white;
} }
}
.unprocessed-child {
background-color: orange; &.active {
} @extend li:hover;
/* Safari 4.0 - 8.0 */ background: #000000;
@-webkit-keyframes color-blink { }
from { }
background-color: #222222;
} .brand-logo {
to { padding-top: 6px;
background-color: orange; margin-right: -10px;
}
} mat-icon {
color: #dadada;
@keyframes color-blink { width: 135px;
from { height: 40px;
background-color: #222222; stroke: #dadada;
} }
to {
background-color: orange; .version-label {
} position: relative;
left: -42px;
font-size: 12px;
color: #bebebe;
}
@media all and (max-width: 959px) {
margin: auto;
}
}
} }

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;
}
}