In dropbutton.base.css we have:

@media screen and (max-width:600px) {
  .js .dropbutton-wrapper {
    width: 100%;
  }
}

At least for this:

button-wide.png

This clobbers the dropbuttons of views ui at < that width:

views-dropbutton-before.png

After the patch coming up:

views-dropbutton-after.png

CommentFileSizeAuthor
#5 views-dropbutton-1925748-before1.png31 KBandymartha
#5 views-dropbutton-1925748-before2.png31 KBandymartha
#5 views-dropbutton-1925748-after.png33.83 KBandymartha
#5 views-dropbutton-1925748-after2.png35.33 KBandymartha
#1 views-dropbutton-1925748.patch422 bytesechoz
views-dropbutton-after.png53.22 KBechoz
views-dropbutton-before.png44.31 KBechoz
button-wide.png24.46 KBechoz

Comments

echoz’s picture

echoz commented
Status: Active » Needs review
StatusFileSize
new views-dropbutton-1925748.patch422 bytes
dawehner’s picture

dawehner
Primary language German
commented

The screenshots are looking pretty good, though I have no clue about whether that css is the proper fix :)

echoz’s picture

echoz commented
Component: CSS » views_ui.module
echoz’s picture

echoz commented

Alternatively, rather than overriding in views-admin.css, in dropbutton.base.css, we could target only where needed, thereby excluding views_ui.

We could do - .js .node-form .dropbutton-wrapper - which targets the node create/edit screen as shown in the first screenshot. This would be smarter keeping it in dropbutton.base.css. Can anyone report if it's used elsewhere?

andymartha’s picture

andymartha commented
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new views-dropbutton-1925748-after2.png35.33 KB
new views-dropbutton-1925748-after.png33.83 KB
new views-dropbutton-1925748-before2.png31 KB
new views-dropbutton-1925748-before1.png31 KB

In a fresh installation of Drupal 8.x-dv on March 6, 2013, the views-dropbutton-1925748.patch fixed the mobile problem on IOS and in Google Chrome and Firefox on the desktop (screen resize). See attached screenshots.

I want a little time maybe tonight to further investigate this on Android and echoz's comments because I like mobile.

damiankloip’s picture

damiankloip commented

Yeah this certainly looks better, anyone who wants to edit a view on a mobile is surely crazy though.

webchick’s picture

webchick
she/they
Primary language English
Location Vancouver 🇨🇦
commented
Status: Reviewed & tested by the community » Fixed

Wow, that is much better indeed. :D

Committed to 8.x, thanks! I'll push once testbot has caught up a bit.

Automatically closed -- issue fixed for 2 weeks with no activity.