diff --git a/LTG banner.css b/LTG banner.css
index a193b04..a9cc028 100644
--- a/LTG banner.css
+++ b/LTG banner.css
@@ -6,24 +6,18 @@ domain("ltg-admin.alkemics.com") {
--color2: hsl(261, 80%, 59%);
--duration: 30s;
}
- .Navbar::before {
- z-index: -10;
- content: "";
- position: absolute;
- top: 0;
- left: 0;
- width: calc(100% + var(--stripe-size));
- height: 100%;
- background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%);
+ .AuthLayoutFooter,
+ .Navbar.navbar.bg-inverse {
+ background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color1) 75%);
background-size: var(--stripe-size) var(--stripe-size);
- animation: stripeTransform var(--duration) linear infinite;
+ animation: alkegrad var(--duration) linear infinite;
}
- @keyframes stripeTransform {
- 0% {
- transform: translateX(0);
+ @keyframes alkegrad {
+ from {
+ background-position: 0 0;
}
- 100% {
- transform: translateX(calc(var(--stripe-size) * -1));
+ to {
+ background-position: var(--stripe-size) 0;
}
}
}
\ No newline at end of file
diff --git a/PLR banner.css b/PLR banner.css
index 1233971..8d0c1f9 100644
--- a/PLR banner.css
+++ b/PLR banner.css
@@ -1,28 +1,22 @@
@-moz-document domain("int.alkemics.com") {
:root {
--stripe-size: 100px;
- --color1: hsl(195, 70%, 45%);
- --color2: hsl(195, 70%, 50%);
+ --color1: hsl(205, 70%, 45%);
+ --color2: hsl(205, 70%, 50%);
--duration: 30s;
}
- .Navbar::before {
- z-index: -10;
- content: "";
- position: absolute;
- top: 0;
- left: 0;
- width: calc(100% + var(--stripe-size));
- height: 100%;
- background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%);
+ .AuthLayoutFooter,
+ .Navbar.navbar.bg-inverse {
+ background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color1) 75%);
background-size: var(--stripe-size) var(--stripe-size);
- animation: stripeTransform var(--duration) linear infinite;
+ animation: alkegrad var(--duration) linear infinite;
}
- @keyframes stripeTransform {
- 0% {
- transform: translateX(0);
+ @keyframes alkegrad {
+ from {
+ background-position: 0 0;
}
- 100% {
- transform: translateX(calc(var(--stripe-size) * -1));
+ to {
+ background-position: var(--stripe-size) 0;
}
}
}
\ No newline at end of file
diff --git a/PPR banner.css b/PPR banner.css
index 5b8d1fe..cd72f08 100644
--- a/PPR banner.css
+++ b/PPR banner.css
@@ -1,28 +1,27 @@
-@-moz-document domain("ppr-stream.alkemics.com") {
+@-moz-document domain("ppr-stream.alkemics.com"),
+domain("ppr-admin.alkemics.com") {
:root {
--stripe-size: 100px;
--color1: hsl(194, 71%, 30%);
--color2: hsl(194, 77%, 35%);
- --duration: 30s;
+ --duration: 20s;
}
- .Navbar::before {
- z-index: -10;
- content: "";
- position: absolute;
- top: 0;
- left: 0;
- width: calc(100% + var(--stripe-size));
- height: 100%;
- background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%);
+ .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: stripeTransform var(--duration) linear infinite;
+ animation: alkegrad var(--duration) linear infinite;
}
- @keyframes stripeTransform {
- 0% {
- transform: translateX(0);
+ .AuthLayoutFooter {
+ --stripe-size: 200px;
+ --duration: 40s;
+ }
+ @keyframes alkegrad {
+ from {
+ background-position: 0 0;
}
- 100% {
- transform: translateX(calc(var(--stripe-size) * -1));
+ to {
+ background-position: var(--stripe-size) 0;
}
}
}
\ No newline at end of file
diff --git a/PRD banner.css b/PRD banner.css
index 351fa3e..8ad3935 100644
--- a/PRD banner.css
+++ b/PRD banner.css
@@ -1,5 +1,7 @@
-@-moz-document domain("stream.alkemics.com") {
- .Navbar.bg-inverse {
+@-moz-document domain("stream.alkemics.com"),
+domain("admin.alkemics.com") {
+ .AuthLayoutFooter,
+ .Navbar.navbar.bg-inverse {
background: linear-gradient(-45deg, #00e1d0, #00c4ff, #0562e8, #8a25f9);
background-size: 400% 100% !important;
animation: salsigrad 60s linear infinite !important;
diff --git a/README.md b/README.md
index f92a3b9..fd1d2a4 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,10 @@
# xStyle custom CSS for Alkemics front
-This content aims to change a little the Alkemics interface to help you recognise at glance certains informations. It also refresh the interface a little.
+## What is this?
+
+This content aims to change a little the Alkemics interface to help you recognise at a glance certains informations. It also refresh the interface a little. Changes are made inside your broswer via an extension, so it doesn't reflect elsewhere.
+
+
## Give me an example
diff --git a/Retailers Sigils.css b/Retailers Sigils.css
index d65df5e..6663e0f 100644
--- a/Retailers Sigils.css
+++ b/Retailers Sigils.css
@@ -2,7 +2,7 @@
domain("ppr-stream.alkemics.com"),
domain("ltg-stream.alkemics.com"),
domain("int.alkemics.com") {
- .mdi-account::before {
+ #navbar-profile .dropdown-toggle .mdi-account::before {
content: "\F4DC";
color: orange;
}
diff --git a/Suppliers Sigils.css b/Suppliers Sigils.css
index 11f9e0c..64e6ae3 100644
--- a/Suppliers Sigils.css
+++ b/Suppliers Sigils.css
@@ -2,7 +2,7 @@
domain("ppr-stream.alkemics.com"),
domain("ltg-stream.alkemics.com"),
domain("int.alkemics.com") {
- .mdi-account::before {
+ #navbar-profile .dropdown-toggle .mdi-account::before {
content: "\F20F";
color: turquoise;
}
diff --git a/public/illustration.png b/public/illustration.png
new file mode 100644
index 0000000..b5a9549
Binary files /dev/null and b/public/illustration.png differ
diff --git a/public/user-orange-shop.png b/public/user-orange-shop.png
new file mode 100644
index 0000000..fda7a18
Binary files /dev/null and b/public/user-orange-shop.png differ
diff --git a/public/user-teal-factory.png b/public/user-teal-factory.png
new file mode 100644
index 0000000..9cf5644
Binary files /dev/null and b/public/user-teal-factory.png differ
diff --git a/testing/test.css b/testing/test.css
new file mode 100644
index 0000000..1326582
--- /dev/null
+++ b/testing/test.css
@@ -0,0 +1,28 @@
+:root {
+ --stripe-size: 100px;
+ --color1: hsl(194, 71%, 30%);
+ --color2: hsl(194, 77%, 35%);
+ --duration: 20s;
+}
+
+div {
+ height: var(--stripe-size);
+ width: calc(var(--stripe-size) * 7);
+ margin: auto;
+ border: 1px solid black;
+}
+
+div {
+ 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;
+}
+
+@keyframes alkegrad {
+ from {
+ background-position: 0 0;
+ }
+ to {
+ background-position: var(--stripe-size) 0;
+ }
+}
\ No newline at end of file
diff --git a/testing/test.html b/testing/test.html
new file mode 100644
index 0000000..8f7c78e
--- /dev/null
+++ b/testing/test.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
\ No newline at end of file