Skip to content

Fix mobile sidebar visibility guard#223

Merged
ootakazuhiko merged 2 commits into
mainfrom
codex/issue168-sidebar-visibility-followup-20260607
Jun 7, 2026
Merged

Fix mobile sidebar visibility guard#223
ootakazuhiko merged 2 commits into
mainfrom
codex/issue168-sidebar-visibility-followup-20260607

Conversation

@ootakazuhiko

@ootakazuhiko ootakazuhiko commented Jun 7, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • Reinforce the mobile/tablet sidebar closed state with visibility: hidden and a delayed visibility transition.
  • Keep the opened sidebar visible and above the overlay while preserving the existing off-canvas transform fix.
  • Apply the same guard to each tracked mobile-responsive.css copy in this repository to avoid asset drift.

Part of itdojp/it-engineer-knowledge-architecture#168.

Verification

  • git diff --check
  • Static CSS guard check for z-index: 999 !important, closed transform: translateX(-100%) !important, closed visibility: hidden, delayed visibility transition, and opened visibility: visible.

Copilot AI review requested due to automatic review settings June 7, 2026 11:20
@ootakazuhiko

Copy link
Copy Markdown
Collaborator Author

@copilot review

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 hardens the mobile/tablet off-canvas sidebar “closed” behavior by ensuring the drawer is not only translated off-screen but also visibility: hidden after the slide-out completes, while keeping the opened state visible above the overlay and below the fixed header. The same guard is applied across the repository’s duplicated mobile-responsive.css files to keep behavior consistent.

Changes:

  • Enforce closed drawer state with transform: translateX(-100%) !important plus visibility: hidden and a delayed visibility transition.
  • Ensure opened drawer is explicitly visibility: visible and uses a transform-only transition to avoid delayed showing.
  • Align z-index expectations (z-index: 999 !important) to keep the drawer above the overlay (950) and below the header (1000) where documented.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File Description
github-guide-for-beginners-book/docs/assets/css/mobile-responsive.css Adds closed-state visibility guard + delayed visibility transition and mirrors opened-state visibility/transition.
docs/assets/css/mobile-responsive.css Applies the same visibility/transition guard while preserving the existing z-index/transform “important” rationale comments.
assets/css/mobile-responsive.css Mirrors the guard and ensures the opened transform is !important to reliably override the closed important transform.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@ootakazuhiko

Copy link
Copy Markdown
Collaborator Author

@copilot review

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