New ProcessWire admin theme on dev branch

[Manfred62]

hmm, tried it. I have renamed the /site/templates-admin for the test. Updated PW and installed the module. But now all the translation strings from the top navigation and the headings are gone. Is there something missing? Do we have to create a new language file for the admin?

EDIT: ok, I got it. You need to create a new language file for: /wire/modules/AdminTheme/AdminThemeDefault/default.php

[Joss]

Nice one Ryan

Now all we need is to be able to select admin theme based on Role, so for some of my authors I can install one with

REALLY BIG INSTRUCTIONS!!!

[Soma]

Damn Joss you scared my dog away!

Let's see, in admin.php

if($user->hasRole("dumb")) {
    $config->styles->add($config->urls->templates . "styles/dumb.css");
}

[Joss]

sorry about the dog - mine is resilient to anything but the loudest of commands. And even then tends to look at you with a "why should I?" sort of pose.

http://www.pebblesthepuppy.co.uk/

By the way, what is the code for "Don't press that!!"

[renobird]

Hahaha!

[Manfred62]

another translation question for the new admin theme concept:

before the change we had to translate 2 files:

1. /wire/templates-admin/default.php (default)
2. /site/templates-admin/default.php (for all other themes)

now we have more files for translation?

1. /wire/templates-admin/default.php (the 'old' default)
2. /site/templates-admin/default.php (also can be used for other themes)
3. /wire/modules/AdminTheme/AdminThemeDefault/default.php (the new default)
4. /wire/modules/AdminTheme/AdminThemeDefault/functions.php (the new dropdown in new default)
5. /wire/modules/AdminTheme/AdminThemeSomething/default.php (the new 'other' themes as modules)

All files have the same content. This also means: every new theme (as module) needs a own path/file for translation??

Idea: is it possible to use only 1 admin-translation-file? Maybe create a global translation class? All themes should point to the same global file. So you can use/install whatever theme you like. Your translation will stay there.
 

[ryan]

I just posted an update to the admin theme that resolves the mobile responsive views, or any view that causes menu items to split on two lines. If the topnav menu items take up enough space to need two lines, it collapses them down to a hamburger: 

 

Likewise, if there are enough tabs in the page editor (or anywhere else) for them to wrap on two lines, it converts them from tabs to a more stable button appearance:

I've removed that "home" icon, and the "View Site" link now now contained in the Tools menu. However, when you hover the tools menu, it also becomes a View Site link, so you don't have to go through the menu to get to it unless you want to. 

 

Lastly, I've upgraded the entire system to FontAwesome 4 (and the associated fa-* classes rather than icon-* classes). Unfortunately they've change a lot of the icon names in FontAwesome 4, so it required a little more work than I expected. If you are using any icons for your templates or fields, it's possible they may have renamed ones you are using, so if you have any icons that stop working, you may need to update the icon name (reference). Most icons carry the same names and won't require any update though.

@Manfred62 Hold off on translating files just yet, as I'm still moving stuff around and will try and get the multi-language translation part simplified as much as possible. But I've not gotten to that part yet. 

[Manfred62]

under /setup/languages/edit/...

when delete a language file, the titlebar and the text collide together (see screenshot).

[DaveP]

Just been chasing my tail for a few minutes over new the admin theme.

Downloaded PW dev branch today and upgraded an existing live site, then tried to change the admin colour scheme per instructions in this thread, but to no avail. Eventually realised that the admin theme is now a module, even though wire/templates-admin still exists within the download. Turns out that PW was using this for the theme and only when I renamed it was I able to change colours (through the module).

[Manfred62]

@DaveP

after updating PW you have to install the module 'Default Admin Theme' in the module section. Then you can change the color scheme in the settings of this module.

The folder /wire/templates-admin can stay there. I think it contains the old classic style for the first installation. Only the /site/templates-admin isn't needed anymore.

[Manfred62]

that's nothing, but now I realized this 'lonely' wrench symbol on the right side of the login screen... Looks a little bit lost there.

Maybe it's possible to place the 'Site' link (with the eye) directly in the masthead, without any dropdown?

example:

[Soma]

Updated a install with latest version. Just noticed the top user pulldown with the wrench, the wrench icon it switches to an eye when I hover to open the pulldown.

[Soma]

Another thing I noticed with the UI dropdown menu. 

Hover over "Setup". It drops down. Now move the cursor fast over the first open menu item and right back up to the top menu item. The dropdown will stay hidden. This can be annoying. It looks like this is a timeout issue with this jquery menu. 

[Pete]

Updated a install with latest version. Just noticed the top user pulldown with the wrench, the wrench icon it switches to an eye when I hover to open the pulldown.

That's explained in this post: http://processwire.com/talk/topic/4650-new-processwire-admin-theme-on-dev-branch/page-13#entry50950 though I'm not sure it's intuitive and can be mistaken for a bug. Surely if the menu opens on hover there's little time saved making the wrench act as the View Site button as well?

[Soma]

That's explained in this post: http://processwire.com/talk/topic/4650-new-processwire-admin-theme-on-dev-branch/page-13#entry50950 though I'm not sure it's intuitive and can be mistaken for a bug. Surely if the menu opens on hover there's little time saved making the wrench act as the View Site button as well?

Ah I've read that but didn't get it! Surely over-engineering. Not a UI pattern that someone would recognize IMHO.

[Macrura]

with the new way the admin theme is structured as a module, it seems that if you are using the admin custom pages module, the module isn't aware of the locations of the new admin theme files, so it still uses the old default theme;

so i'm just wondering - how can I either switch the admin theme to the classic old theme, or has anyone figured out how to make the admin custom pages module work with the latest dev, using admin theme module..

TIA

[Manfred62]

so i'm just wondering - how can I either switch the admin theme to the classic old theme,

Maybe you can deinstall the new 'Default Admin Theme' under the module settings. Then PW will use the 'old' /wire/templates-admin/ theme.

[adrian]

Noticed an issue with the dropdowns and user permissions. I gave an non-superuser permission to administer users. The Access menu then appears, but nothing drops down from it, other than a small square - just a few pixels in size. The same thing actually happens when I add a "Tools" main menu item using diogo's Custom Admin Pages module. Again, the dropdown won't work unless the user is a superuser.

On an unrelated note, I think the new site link should open in a new tab by default so no-one will lose any unsaved edits.

[Macrura]

ooh - thanks Manfred62 - yeah let me see if i can uninstall that;

thing is that i do like the new admin theme etc.. but might need to wait for diogo to update the admin custom pages to work with this new setup!

[apeisa]

Gotta say that latest iteration looks, feels and works great! Also I love the themes as a modules thing.

[ryan]

Noticed an issue with the dropdowns and user permissions. I gave an non-superuser permission to administer users. The Access menu then appears, but nothing drops down from it, other than a small square - just a few pixels in size. The same thing actually happens when I add a "Tools" main menu item using diogo's Custom Admin Pages module. Again, the dropdown won't work unless the user is a superuser.

While I can't duplicate the small square, I do see that the dropdowns aren't showing for a user with the permissions you mentioned. I've fixed it and it'll appear in the next update. Thanks!

On an unrelated note, I think the new site link should open in a new tab by default so no-one will lose any unsaved edits.

I honestly don't agree, and really don't like sites/apps opening new windows/tabs for me (that's what option+click is for). But you aren't the first person to mention it, so I'll try to accommodate both preferences somehow or another. 

[adrian]

Hey Ryan - the small square isn't all the time and I think it may not be happening with more recent dev versions now that the background on the dropdowns is solid and there isn't a border property? Doesn't matter anyway now that you've fixed the permissions

I agree with you in principle that generally sites shouldn't open new tabs/windows, but I think users have come to expect that links to external sites and internal links that can break a form submission will be in a new tab/window. Maybe it isn't critical in this case since it is a backend link and even content authors should be able to get used to it. 

[teppo]

I honestly don't agree, and really don't like sites/apps opening new windows/tabs for me (that's what option+click is for). But you aren't the first person to mention it, so I'll try to accommodate both preferences somehow or another. 

I agree with you in principle that generally sites shouldn't open new tabs/windows, but I think users have come to expect that links to external sites and internal links that can break a form submission will be in a new tab/window. Maybe it isn't critical in this case since it is a backend link and even content authors should be able to get used to it. 

I'm *not* a fan of anyone deciding for me whether or not a link opens in new window / tab, but this is the one case where it might make sense. I'm not too fond of the "even content authors should be able to get used to it" explanation either, partly because I myself keep forgetting it..

Form Save Reminder helps a lot with this issue, though. As a matter of fact it's one of those 3rd party modules I think should definitely be baked into core and even enabled by default.

By the way, Ryan, this is probably wrong place and time for this, but were you aware that modules directory is currently doing exactly the opposite of this? Module links are catching mouse middle button clicks and redirecting, effectively overriding commonly used setup where middle click opens link in a new tab. (It's driving me nuts, another quirk I just can't seem to memorize..)

[Soma]

Thx teppo. I'm not saying anything anymore.

[Pete]

When people say option+click are they talking command + click on a Mac? Not sure about other PC users but I always just right-click and select open in new tab... but then again I'm probably the only one still living in the 90's and not using that shortcut.

Y'know, the forum software does allow you to create topics with polls so it might be a good way to gauge people's reactions to things like this. Trouble is I know things like this seem trivial when coding (been there myself) so it never seems that big of a deal at the time but afterwards everyone has an opinion - which is fine of course, just sometimes unexpected