Jump to content
bcartier

Subtle Admin Theme

Recommended Posts

I've been working on a version of the core theme based on some proposals in the forums on a new processwire.com design. It's entirely derived from the default theme and inspired by ideas around a new ProcessWire look and feel. 

I wanted something that I'd be proud to show clients,  and something that could draw developers to ProcessWire who might have been turned off by the default admin UI.

This was created by working from the default theme, and developed organically over time. It's not coded in the most efficient way, but I hope it's useful for some of you. I'd love to see a cleaner look in the default theme. Ryan, if you see anything you like, please steal it!  Likewise if you see anything you think could be improved,  I'm all ears. 

-Brent

 

 

01-tree.jpg

02-page-edit-matrix.jpg

03-fields.jpg

04-lister.jpg

AdminThemeSubtle.zip

  • Like 13

Share this post


Link to post
Share on other sites

My main issue with any of the themes is usually colors. I'm using classic now and do some inspecting and CSS search and replace if it changes. Used Reno for a while but classic is always in sync with the latest features.

If it was just for me I'd tone down the shocking pink and use a more natural green but currently I'm only making the selected tab's edges 10% darker and field separation lines 3% darker. With the default colors one client, new to Processwire, did not perceive the page editor tabs (content, children...) as tabs.

Share this post


Link to post
Share on other sites

My main focus was to reducing visual clutter and to add whitespace to help convey hierarchy, grouping and meaning of elements. 

I'd like to extend this theme to prove several colour combinations (like AdminThemeDefault does). I went with this colour scheme hoping it might tie in nicely with the proposed redesign of the processwire.com website  (especially the dark concepts)

  • Like 1

Share this post


Link to post
Share on other sites

I liked it very much, @bcartier! Great job!

One thing I'd like to suggest is to check the contrast ration between the light gray texts (tree items and breadcrumbs) and their background. Some people may find it harder to read.

Edit: also check the menu links' contrast as well. :)

Share this post


Link to post
Share on other sites

I've just tried this on 2.8, but it appears the module doesn't work. I get the following error:

Configurable module check failed for AdminThemeSubtle, retrying...

 

Share this post


Link to post
Share on other sites

Sorry Mike - I built it based on v3. I'll see if I can get it working for 2.8...

Share this post


Link to post
Share on other sites

Interesting - I wonder what could cause it to throw an error as the only realy difference between 2.8 and 3.0 is namespace support...

Share this post


Link to post
Share on other sites

To get it to work in 2.8, the "namespace ProcessWire;" at the top of each file needs to be removed.

The configurable module check error is thrown because the module doesn't have a getModuleConfigInputfields method. ",ConfigurableModule" needs to be removed from the implements declaration.

After those two steps, it works fine in 2.8 (albeit with the missing fonts issue Mike mentioned).

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By DanielKit
      Hi. I'm currently stuck at the login page in my project. Once I enter my admin username and my password and press login, nothing happens. The page just reloads. However, the URL changes from http://myipaddress/processwire to http://myipaddress/processwire/?login=1. I've checked all of my server settings, and to my knowledge, all seems to be fine there. I don't know where to go from here.. Thanks in advance!
    • By modifiedcontent
      Small annoyance: I get a horizontal scrollbar in UIkit admin area - or actually Admin Theme Boss based on Uikit 3. I tried to fix it with CSS, but had trouble isolating/targeting it and don't want to mess with module or core files. I think this issue has been reported before. Is there a recommended fix? 
    • By Pip
      Hi everyone, 
      Is there a way for us to replicate the "http://mydomain.com/processwire/page/edit/?id=xxx" and change the template to match my site template? 
      I'm terribly happy with the admin / backend page edit. It covers literaly everything I want to empower my non super admin user in updating pages such as validation, repeater management, file upload. 
      I wish not to allow the users to see the backend for both security and aesthetic reasons. 
      Thanks and hope to hear from you soon. 
       
    • By codevark
      The Minimal Site works fine, but if I try to login as admin, I have no idea what the credentials are.
      I did not do the "install" process myself. The OVA came with everything set up, but there's no mention of the PW admin credentials being set to some initial value.
      Wondering if anyone else has tried the Bitnami OVA and if there's a simple answer.
      --Pete
    • By vwatson
      I don't have any fontawesome icons in the admin section. Not sure what's wrong. They used to appear. I've tried all the user profiles and they're gone in all of them.
      Using the browser inspector tool, I see this message:
      Access to font at 'https://www.domain.com/wire/templates-admin/styles/font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0' from origin 'http://domain.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
      I'm not sure why this is occurring or how to fix it. Any help would be greatly appreciated. 
×
×
  • Create New...