diff --git a/Art/ChaniHighTech-LiquidLoader/index.html b/Art/ChaniHighTech-LiquidLoader/index.html new file mode 100644 index 000000000..321ff4f75 --- /dev/null +++ b/Art/ChaniHighTech-LiquidLoader/index.html @@ -0,0 +1,15 @@ + + + + + + + + +
+
+
+
+
+ + diff --git a/Art/ChaniHighTech-LiquidLoader/meta.json b/Art/ChaniHighTech-LiquidLoader/meta.json new file mode 100644 index 000000000..6a1661aaa --- /dev/null +++ b/Art/ChaniHighTech-LiquidLoader/meta.json @@ -0,0 +1,4 @@ +{ + "githubHandle": "ChaniHighTech", + "artName": "Liquid Loader" +} \ No newline at end of file diff --git a/Art/ChaniHighTech-LiquidLoader/styles.css b/Art/ChaniHighTech-LiquidLoader/styles.css new file mode 100644 index 000000000..0b95c3c27 --- /dev/null +++ b/Art/ChaniHighTech-LiquidLoader/styles.css @@ -0,0 +1,35 @@ +body { + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background: #222; +} + +.loader { + display: flex; + gap: 10px; +} + +.dot { + width: 20px; + height: 20px; + background: #ff4500; + border-radius: 50%; + animation: liquid 1.5s infinite ease-in-out; +} + +.dot:nth-child(2) { + background: #ffa500; + animation-delay: 0.2s; +} + +.dot:nth-child(3) { + background: #32cd32; + animation-delay: 0.4s; +} + +@keyframes liquid { + 0%, 100% { transform: translateY(0); } + 50% { transform: translateY(-15px) scale(1.2); } +}