MyBB Community Forums

Full Version: Bright, retro styled forum mockup..
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
So... I thought I'd throw open to comment a mockup I've been working on for a forum I've recently started... but first a little background info...

I've recently started a forum catering to owners of classic Minis (the car, not the skirt, although photos of those are welcome too!).

I wanted something a bit different (bright, multi coloured, retro), clean, easy to navigate, where everything has its place, and there is no useless fluff filling up the forum.

This mockup is somewhat mini-centric, using colours from the 1970s that the cars were painted in. Colours like 'Am Eye Blue', 'Hairy Lime Green', 'Home on th' Orange' and 'Plum Loco Pink'. Hence the forum is quite um... bright... and a little bit 'retro'. A lot of the icons are mini themed too. The mini related stuff would be removed when released, replaced with more generic styled stuff. It does have a modern twist, with styling cues from a famous alternative PC manufacturer Big Grin

Finally, I have no experience theming MyBB. So expect a lot of questions. Have done a little with phpBB, as well as some other programs that aren't forum or web related.

So keeping all that in mind, and the fact that this is purely a mock-up until I can stop procrastinating enough to actually start modifying some css and templates....

[attachment=23340]
[attachment=23341]

Tim.


I really like it Big Grin

The combination of colors is what make it very nice IMO.

Something I don't like about your theme are the buttons, but that is me Wink
That looks amazing! I love the colors. Great job!
See if you can work the font Alba in there somewhere. That looks rather 70s...
This looks pretty cool! Nice work. Smile
ah hah! it begins!

Now this is no big thing for you guys, but I'm new to MyBB theming, and had no idea where to start, but have managed to adjust a template and add some CSS to do this:

[Image: screenshot20110713at705.png]

So to me, this is big, and it's a start, which I've been putting off for ages!

Now, I have done this using tranparent PNGs for the corners, so background image can be changed easily without having to change the corner images... is this a Bad idea in the world of web development? Ideally, I don't care for users of IE, but I suppose I should cater for them too?
OH! and also, when referencing images in CSS, how should I be linking them? At the moment they are hard coded in .. ie

background: url(images/MD/thead_right.png)

is this the correct method? or should I be using a theme path or something?

Why not using the new radius-border css3 property for round corners?

http://www.zenelements.com/blog/css3-bor...d-corners/
http://border-radius.com/

background: url(images/MD/thead_right.png)

This is alright, but try using " ' " between the path, like this:
background: url('images/MD/thead_right.png')
(2011-07-13, 10:13 AM)Sama34 Wrote: [ -> ]Why not using the new radius-border css3 property for round corners?

http://www.zenelements.com/blog/css3-bor...d-corners/
http://border-radius.com/

well.. I had no idea that could do drop shadows til I investigated it further.. but I like the control I have with graphics for highlights and textures etc... and well.. I already did it the other way! Big Grin

plus it's a bit beyond my css ability to get it all together I think.. maybe in v2.0!

Quote:
background: url(images/MD/thead_right.png)

This is alright, but try using " ' " between the path, like this:
background: url('images/MD/thead_right.png')

done!

This is going to be time consuming!



at this rate, the theme will be finished by August.... 2013.

[Image: screenshot20110713at105.png]

slowly slowly!

oops it seems I broke the widths of the trow items. oh well something to fix tomorrow!
One suggestion: I don't think that the background really goes with the theme. Making a different, lighter background would improve it (for me).
I have a theme that can do all the rounded corners for you. Since it's just a springboard for rounded corners no copyright is necessary.

Here's the zip file:
[attachment=23375]