Skip to content

fix: improve hero responsive layout - #29

Merged
kamycoding merged 1 commit into
mainfrom
fix/hero-100vh
Aug 11, 2026
Merged

fix: improve hero responsive layout#29
kamycoding merged 1 commit into
mainfrom
fix/hero-100vh

Conversation

@kamycoding

Copy link
Copy Markdown
Owner

No description provided.

Copilot AI lite review requested due to automatic review settings August 11, 2026 08:26
@netlify

netlify Bot commented Aug 11, 2026

Copy link
Copy Markdown

Deploy Preview for fanciful-cannoli-268c0c ready!

Name Link
🔨 Latest commit fa123b2
🔍 Latest deploy log https://app.netlify.com/projects/fanciful-cannoli-268c0c/deploys/6a7adcc3a59f8a00082f7664
😎 Deploy Preview https://deploy-preview-29--fanciful-cannoli-268c0c.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@kamycoding
kamycoding merged commit eb2b646 into main Aug 11, 2026
4 of 5 checks passed
@kamycoding
kamycoding deleted the fix/hero-100vh branch August 11, 2026 08:27

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR refactors the Home page hero section to improve responsive behavior by switching the layout to a grid-based composition, using clamp()/viewport units for sizing, and simplifying/removing desktop container-query-specific styles.

Changes:

  • Reworked hero.html structure to match a new grid layout (intro/CTA/polaroid as direct grid items).
  • Refactored hero.css to use CSS Grid + clamp() for responsive spacing/sizing, including updated desktop positioning rules.
  • Removed desktop container-query width rules for the greeting from global styles.css.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

File Description
src/styles.css Removes desktop container-query-based greeting width rules.
src/app/pages/home/sections/hero/hero.html Reorders/simplifies hero markup to align with grid layout.
src/app/pages/home/sections/hero/hero.css Rebuilds hero layout and responsive sizing using grid, clamp(), and updated desktop rules.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

position: relative;
width: 100%;
height: 176px;
aspect-ratio: 1;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants