I've read about it. I've talked about it. I've thought about it (a lot). But now I thought I'd just do it. So I went through the page template, ripped out the tables and wrapped everything in divs, dropped some position settings in the stylesheet, moved the main content up top to load first, and here it is.
It's not too pretty yet, but hey, I did it in a half hour. I'll polish it and get the margins right, maybe add some graphics. I haven't had a chance to put stylus to pad yet. In fact my new WACOM pad is some 6 weeks old now and I've hardly touched it, thanks to my most-uncooperative back, so I'll probably do the mouse thing, which is much more familiar to me, anyway, despite the theoretical limitations.
And so far I've left a lot of extra garbage in the templates and css files. I'd be more tidy, but I've been busy working on the site plan for a major community site (to be announced on the web design site) and a proposal for a robust non-profit site, and that leaves a little blogging time, here and elsewhere, and some selfish reclusive indulgence time reading The Da Vinci Code.
Besides, I plan on keeping this site pretty simple, so hopefully I won't get lost in tangent land and wind up with a dog pile of text all in one corner of the screen. And once I get ahead of the curve on those websites, and caught up on the big DVD project that has outgrown its intention, I'll really clean up the code and submit the theme to Drupal.
Anyway, if you see a glitch, shoot me a note. Constructive feedback is most welcome.
Comments
Hi there,
I saw your post on Planet Drupal, and thought I'd have a look at your CSS-only implementation of Drupal. It looks very good - accessibility is often overlooked by people in favour of a 'nice looking site', but even before yours is finished it looks very polished! :)
I'm sure you just haven't got there yet - but a little thought on how the pages print is useful, as the current three-column layout results in quite a lot of wasted space when printed - especially if you feel that some columns are not relevant for printing anyway.
I've done a very simple two-column drupal theme for my own website which I'm rather proud of - although it's not perfect yet. Let me know what you think and I'll keep an eye on this one to pick up a few tips!
Happy designing!
Thanks, Alex! I guess I should drop in the print module to create printer-friendly pages. (That strips the sidebars and decodes the html links.)
I appreciate the comment -- the first one here!
Nice. I'm actually surprised that you haven't tried it before. You seem to be a curious cookie :)
I'm trying to do a similar thing - a simple, minimalistic design, using only css + a few tricks but I have a few gremlins left to sort out. It depends what one wants to achieve in the end.
I like the colour scheme and the node/post layout. Is there a particular reason why you use a different layout for lists, or it is just browser dependent (FF here)?
I'm not a big fan of the feed + trackers blocks personally, but that is a matter of taste.
Using monospace fonts is back! That's official. As we were talking recently with a friend of mine in a cafe - the geeks shall inherit the earth, and monospace is a sign of that. You never loose your terminal habits. (myself included) I wonder though if some of the font sizes are not too small. It depends whom you target, of course, but looking as it is at the moment people will have problems reading the help texts/descriptions in forms etc...
I had a look at tour css file and I'm really curious if how do you tackle the admin tables problem. When tables start overlapping with the right handside menus. I haven't found a decent solution myself. That is a solution that allows me to have a right hand side column with blocks and not having overlapping tables. The overflow method is ok-is, but apparently it breaks "tab" scrolling, which is bad for accessibility.
Good luck in your styling.
I'm actually typing this response in a different theme (also CSS-only) that's far too ugly for prime time as yet, and it uses verdana, which is my on-screen favorite, I confess.
I'm not sure what you mean by a different layout for the lists, unless you mean the sidebars. That's just a personal preference for this site, for right now. The lists themselves are pretty much default Drupal.
I've found that the fonts can vary widely from browser to browser, which makes it hard enough to style just for my own taste, let alone everyone else. What I should probably just do is add a font sizing module.
As for the admin tables, I created a separate theme for the admin functions, and stacked the sidebars on top of each other. I'd like to clean up those admin screens so they don't push so far horizontally, but I understand that the admin area is getting a revamping, so I'm going to hold off on that until 4.7 is out ... and then I'll get cracking.
And once I get something decent figured out for this site, I'll bundle a form of it and contribute it to the Drupal community.
>I'm not sure what you mean by a different layout for the lists, unless
>you mean the sidebars. That's just a personal preference for this site,
>for right now. The lists themselves are pretty much default Drupal.
Sorry, I've put a screenshot on flickr to illustrate it. I meant the node title alignments. I admit that I like how it sits on the node page, and for lists it could be dangerous to use the same alignment.
That's due to the fact that the title on node display, by default, is actually fed from the page template, while in list display it's fed from the node template. The mis-alignment of the former is something I've addressed in the real theme I'm working on. (Actually, I've modified the conditional so that the node view still pulls the title via the node template.)
Does this make sense?
Anyway, thanks for following up on this. I probably should do a little tweak of this simple theme if I'm not going to be moving to the newer theme anytime soon.