Skip to content

fix: URL input overflows on mobile in game session view #2979

@Adarshkumar0509

Description

@Adarshkumar0509

Bug Description

On mobile screens, the game session share URL input box overflows outside its container, causing horizontal page overflow and poor UX.

Steps to Reproduce

  1. Create a new game at /games/new
  2. Open the game session page on a mobile device or mobile viewport
  3. Observe the URL input box overflowing beyond the screen width

Expected Behavior

The URL input should fit within its container on all screen sizes.

Actual Behavior

The URL text overflows the container causing layout breakage on mobile.

Root Cause

The <input> inside a flex row container was missing min-w-0.
Without it, flex children cannot shrink below their content size,
causing the long URL to overflow on narrow screens.

Fix

Add min-w-0 to the input element in copy_url_button component:
lib/copi_web/components/core_components/buttons.ex

Screenshots

My device was Redmi note 10s

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions