Admin Facelift. Take 3

Logoleptic · 2006-08-22 19:09:27

Another bit of info on the matter of a built-in Txp JS library (which should maybe be its own thread): I just read that jQuery is “<a href=“http://drupal.org/node/79481”>poised for inclusion in Drupal core</a>.”

Personally, I’m partial to the libraries produced by Mad4Milk (moo.fx, moo.dom, and moo.ajax). I don’t know if they have everything other Txp designers and developers would want or need, but the M4M guys have recently used them to build a web-based widget framework called Mooglets. If it can do that…

Ace of Dubs · 2006-08-22 23:08:51

rloaderro wrote:

Checking out this latest design, I think I liked where you were going earlier. This one seems to suffer from the same problem as the current design – there are 2 levels of navigation but the weight of the tabs looks the same

The older design you refer to is still in the works as an option. Right now I am trying to figure out how the admin can dynamically spit out different html layouts for the admin. (Switching to full side navigation is outside the scope of CSS.)

I would also recommend putting a “prefs” next to the “logout” since the only other way for a non-admin-priv user to change their pass or email would be via the missing popup menu

Will do

Last edited by Ace of Dubs (2006-08-22 23:09:07)

Mary · 2006-08-23 00:44:57

Right now I am trying to figure out how the admin can dynamically spit out different html layouts for the admin.

That would not be in the realm of an admin theme, by the way.

(Switching to full side navigation is outside the scope of CSS.)

Actually, no, it’s not.

Ace of Dubs · 2006-08-23 10:46:42

So what would you recommend, Mary? I was originally considering both top and side navigation in the html template and perhaps switching visibility on and off for each one. This works great with compliant browsers, but IE and friends dont always play nice.

I would be open to any suggestions

PS- thanks for the svn info :)

rloaderro · 2006-08-23 17:31:15

Ace of Dubs wrote:

So what would you recommend, Mary? I was originally considering both top and side navigation in the html template and perhaps switching visibility on and off for each one. This works great with compliant browsers, but IE and friends dont always play nice.

Yeah, I guess I agree with Mary – positioning elements on the page – whether it’s side or top based navigation – shouldn’t be an issue with CSS. It might be an issue if the elements themselves were dependant on the theme – ie side-based navigation displayed different information then top-based. But even then if there are enough hooks in the HTML it should be possible to show / hide different information using the stylesheet too. The issue is the semantic markup that you’ve mentioned before. Actually the HTML part of it is not hard: headings are h1s, h2s, important text is strong, etc.. The tricky part is coming up with a semantic naming convention for TXP for all those bits that aren’t defined in HTML. We’re not the only ones to run into this problem either:

What’s In A Name
Naming Conventions Table
Elemental Nomenclature

It basically comes down to choosing a style and sticking with it. Are we calling it a “sidebar” or “secondary-content” or “contSec” or whatever – otherwise it gets confusing (the current textpattern stylesheet gets my head spinning with “input.smallbox”, “input.smallerbox”, “input.smallerboxsp” etc..).

Mary · 2006-08-23 23:43:15

So what would you recommend, Mary?

That’s not a question I can answer – I can’t read minds. :) I have no idea what your markup or css looks like, nor your approach or experience. All I can say is that almost anything is possible with pure CSS with the right markup behind it, and that you’ll be effectively wasting your time until that part is finished. Best to stick to concepts via “storyboarding” with Photoshop (or whatever graphic program available to you) until then. Crockery is almost identical to the dev branch at the moment, but it will not be remaining so for long.

Last edited by Mary (2006-08-23 23:43:33)

Ace of Dubs · 2006-08-25 11:18:47

Mary wrote

That’s not a question I can answer – I can’t read minds.

What?! That’s it… you’re fired! Oh and don’t forget to finish off Crockery and it’s subsequent updates before you pack your things ;)

almost anything is possible with pure CSS with the right markup behind it.

Very true, but in this case I think we are playing outside the “almost” zone. For example:

On the top nav, both levels are active links. But on the side nav, only the subcategories are active (since they are all visible)… their parent tabs should simply be headers. Also, we have discussed the problem of the extension and plugin tabs and the very real possibility of their subcategories getting too long. Both of them would be have to be listed under a new heading called “extras” or “add-ons”

Right now I can only dream up 2 solutions:

1. Include both menus in the actual html and simply toggle the visibility for each with CSS. OK..its not the most semantic solution in the world but it would be the easiest/fastest way.

2. Build an admin-side plugin which dynamically spits out the desired html according to user prefs. We already have hpw_admincss plug, which perhaps could be expanded on to include this feature… I’m not sure.

Ultimately I agree that this is still in its infancy stage and for now we have to settle for visual comps. But I am glad we are all putting our heads together here and I think this collective effort will result in one of the leanest and meanest GUIs out there..

Keep the feedback coming!

Mary · 2006-08-26 01:19:39

Lists are going to be used, which you can do just about anything with. There will also be an “active” class applied to whatever area and tab you’re in. As I said: best to wait and see what you’ve got to work with first. :)

phiw13 · 2006-08-27 03:46:42

@ Ace of Dubs
The modified txp interface I made for TXP 4.03 uses lists for the tabs, and basically still works on the latest rev from SVN. That stylesheet needs some tweaks, of course. Contact if you want the thing up to date (not available for public release yet, and the stylesheet only works correctly in the latest Gecko trunk builds, because that is what I use), and play with it.
Obviously I have no idea what the code in Crockery will look like :-)

Ace of Dubs · 2006-09-26 13:10:32

@phiw13

You’ve got mail, buddy :)

Mary wrote:

Lists are going to be used, which you can do just about anything with. There will also be an “active” class applied to whatever area and tab you’re in. As I said: best to wait and see what you’ve got to work with first. :)

I hear you, which is why I havent posted any new stuff in a while (that and work is crazy right now) At the same time I feel we should not lose sight of the fact that this whole design challenge is a bit of a chicken/egg conundrum and I just hope some of the ideas brought up in this thread (especially ones dealing more with the structure of content than design) will help push crockery in the right direction. Admitedly I still havent got crockery running as time has not permitted. Will try to do this as soon as I can as it will help me push the envelope a bit more.

In the meantime, here is the latest tweak, incorporating some of the cool stuff you have going on in your thread…

hazel · 2006-09-26 18:33:49

The only real visual difference in crockery at the moment is the controls being wrapped in form/legend tags

—-

I did a quick paintjob of the admin (using the modified files from phiw13 / Mary) for a customer’s site

Ace of Dubs · 2006-09-26 19:05:40

Nice work there hazel… digging the limey freshness of the colors for sure, and the “Article posted” notice is a nice touch.

I’m not sure where the chips will fall in terms of organization however and though it seems most TXP vets favor tab-less side navigation I’d love to hear more feedback on how we can restructure what’s on the actual pages to make the admin faster and simpler to use, (moreso than suggestions for a skin.)

Still.. kudos to you for actually getting your hands dirty with a lovely working example. I been way too lazy to poke through the code myself… shame on me! :(

Textpattern CMS

Textpattern CMS support forum

#145 2006-08-22 19:09:27

Re: Admin Facelift. Take 3

#146 2006-08-22 23:08:51

Re: Admin Facelift. Take 3

#147 2006-08-23 00:44:57

Re: Admin Facelift. Take 3

#148 2006-08-23 10:46:42

Re: Admin Facelift. Take 3

#149 2006-08-23 17:31:15

Re: Admin Facelift. Take 3

#150 2006-08-23 23:43:15

Re: Admin Facelift. Take 3

#151 2006-08-25 11:18:47

Re: Admin Facelift. Take 3

#152 2006-08-26 01:19:39

Re: Admin Facelift. Take 3

#153 2006-08-27 03:46:42

Re: Admin Facelift. Take 3

#154 2006-09-26 13:10:32

Re: Admin Facelift. Take 3

#155 2006-09-26 18:33:49

Re: Admin Facelift. Take 3

#156 2006-09-26 19:05:40

Re: Admin Facelift. Take 3

Board footer