Skip to content

Conversation

@canerakdas
Copy link
Member

Description

This PR aims to make headings more readable on mobile by aligning them with the Figma design, and to fix the overflow issues caused by code elements on mobile resolutions

Validation

Before

image

After

image

Before (Content overflow)

image

After

image

Related Issues

Fixes #565

Check List

  • I have read the Contributing Guidelines and made commit messages that follow the guideline.
  • I have run node --run test and all tests passed.
  • I have check code formatting with node --run format & node --run lint.
  • I've covered new added functionality with unit tests if necessary.

@canerakdas canerakdas requested a review from a team as a code owner January 14, 2026 20:00
Copilot AI review requested due to automatic review settings January 14, 2026 20:00
@vercel
Copy link

vercel bot commented Jan 14, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
api-docs-tooling Ready Ready Preview Jan 14, 2026 8:08pm

@codecov
Copy link

codecov bot commented Jan 14, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 79.97%. Comparing base (39b2c0f) to head (876b284).
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@           Coverage Diff           @@
##             main     #566   +/-   ##
=======================================
  Coverage   79.97%   79.97%           
=======================================
  Files         127      127           
  Lines       12276    12276           
  Branches      866      866           
=======================================
  Hits         9818     9818           
  Misses       2455     2455           
  Partials        3        3           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link
Contributor

Copilot AI left a comment

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 fixes mobile layout issues for headings and code elements by implementing mobile-first responsive design patterns. The changes ensure headings wrap properly on mobile and code elements don't cause horizontal overflow.

Changes:

  • Added word wrapping for code elements on mobile with media query reset for desktop
  • Changed heading containers to use column layout on mobile, reverting to row layout on desktop
  • Adjusted change history positioning and menu alignment for mobile and desktop views

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

@ovflowd
Copy link
Member

ovflowd commented Jan 15, 2026

nit:

image

can the 2nd dropdown have a title like "Navigation" or something? Also it is so awkwardly positioned far from the 1st dropdown.

Copy link
Member

@ovflowd ovflowd left a comment

Choose a reason for hiding this comment

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

SGTM

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.

[bugs] Layout issues at mobile resolution

4 participants