On mobile, plugin menu occludes content

pr-welcome

(Barry van Oudtshoorn) #1

This is, of course, not a huge issue; I understand that using advanced plugins on a phone is likely not the best idea. :wink:

This is on a pinned-to-home Chrome tab on a Sony Xperia Z5 Premium (inhale) with the display scaling tweaked to have a lower dppx ratio; not sure of CSS pixel dimensions, sorry.


(cpradio) #2

The admin area isn’t mobile friendly and is really meant to only be utilized via desktop/tablet.


(Jeff Atwood) #3

With the exception of flag handling which should work well on mobile.


(Sam Saffron) #4

I am putting a #pr-welcome on this in case anyone feels like improving the mobile admin stylesheet.


(Barry van Oudtshoorn) #5

I’ve not had a chance to put together a PR for this, but I’ve fixed it on my own site with custom CSS for now:

.admin-nav {
    position: static;
    float: none;
    width: 100%;
    font-size: 80%;
    margin: 0;
}

.admin-nav .nav-stacked {
    display: flex;
    flex-wrap: wrap;
}

.nav-stacked li {
    padding: 0;
    margin: 0;
}

.nav-stacked li a {
    padding: 5px 10px;
    font-size: 100%;
    line-height: auto;
}

.nav-stacked .active > a::after, .nav-stacked li > a.active::after {
    content: none;
}

.admin-detail {
    padding: 0;
}

…which produces something like this: