MyBB Community Forums

Okay so this is a one month work and just needs a few final touchups and will be released before the 30th of this month.
I have my JEE Advanced exam on 25th so I am focusing on studies now but all else is almost finished on this theme.

This is basically using a customized version of Bootstrap modified to be light as well as remove compatibility issues with MyBB.

The theme is tableless and fully responsive. I wont say completely tableless as it does make use of tableless a tiny bit in the post bit but all else is tableless.

Mobile screenshots will be attached soon as well.

Here is the album and more pics will be added soon.
http://imgur.com/a/VSpg9

Please give me your opinions but do not about the color scheme as finally a colorpicker will be implemented.

Otherwise it retains the MyBB feel and does come with working inline moderation thanks to new modified JS files to work with the lack of tables.

Header is just being completed. Also the theme tries to maintain compatibility with major plugins and seems to work fine with MyAlerts, MyShoutBox and a slew of other popular plugins.
Buttons are currently from Audentio [Novus Theme][dont ask me how they landed there was just playing with various button sets trying to decide buttons via sprites or <=> CSS buttons], but thats just for the testing, I will be replacing them with CSS ones and those who prefer there will be a custom button set as well.

Also new-post and new thread pages are redone to be tableless and look better on small screen devices.

It also uses FontGlyph as Bootstrap comes with it. I am waiting for opinions whether should I continue using font-glyph or return to my favorite font-awesome.

I will be offering full support for the theme for buyers, have not fixed a price though.

I would really love some feedback from JohnnyS who is doing a similar project and also from Mrs. Leefish one of the best designers. Effone and Envira also are good and waiting for their comments.

So lets see how this goes, I am pretty frankly bored by the MyBB UI and this will put some boosters in it.
I am also making the theme as light and as quick as possible.
Any suggestions welcome.


OUT OF TOPIC:- I do have one strange issue not only in this theme but also in the default stock mybb install that whenver I use SCE-Editor I find that the Upload system lacks the insert into post button. Disabling SCE editor fixes that. I am just looking into available WYSWYG editor solution and if anyone can help me with this or may be write a good TinyMCE or CKEEditor plugin it will be cool.

As promised (in my previous thread) i'll give some opinions and feedback on your current work.

For the last few weeks i was looking at integrating Bootstrap into mybb theme but after browsing components, classes, html markup and jQuery addons (various sliders, input element wrappers...) i have decided to drop that idea and focus on adding boostrap visual elements only. First reason for that was huge amount of content (particularly classes) in bootstrap css files that aren't even used in default mybb theme (.tborder, .trow1/2, .tcat, .tfoot vs panel, panel-heading, panel-body, panel-footer in boostrap).

Second one was tableless aproach (i'm a fan of tableless design(s)) but in this forum software you have a bunch of core functions (inline checks is the first thing that comes to my mind) and plugins (their HTML structure) that are relying on tables and by removing them you will also have to rewrite core functions (js stuff and core edits that contain hardcoded HTML).

Third reason is HTML markup in some boostrap elements - by the time you add all tags to form a simple element (like button with dropdown functions) you can just add <input /> tag with a class and use jQuery to calculate button position bind dropdown menu to it.


Those are my reasons to drop bootstrap in favour of classic bootstrap like styling ( i was just giving my opinion on it and i'm not trying to discourage no one in making a tableless responsive theme, i'm looking forward to see more responsive themes).

Quote:It also uses FontGlyph as Bootstrap comes with it. I am waiting for opinions whether should I continue using font-glyph or return to my favorite font-awesome.

I didn't use bootstrap fontGlpyh so i can't comment on it but for FontAwesome i can add few words of feedback. It's my no.1 icon set when comes to new theme development. Before that i was using plain icons with dark / light colors (dark bg / white icon, white bg / dark icon) but with FA i can recolor a particular icon to any color without adding a new image for it. Low file size (550 kb) makes it a perfect icon set for a responsive design. In some pages (like postbit) i tend to hide button text and leave only icons if the page is to short in width and buttons are overlapping.

Quote:Also mine comes with a customized prototype files, i mean the inlinemodjs etc to work with the tableless design.
As always fully responsive.

In my Twist-SD theme thread (first few pages contain edited core file notes) i have mentioned few core edits that are needed in order to have working functions on tableless theme. After working on it i have decided to add minimal table layout in order to avoid core edit(s):

<table>
<tr>
<td class="trow1 mylass">
<my html stuff goes here> <checkbox>
</td>
</tr>
</table>

Another alternative is to rename a particular js file (inline_moderation.js to inline_moderation_2.js) in order to avoid conflicts if a user has two themes (one tableless and one with tables). Edited core file won't work on theme with tables. In that way (by creating inline_moderation_2.js that is used by tableless theme) you can avoid javascript core edits on used js files.

Yes I agree on your point for the renamed files, I gonna do that as a final step before making it public. I do realize the markup and amount of classes to be added is huge and such themes will be definitely more cumbersome to edit for new users, sometimes even I find it messy but well I use coding as a relaxation, just got an idea and did it and now gonna complete it.
I am not really good at prototype so thats why I first modified the core files directly to check if they work and miraculously I did the right thing. I wish CSS had a parent psuedo selector.

Currently Index page is tableless, showthread including search results is tableless but the postbit still has tables in it. The reason there are tables in the postbit is it looks good, and works, no other reasons.
Johnny also one more thing, do you recommend to keep it tableless or should I go and add more tables back to them to estabhlish backward compatibility.
I have not touched the Bootstrap JS files though and I need to do it as it has a lot of redundant functions, which any way wont be used.
A copy paste style approach works wonders in bootstrap. I made a basic layout for all the container elements and used them, but definitely is time consuming.
Basically I actually got a surprise seeing inline mod uses an up selector to select the previous tr element, but I will make inlinemodjs 2 as you say.
Thanks for the feedback mate. I am actually really waiting on PHPB 3.1 and maybe a move to that then.

---

Okay after taking a quick look at what you have done with tables, I have done something similar on the postbit. I plan on doing the same for the rest as well then, to make them look better and be properly working with plugins.

---

Okay after taking a quick look at what you have done with tables, I have done something similar on the postbit. I plan on doing the same for the rest as well then, to make them look better and be properly working with plugins.

I will make the same comment here that I made on johnny's thread; the point of Bootstrap is that it provides a framework for you to get a site up and running. It isn't actually a design.

Regarding postbit, consider making the postbit responsive so it moves from classic to horizontal on screen size. It is what I did with my none Bootstrap, uses 2 column tables where needed cos it makes my life easier, theme that I built for my own site. Fully responsive of course.

The postbit re-sizing is already incorporated. Yeah I do understand bootstrap is a framework to be build upon but nonetheless it does make the job easier to create good designs.

The current thing is just a skeleton and will incur further eye candy refinements.

Leefish what made you not use Bootstrap or another framework like Zurb?

Because I found it easier to build my own and combine it into MyBB. I made a few simple design patterns and applied them everywhere. It makes the site look and feel consistent imo.

Maybe my design isn't your style, that's ok.

While you are busy on this project, do take a read of this:

http://css.dzone.com/articles/please-stop-using-twitter

and this SO answer:

http://stackoverflow.com/questions/14227...-bootstrap

Also this: http://ruby.bvision.com/blog/please-stop...-your-html

I really really wish we had read that BEFORE we converted ModtheSims to use Bootstrap - and then the next version came out and we were facing changing all the templates again. Horrifying.

Ya thats one major issue as version change, but its upto us to stick to the old one till we need a refreshment is not it?
Thanks for your inputs LeeFish will definitely take time to revisit some alternative strategies.

well, it is true it is up to you - it depends on how far reaching the changes are if the Bootstrap guys update again. The changes from 2 to 3 were pretty huge.

^ When my theme used Bootstrap it didn't took me one day to update from 2 to 3 but I also decided to drop it in favor for a flex based grid and own, MyBB suited framework which is much lighter and performs much smoother.

After fiddling around with my MyBB Bootstrap theme for almost a year, I can agree 100% with Leefish, you are better off without Bootstrap or any framework for that reason, it's also not really good for mobile, to make it really good you will have to do so many edits, you end up rewriting the whole thing.

Hmm, so my next step would be to make a custom framework, once I release and get done with this.
I took Bootstrap as I had time constraints. I actually wanted to move to XF or something but was short of a bit of cash.