Use reusable consistent CSS for the theme and plugin uploader

[paulwilde]

The theme uploader introduced a new look in 3.8. This patch gives the file upload container a more generic reusable class and I've added it to plugin upload for consistency between the views.

[melchoyce]

Looks good! Related, we should think about making the header area consistent between theme and plugin uploading as well: ​https://cloudup.com/ilT84tTVWSv

[paulwilde]

Indeed, was thinking the same. The Media Library could also have it too with it's multi-upload specific UI.

[paulwilde]

28753.3.diff does the following:

• Use the same consistent styling between the theme/plugin uploaders.
• Removes the "Upload" tab and move it beside the title. Clicking the title button will toggle the upload frame on any of the tabs you are currently viewing.
• Removes plugin-install.js in favour of plugin.js.
• plugin.js includes the code previously in plugin-install.js and the Backbone to handle routing/toggling the upload button. I've never used backbone before so this code might be a little off. Ideally it would be nice if there was a base controller that theme.js and plugin.js could extend so that both can share the same functionality without having duplicated code.

[michalzuber]

Nice work paulwilde. Would be good to unify the Media uploaders, too. Currently they have different design

[michalzuber]

Rewrite of 28753.3.diff, didn't move plugin-install.js to plugin.js

[michalzuber]

Rewrote paulwilde's diff, thank you paulwilde.
Results ​http://i.imgur.com/Y8LqW8s.png & ​http://i.imgur.com/P6HziVc.png

[michalzuber]

Fixed Uncaught ReferenceError: _wpPluginSettings is not defined plugin-install.js?ver=4.0-beta1-src:10

[helen]

We can do the styling part from the first patch - no Backbone explorations right now, please. I also don't love that we do a display: block on something with "hidden" in the class name. Would rather toggle something else.

[michalzuber]

Changed only the design of Install plugins for current trunk

[michalzuber]

Replying to helen:

We can do the styling part from the first patch - no Backbone explorations right now, please. I also don't love that we do a display: block on something with "hidden" in the class name. Would rather toggle something else.

Updated 28753.6.diff.
Helen I need feedback about adding filter bar above the upload form in Add themes ​http://i.imgur.com/Y689NpO.png as Install Plugins have ​http://i.imgur.com/IwydnwA.png

[helen]

Replying to michalzuber:

I need feedback about adding filter bar above the upload form in Add themes

No opinion right now. Don't really want to touch it for 4.0.

Patch looks incomplete - doesn't remove the original CSS, doesn't alter markup for themes. I just don't want to dabble in Backbone for plugins. Also note that we put a newline above each ruleset in CSS - there are some inconsistencies, particularly in themes.css, so I can see why they get left out in people's patches sometimes.

[paulwilde]

drawer-grouping-2.diff:

• Renames 'wp-filter-group-wide' to 'wp-filter-group-2-5' to be more understandable as a grid column. Also added 1-5, 3-5 and 4-5.
• Utilises calc to ensure that the groups have consistent spacing rather than having a bigger gap on the right side.

[paulwilde]

Opps. My above patch (drawer-grouping-2.diff) was meant for #28794. I've gone ahead of reposted it there.

upload.diff does the following different from my previous patch:

• Removes all the Backbone stuff.
• Uses .wp-upload-container-toggle instead of .wp-upload-container-hidden for the Themes uploader.

[michalzuber]

We could use ericlewis's code from https://core.trac.wordpress.org/ticket/28851

[ocean90]

28753-no-results.patch​ is ​https://cloudup.com/cfBCPZQUHUc

[ocean90]

In 29359:

Plugin install: Improve styling of the no results message.

see #28753.

[ocean90]

28753-upload-container.patch​ is build on upload.diff​. Additionally it hides .wp-filter on plugin upload screen and switches .add-new-h2 buttons, same as for themes.

[helen]

Latest patch causes some weirdness on the plugins upload screen. Also, I'm really not feeling the look of it. I know it comes from themes, but that doesn't make it an automatic okay to adopt across the admin.

[ocean90]

Fixes browse link on plugin uploader

[helen]

Punting. Really not loving the way the themes one is styled - we need to make a unified decision, not just unify around something. Design attention would be lovely.

[ocean90]

Related: [29634] – "Use the same nice design for the plugin upload screen as the theme upload screen."

[chriscct7]

Per comment:24

[afercia]

Related: #35429.

[melchoyce]

Can we get some screenshots of the latest patch on this?

[karmatosed]

This was talked about in this week's design triage meeting. For now, as screnshots were asked and none provided we are closing this. If we have screenshots then feedback can be given and it reopened.