WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 6 months ago

Last modified 6 months ago

#40130 closed enhancement (fixed)

On mobile make media search full width

Reported by: karmatosed Owned by: adamsilverstein
Milestone: 5.3 Priority: normal
Severity: normal Version:
Component: Media Keywords: good-first-bug has-patch needs-testing commit has-screenshots
Focuses: ui Cc:

Description (last modified by karmatosed)

Visually this could be made full width.

https://cldup.com/lShPIi60NO.PNG

Note: the header here full stop needs some work but that is something to iterate on, lets start with this.

Attachments (4)

40130.patch (383 bytes) - added by abhishekfdd 3 years ago.
Patch to fix the issue
40130.2.patch (485 bytes) - added by m1tk00 3 years ago.
Attached the css for the form in the media query for mobile devices only.
40130.3.patch (674 bytes) - added by viralsampat 3 years ago.
Fixed
Media Library ‹ Develop WordPress Title — WordPress 2019-09-23 08-24-35.jpg (207.8 KB) - added by adamsilverstein 6 months ago.

Download all attachments as: .zip

Change History (25)

#1 @karmatosed
3 years ago

  • Description modified (diff)

#2 @adamsilverstein
3 years ago

  • Keywords good-first-bug added

@abhishekfdd
3 years ago

Patch to fix the issue

#3 @abhishekfdd
3 years ago

  • Keywords has-patch added; needs-patch removed

Made media search full width

#4 @adamsilverstein
3 years ago

  • Keywords has-screenshots reporter-feedback added

Looks good @abhishekfdd. At full width, the search box stays smaller and pinned to the right side of the screen:

https://d3vv6lp55qjaqc.cloudfront.net/items/1Y061G2R2S0W0w1U2k1A/Image%202017-03-21%20at%2010.41.55%20AM.png

At smaller sizes the width snaps to 100%:

https://cl.ly/1P0d0f3h2j3F/Media_Library__wpdev__WordPress_2017-03-21_10-44-01.jpg

#5 @karmatosed
3 years ago

  • Keywords reporter-feedback removed

Looks great to me. Are we good to get a commit? Thanks @abhishekfdd and @adamsilverstein.

#6 @karmatosed
3 years ago

  • Keywords commit added

#7 @adamsilverstein
3 years ago

  • Owner set to adamsilverstein
  • Resolution set to fixed
  • Status changed from new to closed

In 40792:

Media: make search input full width on mobile.

Props abhishekfdd.
Fixes #40130.

#8 @ocean90
3 years ago

  • Milestone changed from Awaiting Review to 4.8

#9 @adamsilverstein
3 years ago

In 40840:

Plugins: fix regression in search input field size.

Fix a formatting regression introduced in [40792] which attempted to resize the input for mobile, see #40130.

Props leemon, juhise, voldemortensen.
Fixes #40857.

#10 @adamsilverstein
3 years ago

  • Keywords needs-patch added; has-patch has-screenshots commit removed
  • Milestone changed from 4.8 to Future Release
  • Resolution fixed deleted
  • Status changed from closed to reopened

@karmatosed & @abhishekfdd - We had to revert this change in [40840] because of unintended side effects. Reopening for 4.9, this still seems like a good idea if we can get the targeting right.

#11 follow-up: @karmatosed
3 years ago

@adamsilverstein any information more on what this impacted so we can avoid that? Could we get an update on this ticket?

#12 in reply to: ↑ 11 @adamsilverstein
3 years ago

Replying to karmatosed:

@adamsilverstein any information more on what this impacted so we can avoid that? Could we get an update on this ticket?

The plugin search bar is mentioned on the other ticket- #40857, not sure if other areas were affected.

Version 0, edited 3 years ago by adamsilverstein (next)

@m1tk00
3 years ago

Attached the css for the form in the media query for mobile devices only.

#13 @allisonplus
3 years ago

  • Keywords has-patch needs-testing added; needs-patch removed

@viralsampat
3 years ago

Fixed

This ticket was mentioned in Slack in #core by viralsampat. View the logs.


3 years ago

#15 @adamsilverstein
8 months ago

  • Milestone changed from Future Release to 5.3

This ticket was mentioned in Slack in #core by sergey. View the logs.


8 months ago

#17 @adamsilverstein
6 months ago

@viralsampat Why did you add a bottom border in your patch?

#18 @adamsilverstein
6 months ago

  • Keywords commit added

40130.2.patch works well in my testing, planning to commit that.

#19 @adamsilverstein
6 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 46207:

Media: make search input full width on mobile. Take two.

Props m1tk00.
Fixes #40130.

#20 @johnbillion
6 months ago

  • Keywords needs-screenshots added

@adamsilverstein Can we get a screenshot of this change please?

#21 @adamsilverstein
6 months ago

  • Keywords has-screenshots added; needs-screenshots removed

@johnbillion added one: note the search box is full width.

Note: See TracTickets for help on using tickets.