Lokasi ngalangkungan proxy:   [ UP ]  
[Ngawartoskeun bug]   [Panyetelan cookie]                
Skip to content

Ayush-34612/Glassmorphism-Sidebar-UX

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

📱 Glassmorphism Sidebar UI

A high-performance, responsive navigation sidebar built using Pure CSS3 and HTML5. This project implements the "Checkbox Hack" to manage component state without relying on JavaScript.

🚀 Live Demo

[Paste your GitHub Pages link here]

✨ Technical Highlights

  • Pure CSS State Management: Utilizes the :checked pseudo-class and General Sibling Combinators (~) for logic.
  • Glassmorphism Aesthetic: Implements backdrop transparency and soft shadows for a modern feel.
  • Responsive Design: Uses vh units and relative positioning for a consistent experience across viewports.
  • Optimized Performance: Zero JS overhead leads to faster load times and smoother animations.

📂 Project Structure

  • index.html - Primary entry point and semantic structure.
  • style.css - Stylesheet containing layout, transitions, and hover logic.
  • photo.jpg - Background image asset.

🛠️ Built With

  • HTML5 / CSS3
  • Font Awesome (Iconography)
  • Google Fonts (Roboto & Poppins)

About

A custom sidebar navigation component for photography websites, featuring smooth transitions, integrated iconography, and a dedicated social media footer.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors