Skip to content

Comments

Animation & Slidebar Improvement#29

Open
Brij123179 wants to merge 8 commits intoCPSquad1:mainfrom
Brij123179:add-footer-component
Open

Animation & Slidebar Improvement#29
Brij123179 wants to merge 8 commits intoCPSquad1:mainfrom
Brij123179:add-footer-component

Conversation

@Brij123179
Copy link
Contributor

No description provided.

- Created ScrollSidebar component matching Delta Force design
- White vertical line with progress indicator
- Dynamic bars that extend based on scroll position
- Green gradient progress line fills as user scrolls
- Pulsing dot indicator on active section
- Smooth hover effects with tooltips
- Click to navigate to sections
- Fully responsive (hidden on mobile, visible on desktop)
- Added section IDs to footer for proper tracking
- Updated home page with proper sections (hero, about, features)

Enhancements:
- Bars extend on hover with glow effect
- Tooltip labels appear on hover
- Scroll percentage indicator
- Smooth scroll navigation with navbar offset
- Professional animations and transitions
- Implemented static matrix character triangle background
- Added DecryptedText component with sequential character reveal
- Created responsive hero section with cycling text animation
- Added glitch effects and smooth animations
- Optimized for performance with GPU acceleration
- Matches Delta Force NIT Trichy design aesthetic
@CPSquad1
Copy link
Owner

@Brij123179 Please attach the demo video of what you have built.

@DevSsChar
Copy link
Collaborator

DevSsChar commented Oct 19, 2025

@Brij123179 @CPSquad1
You have forgot to import the Animation Component in the main page.js that's why it was not visible when i opened it.
image
Do it likewise
image
Also, i have checked the animation.
The delta triangle is too big compared to the main site
image
image

New changes recommended:-

  1. Make the delta triangle smaller, like 50% in the middle section
  2. Also for the font use CERAPRO font or u can use these alternatives
    Nunito → Google Fonts (https://fonts.google.com/specimen/Nunito
    Poppins → Google Fonts (https://fonts.google.com/specimen/Poppins
  3. Make the background of the text black rather than transparent as you can see in the image itself
  4. Also the cipher text must be randomized shouldnt start always from left
  5. Also text ideally should be of color scheme and size similar to that of LEARN MORE section
  6. No need of Learn More & Explore sections

Ps: The slidebar looks good now, great work.

@DevSsChar DevSsChar changed the title Animation Animation & Slidebar Improvement Oct 19, 2025
@Brij123179 Brij123179 closed this Oct 22, 2025
@Brij123179 Brij123179 reopened this Oct 22, 2025
@DevSsChar
Copy link
Collaborator

@Brij123179 all of the above changes requested are still left

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants