Remove sidebar navigation and floating elements

Deleted NavMenu component and its styles, removed sidebar layout from MainLayout, and cleaned up related CSS. The Home page was simplified by removing floating icons and animation effects. This streamlines the UI and focuses on main content presentation.
This commit is contained in:
2025-08-25 19:33:52 -04:00
parent 6b1225d697
commit 5c062a4d79
6 changed files with 0 additions and 416 deletions
@@ -2,20 +2,7 @@
<PageTitle>I Know Them!</PageTitle>
<div class="landing-page">
<div class="floating-elements">
<div class="floating-icon">🎬</div>
<div class="floating-icon">📺</div>
<div class="floating-icon">🎭</div>
<div class="floating-icon">🌟</div>
<div class="floating-icon">🎪</div>
<div class="floating-icon">🎯</div>
<div class="floating-icon">🎨</div>
<div class="floating-icon">🎵</div>
<div class="floating-icon">🎮</div>
</div>
<div class="hero">
<div class="pulse-dot"></div>
<h1>Welcome to <span class="highlight">I Know Them!</span></h1>
<p class="subtitle">Ever watched a movie or show and thought, "I know that actor from somewhere..."?</p>
<p class="description">This app helps you quickly identify actors, find out what else they've been in, and explore cast details for your favorite <strong>movies</strong> and <strong>TV shows</strong>.</p>
@@ -45,91 +32,6 @@
overflow: hidden;
}
@@keyframes gradientFlow {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.floating-elements {
position: absolute;
width: 100%;
height: 100%;
pointer-events: none;
overflow: hidden;
}
.floating-icon {
position: absolute;
opacity: 0.1;
animation: float 20s infinite linear;
font-size: 2rem;
color: white;
}
.floating-icon:nth-child(1) {
left: 10%;
animation-delay: 0s;
}
.floating-icon:nth-child(2) {
left: 20%;
animation-delay: 4s;
}
.floating-icon:nth-child(3) {
left: 30%;
animation-delay: 8s;
}
.floating-icon:nth-child(4) {
left: 40%;
animation-delay: 12s;
}
.floating-icon:nth-child(5) {
left: 50%;
animation-delay: 16s;
}
.floating-icon:nth-child(6) {
left: 60%;
animation-delay: 3s;
}
.floating-icon:nth-child(7) {
left: 70%;
animation-delay: 7s;
}
.floating-icon:nth-child(8) {
left: 80%;
animation-delay: 11s;
}
.floating-icon:nth-child(9) {
left: 90%;
animation-delay: 15s;
}
@@keyframes float {
0% {
transform: translateY(100vh) rotate(0deg);
}
100% {
transform: translateY(-100px) rotate(360deg);
}
}
.hero {
max-width: 800px;
text-align: center;
@@ -175,15 +77,6 @@
}
}
.highlight {
background: linear-gradient(45deg, #ffeaa7, #fdcb6e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
display: inline-block;
animation: shimmer 3s ease-in-out infinite;
}
@@keyframes shimmer {
0%, 100% {
filter: brightness(1);
@@ -311,34 +204,6 @@
box-shadow: 0 20px 40px rgba(255, 255, 255, 0.2);
}
.pulse-dot {
position: absolute;
width: 8px;
height: 8px;
background: #ffeaa7;
border-radius: 50%;
top: 1rem;
right: 1rem;
animation: pulse 2s infinite;
}
@@keyframes pulse {
0% {
transform: scale(0.8);
opacity: 1;
}
50% {
transform: scale(1.2);
opacity: 0.7;
}
100% {
transform: scale(0.8);
opacity: 1;
}
}
@@media (max-width: 768px) {
.hero {
margin: 1rem;