From f759696ad3514de0f23ce4bed52550cd194e185a Mon Sep 17 00:00:00 2001 From: scar <91326008+alk-spriet@users.noreply.github.com> Date: Tue, 1 Feb 2022 17:48:29 +0100 Subject: [PATCH] tested some changes on the sandbox --- testing/test.css | 28 ++++++++++++++++++++++++++++ testing/test.html | 2 +- 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/testing/test.css b/testing/test.css index e69de29..1326582 100644 --- a/testing/test.css +++ 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 index 09a5f14..8f7c78e 100644 --- a/testing/test.html +++ b/testing/test.html @@ -10,7 +10,7 @@ - +
\ No newline at end of file