MyBB Community Forums

Here's a quick little video preview of where I'm at atm with the theme:

I've added Tabs (without the use of plugins).

Great stuff man, keep it up

thanks man, I'll have a lot more time to work on it after this semester is completed

It's possible that the code behind all of this is interesting, but it's really hard to get past the pretty poor styling.

No offense, but what's with the super heavy gradients?

(2013-05-06, 06:51 PM)Euan T Wrote: [ -> ]No offense, but what's with the super heavy gradients?

boredom I suppose. I don't have a "design" background so I just used a 3 part gradient which I liked from my first drafts of this theme for GetSimple CMS. I've been thinking about shifting it to a green neon-ish design but grays are neutral and all the themes gradients are easily change-able from a single CSS file.
The purpose of my OP was structure inputs... where to put what. stuff like that.
actual coloring and stuff like that to me is / should be the last step.
Which I will address at the end of this theme's development.

Looking good man, nice to know you're sticking to this. As for the gradients, maybe give this a try? http://blog.9rules.com/2006/08/a-gradient-tutorial/

(2013-05-06, 09:24 PM)Eric J. Wrote: [ -> ]Looking good man, nice to know you're sticking to this. As for the gradients, maybe give this a try? http://blog.9rules.com/2006/08/a-gradient-tutorial/

thanks... I believe I used this site to make my gradient:
http://www.colorzilla.com/gradient-editor/

As I use only CSS and no images for it.

Here's some grades I had in mind:

Green:
background: #b4e391; /* Old browsers */
background: -moz-linear-gradient(top,  #b4e391 0%, #61c419 50%, #b4e391 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b4e391), color-stop(50%,#61c419), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* IE10+ */
background: linear-gradient(to bottom,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */


A nice blue
background: #cfe7fa; /* Old browsers */
background: -moz-linear-gradient(top,  #cfe7fa 0%, #6393c1 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cfe7fa), color-stop(100%,#6393c1)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #cfe7fa 0%,#6393c1 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #cfe7fa 0%,#6393c1 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #cfe7fa 0%,#6393c1 100%); /* IE10+ */
background: linear-gradient(to bottom,  #cfe7fa 0%,#6393c1 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfe7fa', endColorstr='#6393c1',GradientType=0 ); /* IE6-9 */


another nice blue
background: #d0e4f7; /* Old browsers */
background: -moz-linear-gradient(top,  #d0e4f7 0%, #73b1e7 24%, #0a77d5 50%, #539fe1 79%, #87bcea 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d0e4f7), color-stop(24%,#73b1e7), color-stop(50%,#0a77d5), color-stop(79%,#539fe1), color-stop(100%,#87bcea)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* IE10+ */
background: linear-gradient(to bottom,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0e4f7', endColorstr='#87bcea',GradientType=0 ); /* IE6-9 */

or maybe a pastel light green would be better:

Quote:background: rgb(210,248,217); /* Old browsers */
background: -moz-linear-gradient(top, rgba(210,248,217,1) 0%, rgba(157,247,175,1) 50%, rgba(210,248,217,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(210,248,217,1)), color-stop(50%,rgba(157,247,175,1)), color-stop(100%,rgba(210,248,217,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(210,248,217,1) 0%,rgba(157,247,175,1) 50%,rgba(210,248,217,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(210,248,217,1) 0%,rgba(157,247,175,1) 50%,rgba(210,248,217,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(210,248,217,1) 0%,rgba(157,247,175,1) 50%,rgba(210,248,217,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(210,248,217,1) 0%,rgba(157,247,175,1) 50%,rgba(210,248,217,1) 100%); /* W3C */
filter: progidXImageTransform.Microsoft.gradient( startColorstr='#d2f8d9', endColorstr='#d2f8d9',GradientType=0 ); /* IE6-9 */

I love you OP.

Seriously though, this is nice. I do have some suggestions though:

• The gradients is rather ugly. I suggest to just use a "flat ui" style. Here's some inspiration.. So when you do let give away this theme, users don't have to deal with images (Or remove the huge codeblock of CSS gradients.) It just looks simple.
  
• I assume foundation is using jQuery. It doesn't matter if it does or doesn't. But if if you want to stop the tabs from scrolling up after clicking, call preventDefault()
  
• I'd love to help out with this. Can you post it on Github?
  

(2013-03-04, 10:20 PM)Jason L. Wrote: [ -> ]I still don't understand what ya'll have against tables.

If you know what you're doing and do it correctly tables are an extremely useful tool and timesaver.

I still use them today with many other web designers. There is nothing wrong with tables.

Won't go to far into this table arguments because it's completely pointless. But as a designer point of view, it's a nightmare. Just read what OP posted:

Quote:I've already converted a few thousand tables, albeit I have to reshape them BUT... they're converted. I've just about 78 TDs left

IMO that's why we don't have many unique looking themes. No one wants to be bothered trying to style tables. Specially when MyBB doesn't apply any classes or ID's to them. It's more work then it should be.

(2013-05-07, 09:56 AM)kdevs Wrote: [ -> ]I love you OP.

Seriously though, this is nice. I do have some suggestions though:

• The gradients is rather ugly. I suggest to just use a "flat ui" style. Here's some inspiration.. So when you do let give away this theme, users don't have to deal with images (Or remove the huge codeblock of CSS gradients.) It just looks simple.
  
• I assume foundation is using jQuery. It doesn't matter if it does or doesn't. But if if you want to stop the tabs from scrolling up after clicking, call preventDefault()
  
• I'd love to help out with this. Can you post it on Github?
  

(2013-03-04, 10:20 PM)Jason L. Wrote: [ -> ]I still don't understand what ya'll have against tables.

If you know what you're doing and do it correctly tables are an extremely useful tool and timesaver.

I still use them today with many other web designers. There is nothing wrong with tables.

Won't go to far into this table arguments because it's completely pointless. But as a designer point of view, it's a nightmare. Just read what OP posted:

Quote:I've already converted a few thousand tables, albeit I have to reshape them BUT... they're converted. I've just about 78 TDs left

IMO that's why we don't have many unique looking themes. No one wants to be bothered trying to style tables. Specially when MyBB doesn't apply any classes or ID's to them. It's more work then it should be.

Hey I really appreciate all your input!
That kind of input is exactly why I made this thread!
Okay so I will remove these gradients and use solid metro style colors.
Yes foundation by Zurb does use Jquery (and guess what... so will MyBB soon hehe)
Thank you for the preventDefault() tip!
Sure, I want to work on it some more (at least get the show thread templates finished) and then I'll upload to github the xml with related files.
I've made my own icons for this theme, but I'll release all the standards social icons for free (same license). There's a few hundred I've made

Again I really appreciate the feedback you gave! Cheers!