Skip to content

fix(renderer): prevent page shrinking in flex containers#34

Merged
Seungwoo321 merged 3 commits intomainfrom
develop
Mar 23, 2026
Merged

fix(renderer): prevent page shrinking in flex containers#34
Seungwoo321 merged 3 commits intomainfrom
develop

Conversation

@Seungwoo321
Copy link
Contributor

Summary

  • .wf-pageflex-shrink: 0 추가하여 부모 flex container 환경에서 페이지가 자동 축소되는 버그 수정
  • 고정 레이아웃 렌더링 철학 문서화

Root Cause

  • .wf-pageflex-shrink: 0 속성이 없어서, body가 flex container인 환경(일부 브라우저, Storybook 등)에서 viewport 너비가 page width보다 작을 때 페이지가 자동으로 축소됨
  • 이로 인해 내부 컴포넌트 레이아웃이 재배치되고, 동일한 .wf 파일이 환경에 따라 다르게 렌더링되는 문제 발생

Fix

  • src/renderer/styles.ts.wf-page 스타일에 flex-shrink: 0 추가
  • .claude/rules/no-responsive.md 문서 작성: wireweave의 고정 레이아웃 렌더링 철학 명시
    • 페이지는 고정 크기 유지
    • 축소는 scale() 비율 변환만 허용
    • 렌더링 결과는 환경에 독립적

Test Plan

  • 기존 스냅샷 테스트 전체 통과 (10개 스냅샷 업데이트)
  • 다양한 viewport 크기에서 페이지 고정 크기 유지 확인
  • Storybook, VSCode 확장, 브라우저에서 동일한 레이아웃 렌더링 검증

Seungwoo321 and others added 3 commits March 21, 2026 20:25
와이어프레임 렌더링의 핵심 원칙을 문서화했습니다. 페이지는 고정 크기를 유지해야 하며, 환경에 따라 레이아웃이 변하면 안 된다는 철학을 명시했습니다.
.wf-page에 flex-shrink: 0을 추가하여 부모가 flex container일 때 viewport가 page width보다 작아도 페이지 크기가 유지되도록 수정했습니다. 이로써 모든 환경에서 동일한 고정 레이아웃이 보장됩니다.
@Seungwoo321 Seungwoo321 merged commit b0e9981 into main Mar 23, 2026
1 check passed
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.

1 participant