feat: add ShinyText component for animated text effects and integrate into HomeComponent

2025-10-13 00:43:31 +00:00 · 2025-09-03 23:53:06 -03:00
parent ff9ca32d4f
commit 50663544e1
3 changed files with 60 additions and 2 deletions
--- a/apps/web/src/components/ShinyText.css
+++ b/apps/web/src/components/ShinyText.css
@@ -0,0 +1,27 @@
+.shiny-text {
+  color: #ffffffbb; /* Adjust this color to change intensity/style */
+  background: linear-gradient(
+    120deg,
+    rgba(255, 255, 255, 0) 40%,
+    rgba(255, 255, 255, 1) 50%,
+    rgba(255, 255, 255, 0) 60%
+  );
+  background-size: 200% 100%;
+  -webkit-background-clip: text;
+  background-clip: text;
+  display: inline-block;
+  animation: shine 5s linear infinite;
+}
+
+@keyframes shine {
+  0% {
+    background-position: 100%;
+  }
+  100% {
+    background-position: -100%;
+  }
+}
+
+.shiny-text.disabled {
+  animation: none;
+}