YogaBloom
Responsive yoga studio landing page built as a team HTML/CSS project.
Overview
YogaBloom is a responsive one-page landing page for a yoga studio. The project focused on semantic HTML, adaptive CSS layout, optimized assets, SVG sprite usage, and structured landing page sections for classes, team, gallery, testimonials, pricing, and footer content.
Project Details
Key Features
- One-page landing page
- Responsive layout
- Semantic HTML5 structure
- Modal window interaction
- Anchor navigation
- Optimized images
- SVG sprite icons
- Retina image support
- Gallery section
- Testimonials section
- Pricing section
- Footer subscription form
My Role
- Frontend Developer
- Team Lead
- Set up the project repository and supported the team Git workflow
- Built the modal window layout and related open/close interaction styling
- Implemented responsive HTML/CSS for assigned sections
- Reviewed pull requests before merging into the main branch
- Helped teammates debug layout issues and understand Git workflow
- Fixed layout and styling issues across teammate sections when needed
- Helped optimize image assets for the project
- Checked final implementation against technical requirements before submission
Tech Stack
- HTML5
- CSS3
- JavaScript
- Vite
- modern-normalize
- Prettier
- SVG Sprite
- Responsive Design
Development Focus
- Problem: A yoga studio needs a clear landing page that explains the offer, presents classes and trainers, builds trust, and guides visitors toward joining a pricing plan.
- Solution: A structured one-page website with responsive sections, anchor navigation, class and team content, gallery, testimonials, pricing plans, modal interaction, and footer subscription/contact areas.
YogaBloom was built as a responsive HTML/CSS team project focused on semantic markup, adaptive layout, optimized assets, SVG sprite usage, and accurate implementation from the design brief. My direct development work included the modal window layout, related styling, responsive section work, and final visual fixes.
As Team Lead, I set up the repository, reviewed pull requests, helped teammates with Git and layout issues, and checked the implementation against project requirements before merging. This project strengthened my HTML/CSS fundamentals, responsive layout skills, and ability to coordinate code quality in a team workflow.
