feat(#11): Add new style with blinkers animations
This commit is contained in:
parent
2c84246592
commit
27a3c0a308
5
.vscode/settings.json
vendored
Normal file
5
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
{
|
||||
"conventionalCommits.scopes": [
|
||||
"#11"
|
||||
]
|
||||
}
|
17
Blinkers.less
Normal file
17
Blinkers.less
Normal file
@ -0,0 +1,17 @@
|
||||
@-moz-document domain("supplierxm.salsify.com"),
|
||||
domain("alkemics.com") {
|
||||
|
||||
button:not([disabled]) .mdi-arrow-right-bold,
|
||||
button:not([disabled]) .mdi-arrow-left-bold {
|
||||
|
||||
&:not([disabled]):hover {
|
||||
animation: car-blinkers 900ms steps(1, end) infinite;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes car-blinkers {
|
||||
45% {
|
||||
color: lightgreen;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,25 +1,29 @@
|
||||
@-moz-document domain("ppr-app.supplierxm.salsify.com"),
|
||||
domain("ppr-admin.alkemics.com") {
|
||||
:root {
|
||||
:root {
|
||||
--stripe-size: 100px;
|
||||
--color1: hsl(194, 71%, 30%);
|
||||
--color2: hsl(194, 77%, 35%);
|
||||
--duration: 20s;
|
||||
}
|
||||
|
||||
.AuthLayoutFooter,
|
||||
.Navbar.navbar.Navbar--PPR.bg-inverse {
|
||||
background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color1) 50%, var(--color1) 75%);
|
||||
background-size: var(--stripe-size) var(--stripe-size);
|
||||
animation: alkegrad var(--duration) linear infinite;
|
||||
}
|
||||
|
||||
.AuthLayoutFooter {
|
||||
--stripe-size: 200px;
|
||||
--duration: 40s;
|
||||
}
|
||||
|
||||
@keyframes alkegrad {
|
||||
from {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
to {
|
||||
background-position: var(--stripe-size) 0;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user