ryan Posted March 7 Share Posted March 7 Work continues on the new processwire.com website. I’ve nearly finished developing most of the modules directory this week and next week will be working on the development side of the API reference and sites directory. Some more good news to share is that when the new site launches, the new admin look and feel will launch as well. The website and admin share a similar design language in some areas, and I’m confident you will love them both. When we use screenshots of ProcessWire in the new site design, they will be from the new admin look and feel. It is still admin AdminThemeUikit, but with a new face that is beautiful, modern and professionally designed. I’ve been using for more than a week and it’s fantastic in my opinion. If for some reason you end up wanting to keep the current look of AdminThemeUikit (perhaps a client doesn’t like change), it will remain as an option too. If you are extending AdminThemeUikit or using the admin.less feature (developed by Bernhard) to custom style the admin, all of that will continue working too. What will likely be changing is that we’ll be moving the older AdminThemeDefault and AdminThemeReno out of the core and into the modules directory. I’d rather keep the core efforts focused with AdminThemeUikit, but continue to support the older admin themes as installable options. Prior to this, most of what you’d seen in ProcessWire’s core admin and website has been designed by me (excluding AdminThemeReno). And I haven’t worked full time as a designer since 2005 or so. If I ever had any site design skills, they are long gone. So PW has always had a “designed by a developer” look. Having professional designers take over the design of both the admin and the website just feels like a major upgrade to ProcessWire all around. More than I could have guessed. I look forward to when I can share the new site design, admin look and feel, and the designers with you. Thanks for reading and have a great weekend! 23 3 Link to comment Share on other sites More sharing options...
wbmnfktr Posted March 7 Share Posted March 7 On 3/7/2025 at 10:07 PM, ryan said: always had a “designed by a developer” look Expand ... but it feels like home. 6 Link to comment Share on other sites More sharing options...
ryan Posted March 7 Author Share Posted March 7 Quote ... but it feels like home. Expand @wbmnfktr It's funny that you say that, because this is exactly what I told the designers the first time I saw what they did with the admin theme. I told them that what they did with ProcessWire feels like home. Not just home, but a nicer and more modern home. 🙂 3 1 Link to comment Share on other sites More sharing options...
FireWire Posted March 7 Share Posted March 7 Boy howdy, I'm pretty excited to see this. 3 Link to comment Share on other sites More sharing options...
teppo Posted March 8 Share Posted March 8 Hey Ryan! First of all, this all sounds very promising. In my humble opinion you are vastly underplaying your own skill in terms of design, but that's also why we can trust that you'll recognize amazing design once you see it. Looking forward to seeing what the team working on the design has cooked up 😉 Now, please forgive me for jumping directly into asking for stuff, but... I know this is small thing, but it would be quite nice if the new admin made use of CSS variables wherever it makes sense; colors, font sizing, etc. (Or provided them as an alternative for non-core tools to use, in case it is not feasible to use them for actual admin styling.) The reason I'm saying this is that I've built various admin tools that I wanted to look like the admin theme, and since there is (to my knowledge) currently no simple way to access existing colors etc. in CSS, any non-Uikit elements I've had to "hard-code" to use current styles. This includes the default green/cyan/blue color theme, current spacing and font size practices, etc. As a result said custom elements may look out of place once the theme is updated 🙂 (Just for the record: SCSS/LESS might be an option, but that feels like a lot of unnecessary overhead and complexity where vanilla CSS would easily suffice. I'd really like to avoid that if possible, and to me it seems like CSS variables are an easy and well supported alternative.) Additionally: it would be awesome if accessibility was a consideration while creating this new admin theme. I know it has been considered to a point in the past, but has never been a major goal. Hopefully we can push things forward in this regard in the future. If there's something I can help, I'd be happy to 🙏 16 1 Link to comment Share on other sites More sharing options...
FireWire Posted March 8 Share Posted March 8 On 3/8/2025 at 8:04 AM, teppo said: new admin made use of CSS variables Expand I think this approach is an excellent idea and hopefully something that will be considered. In addition to the benefits @teppo described, using CSS really open things up for JS as well where getting/setting values via scripts could make admin development very dynamic. Laying some future friendly groundwork in CSS would be a major advancement. 7 Link to comment Share on other sites More sharing options...
ryan Posted March 11 Author Share Posted March 11 @teppo Thanks and good ideas. CSS variables sound good to me too. But want to mention that this isn't a new admin theme, this is AdminThemeUikit with an improved look and feel. There isn't any change to the underlying markup or CSS structure. The AdminThemeUikit CSS is still present so folks can still use the original look too. Longer term maybe we'll do a whole new admin theme. This does actually feel like a new admin theme when you use it, even if it's technically not. 5 Link to comment Share on other sites More sharing options...
FireWire Posted March 11 Share Posted March 11 @ryan Makes sense. Really looking forward to seeing what y'all been cooking up! I paused the other day and appreciated all the quality of life improvements that have come over the years and value them as much as the big features. Almost can't wait. It's like Christmas for adults, who are also developers. 5 Link to comment Share on other sites More sharing options...
bernhard Posted March 11 Share Posted March 11 There is a long open issue for UIkit to support CSS variables but unfortunately there seem to be no efforts in that direction: https://github.com/uikit/uikit/issues/4534 3 Link to comment Share on other sites More sharing options...
Pixrael Posted Wednesday at 02:48 PM Share Posted Wednesday at 02:48 PM Great news! @ryan, for a completely new admin project, might you consider using HTMX, or something similar? It's perfect for PHP. I've used it on a large admin project, and it works wonders with ProcessWire. I also use these libraries to complete the package: https://github.com/gnat/css-scope-inline https://github.com/gnat/surreal 5 Link to comment Share on other sites More sharing options...
teppo Posted Thursday at 08:39 PM Share Posted Thursday at 08:39 PM On 3/11/2025 at 6:36 PM, ryan said: But want to mention that this isn't a new admin theme, this is AdminThemeUikit with an improved look and feel. There isn't any change to the underlying markup or CSS structure. Expand Thanks for the clarification! Still hoping that we can make some minor improvements, though. Loosely related, but I'm not sure if you've noticed that there is a are a couple of comments related to one recent admin change 🙂 On 3/11/2025 at 9:34 PM, bernhard said: There is a long open issue for UIkit to support CSS variables but unfortunately there seem to be no efforts in that direction: https://github.com/uikit/uikit/issues/4534 Expand That sounds a bit disheartening. I've never actually built anything from scratch with Uikit so I'm not too familiar with its structure, and I must admit that digging into AdminThemeUikit just now made my head spin, but it looks like variables are defined mostly in one place. Is that right, and if so, would it be an option to set those based on CSS variables? That might not work with — or rather stay in sync with — custom admin styles, though. Of course there's always the option of somehow duplicating LESS variables to CSS variables. This way they could at least be used in modules etc. 2 Link to comment Share on other sites More sharing options...
AndZyk Posted Friday at 12:58 PM Share Posted Friday at 12:58 PM On 3/11/2025 at 9:34 PM, bernhard said: There is a long open issue for UIkit to support CSS variables but unfortunately there seem to be no efforts in that direction: https://github.com/uikit/uikit/issues/4534 Expand I guess that YOOtheme probably will implement CSS variables with UIkit 4. Here is an open issue for ideas and suggestions for UIkit 4: https://github.com/uikit/uikit/issues/3967 On 3/13/2025 at 8:39 PM, teppo said: I've never actually built anything from scratch with Uikit so I'm not too familiar with its structure, and I must admit that digging into AdminThemeUikit just now made my head spin, but it looks like variables are defined mostly in one place. Is that right, and if so, would it be an option to set those based on CSS variables? Expand Yes, there is one partial file for variables, but I don't think you can easily change every variable to a CSS variable. Some variables use for example darken() and lighten() which I think don't work with CSS variables. I have tried it once, for some variables it is possible but for most not. One simple enhancement I mentioned several times over the years would be to include the CSS source map in the AdminTheme. But it seems that I am only one with this wish. 😅 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now