refactor(#28): Switch to 1 color hue (#30)

* refactor(#28): Switch to 1 color hue

* refactor(#28): Tweak colors
This commit is contained in:
Simon Priet 2023-05-30 17:31:20 +02:00 committed by GitHub
parent 3e4591400a
commit 202a145426
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 11 additions and 10 deletions

View File

@ -2,6 +2,7 @@
"conventionalCommits.scopes": [ "conventionalCommits.scopes": [
"#11", "#11",
"13", "13",
"#28",
"#28" "#28"
] ]
} }

View File

@ -2,16 +2,16 @@
domain("ltg-admin.supplierxm.salsify.com") { domain("ltg-admin.supplierxm.salsify.com") {
:root { :root {
--stripe-size: 100px; --stripe-size: 100px;
--color1: hsl(180, 63%, 30%); --color1: hsl(180, 78%, 35%);
--color2: hsl(180, 63%, 36%); --color2: rgba(0, 0, 0, 0.15);
--duration: 1s; --duration: 1s;
--state: running; --state: running;
} }
.AuthLayoutFooter, .AuthLayoutFooter,
.Navbar.navbar.Navbar--PPR.bg-inverse { .Navbar.navbar.Navbar--PPR.bg-inverse {
background: repeating-linear-gradient(-45deg, hsla(261, 80%, 59%, 0) 25%, var(--color1) 50%, var(--color1) 75%); background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, transparent 50%, transparent 75%);
background-color: var(--color2); background-color: var(--color1);
background-size: var(--stripe-size) var(--stripe-size); background-size: var(--stripe-size) var(--stripe-size);
animation: alkegrad var(--duration) linear 0s infinite normal var(--state); animation: alkegrad var(--duration) linear 0s infinite normal var(--state);
transition: background 200ms linear; transition: background 200ms linear;

View File

@ -2,15 +2,15 @@
domain("localstream.alkemics.com") { domain("localstream.alkemics.com") {
:root { :root {
--stripe-size: 100px; --stripe-size: 100px;
--color1: hsl(205, 84%, 41%); --color1: hsl(220, 100%, 63%);
--color2: hsl(205, 70%, 50%); --color2: rgba(0, 0, 0, 0.15);
--duration: 1s; --duration: 1s;
--state: paused; --state: paused;
} }
.AuthLayoutFooter, .AuthLayoutFooter,
.Navbar.navbar.Navbar--PPR.bg-inverse { .Navbar.navbar.Navbar--PPR.bg-inverse {
background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%); background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, transparent 50%, transparent 75%);
background-color: var(--color1); background-color: var(--color1);
background-size: var(--stripe-size) var(--stripe-size); background-size: var(--stripe-size) var(--stripe-size);
animation: alkegrad var(--duration) linear 0s infinite normal var(--state); animation: alkegrad var(--duration) linear 0s infinite normal var(--state);

View File

@ -2,15 +2,15 @@
domain("ppr-admin.supplierxm.salsify.com/") { domain("ppr-admin.supplierxm.salsify.com/") {
:root { :root {
--stripe-size: 100px; --stripe-size: 100px;
--color1: hsla(194, 71%, 30%, 1); --color1: hsl(194, 77%, 35%);
--color2: hsla(194, 77%, 35%, 1); --color2: rgba(0, 0, 0, 0.15);
--duration: 1s; --duration: 1s;
--state: paused; --state: paused;
} }
.AuthLayoutFooter, .AuthLayoutFooter,
.Navbar.navbar.Navbar--PPR.bg-inverse { .Navbar.navbar.Navbar--PPR.bg-inverse {
background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%); background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, transparent 50%, transparent 75%);
background-color: var(--color1); background-color: var(--color1);
background-size: var(--stripe-size) var(--stripe-size); background-size: var(--stripe-size) var(--stripe-size);
animation: alkegrad var(--duration) linear 0s infinite normal var(--state); animation: alkegrad var(--duration) linear 0s infinite normal var(--state);