Enhance HeroSection component: Implement mouse-following gradient effect for the game title, improving visual interactivity. Update CSS for better font formatting and add a new title animation class for enhanced text styling.
This commit is contained in:
@@ -5,7 +5,9 @@
|
||||
@layer base {
|
||||
body {
|
||||
@apply bg-black text-white;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
|
||||
"Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
|
||||
"Helvetica Neue", sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -16,11 +18,16 @@
|
||||
image-rendering: -moz-crisp-edges;
|
||||
image-rendering: crisp-edges;
|
||||
}
|
||||
|
||||
|
||||
.text-pixel {
|
||||
font-family: 'Courier New', monospace;
|
||||
font-family: "Courier New", monospace;
|
||||
text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.8);
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.title-animated {
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user