UI Kit "Classic" Theme

[Peter Knight]

Playing around with the UIKit theme this morning and tweaking it.

It's called UIKit Classic and it's a nod to the Classic theme. 

For me the Classic theme always sticks in my mind as being most definitively Processwire-ey because

• It was my fist intro to PW
• I thought the colours were quite unique and like the mix of blue, pink and green. They're very distinctive and I'd hate for PW to look like just another WP install. In a crowded CMS marketplace I think it's good to differentiate visually.

The two screengrabs are just the same screen. A before and an after. 

I put this together using the Chrome the web inspect tool so there's no fancy mixins or LESS etc. Actually there's not even any CSS now that I've refreshed the page.

I do think there needs to be a detailed comprehensive through tutorial for people wishing to make their own themes. Probably 85% here don't need it and understand the directory structure and how it's all compiled but equally I think there's another 15% here with the design skills but not the tech chops to get this done. If we want designers to design themes then we need the process with screengrabs, list of software (I have CodeKit, Dreamweaver, Sublime etc).

Anywho - just my 2€ worth

 

The before shot below...

[abdus]

That looks great. Somewhere between Reno, Default and UIKit, I like it. 

2 minutes ago, Peter Knight said:

Actually there's not even any CSS now that I've refreshed the page.

Well, that sucks. But it looks like a simple mod, so it wouldn't take much time to rewrite.

[Peter Knight]

7 minutes ago, abdus said:

That looks great. Somewhere between Reno, Default and UIKit, I like it. 

Well, that sucks. But it looks like a simple mod, so it wouldn't take much time to rewrite.

It took me about 20 - 30 minutes so I imagine someone with the right skills wouldn't have an issue. The Colours are mainly inspected from another window with the original Classic theme open.

It's also just a preview. There's probably a ton of detail that would need to be considered. Modals, alerts, image thumbs etc etc etc. I had it easy doing a single screen.

[Mike Rockett]

Was thinking of doing something like this the other day, but couldn't find the time. I might still get into it soon - you never know.

Nice to see it outside of my imagination. ;-)

[Peter Knight]

2 hours ago, Mike Rockett said:

Was thinking of doing something like this the other day, but couldn't find the time. I might still get into it soon - you never know.

Nice to see it outside of my imagination. ;-)

Go for it. Looking forward to seeing more themes (and tutorials)

[adrian]

Looks like @ryan has just put together a "Reno" colored version of the UiKit theme: 
https://github.com/ryancramerdesign/AdminThemeUikit/commit/25b6ac173b868a47ab90430e1d30efd8701f7ca0 

Although I must admit that I would also like the version that @Peter Knight has shown above.

[Mike Rockett]

12 hours ago, adrian said:

Looks like @ryan has just put together a "Reno" colored version of the UiKit theme: 

Looks awesome! Though, it appears that, when I use a custom logo, a CSS filter makes it white. (filter: brightness(0) invert(1);) (Edit: issue opened)

[Peter Knight]

3 hours ago, adrian said:

Looks like @ryan has just put together a "Reno" colored version of the UiKit theme: 
https://github.com/ryancramerdesign/AdminThemeUikit/commit/25b6ac173b868a47ab90430e1d30efd8701f7ca0 

Although I must admit that I would also like the version that @Peter Knight has shown above.

If you or anyone else wants to make this happen, let me know. Possibly wait until I know Ryan's plans. I don't want to duplicate work or have several almost identical themes. ?

I can supply raw css. Just need someone who knows Git, Less and has time to collaborate etc. 

[ottogal]

22 hours ago, Peter Knight said:

For me the Classic theme always sticks in my mind as being most definitively Processwire-ey because

• It was my fist intro to PW
• I thought the colours were quite unique and like the mix of blue, pink and green. They're very distinctive and I'd hate for PW to look like just another WP install. In a crowded CMS marketplace I think it's good to differentiate visually.

I fully agree.

[abdus]

I guess @ryan agrees with @Peter Knight's vision. After latest commits, here's how the new UIKit theme looks:

[Peter Knight]

@abdus That Might be a hybrid theme or a version of the RenoTheme. Either way - love his implementation.

I was trying to figure out those little arrows on the drop down menus. Looks like Ryan has it in hand etc.

[MrSnoozles]

@Peter Knight I absolutely love the modifications you did. Looks super clean and unique. Thank you for that demo