Suite Style - vBulletin Modern Theme - By Technidev

Mark as installed = get support.

Information
This theme is based on the mock-ups made by a former IB/vBulletin employee. I don't have any names unfortunately.
This style has been tested on Microsoft Edge, Firefox 43, Chrome 48.
This style supports vBulletin's suite. (CMS/blog/articles)
This style should work fine on resolutions with a width of at least 900 pixels.
This style works best with postbit_legacy (vertical postbit).
This style has been confirmed working on the following versions but should work on most vBulletin 4 versions: 4.2.1, 4.2.2, 4.2.3, 4.2.4, 4.2.5.

Please post any bugs, mistakes or improvements in this thread.
I also added an additional feature to it which is the quote expander, it will do that to any quote of which the height is more than 250 pixels.

Screenshots






Installation

1. Download attached .zip file and unzip somewhere.
2. Upload contents of the UPLOAD folder to the "images" folder of vBulletin.
3. Import the .xml file in the IMPORT folder at AdminCP > Styles & Templates > Download / Upload Styles > Import Style XML File. Make sure to check "Ignore Style Version".

Change Log
v1.0.3: Fixed width of forum title being too big.

How to modify the footer?
Open the footer template and scroll down. You will see the divs that contain the hyperlinks, description and social media hyperlinks.

How to modify the logo?
Modify the "titleimage" style variable.
AdminCP > Styles & Templates > Style Manager > vBulletin Modern > Style Variable Editor > titleimage.

How to remove the quote expand functionality?
Modify the "showthread" template and scroll all the way down until you see the script that does this and remove it.

How to change the height of the quote expand functionality?
Modify the "showthread" template and scroll all the way down until you see the script that does this and modify all "250" to your desired height.

==
Like this theme and want to support me for more themes in the future? Donations of any amount are welcome.
Are you using this theme as a default theme on your forum? Post your forum link here, I'd love to check out your forum.

.

[chloe101]

Originally Posted by MarkFL

Hello Chloe!

Open the "additional.css" template for this style, and locate the selector:

.postbit .posttitle, .postbitlegacy .title{
   display: none;
}

Now, to get the post titles to display, simply comment that out, like so:

/*.postbit .posttitle, .postbitlegacy .title{
   display: none;
}*/

Now your post titles should display.

Thank you! That worked. I'm shocked it was something so simple. And apologies that I can't 'like' your reply. The software keeps insisting I must like someone else's post first (which I have) before I can like yours. The liking part of vb.org makes no sense to me but consider it liked with many many thanks

[chloe101]

Originally Posted by Dave

No problem at all!
Follow Mark's lovely instructions and they should show up again.

They showed up immediately when I did. Thanks for sharing this awesome theme and thanks a ton for responsive support!

[MarkFL]

Dave, I want to confirm that this theme works on vB 4.2.5 as well...I noticed that version wasn't listed in the OP.

[Dave]

Originally Posted by MarkFL

Dave, I want to confirm that this theme works on vB 4.2.5 as well...I noticed that version wasn't listed in the OP.

Thanks, added it to the list.

[chloe101]

Hi

Can you please help me with this calendar issue on the blog page? The month and navigational tabs aren't visible and I'm not savvy enough to change them without messing up other items on the page.
Thanks

[MarkFL]

Hello Chloe!

Open up the "additional.css" template and locate the selector:

.blocksubhead a{
   color: #EEF6FF;
}

And change it to read:

.blocksubhead a{
   color: #EEF6FF !important;
}

This will allow the intended color to override the CSS given elsewhere. The best I can tell the tabs to the left and right of the month name don't contain anything.

[chloe101]

Originally Posted by MarkFL

Hello Chloe!

Open up the "additional.css" template and locate the selector:

.blocksubhead a{
   color: #EEF6FF;
}

And change it to read:

.blocksubhead a{
   color: #EEF6FF !important;
}

This will allow the intended color to override the CSS given elsewhere. The best I can tell the tabs to the left and right of the month name don't contain anything.

Hi Mark! That worked but it changed the font color in the navtabs of the blog sidebar also Is it possible to change it just for the calendar? Also, the tabs to the left and right were the < and > symbols to select previous/next month.... Everytime I think I finally understand vb styling, fate throws another brick lol.

[MarkFL]

Originally Posted by chloe101

Hi Mark! That worked but it changed the font color in the navtabs of the blog sidebar also Is it possible to change it just for the calendar? Also, the tabs to the left and right were the < and > symbols to select previous/next month.... Everytime I think I finally understand vb styling, fate throws another brick lol.

Okay, try changing the selector you previously changed to:

th.blocksubhead a{
   color: #EEF6FF !important;
}

I'm not getting the "<>" symbols in any of my styles in the blog calendar at that location.

[chloe101]

Originally Posted by MarkFL

Okay, try changing the selector you previously changed to:

th.blocksubhead a{
   color: #EEF6FF !important;
}

I'm not getting the "<>" symbols in any of my styles in the blog calendar at that location.

Possibly because you have no entries in the calendar... because now it works great on mine Thank you! Again lol

Just to be clear, I changed that entry by adding the th. in front. Will that affect anything that's not using the th. in front. I'm sorry if this sounds like a silly question but it helps me learn. I would have assumed the two were 2 totally different rules.

[MarkFL]

Originally Posted by chloe101

Possibly because you have no entries in the calendar... because now it works great on mine Thank you! Again lol

I wondered if that might be the case, since the elements are there, but just blank on my dev site.

Originally Posted by chloe101

Just to be clear, I changed that entry by adding the th. in front. Will that affect anything that's not using the th. in front. I'm sorry if this sounds like a silly question but it helps me learn. I would have assumed the two were 2 totally different rules.

That's a good point (not silly at all), and you might want to add a selector equivalent to what was there before you made any changes, that is, beneath your edited selector, add:

.blocksubhead a{
   color: #EEF6FF;
}

That way Dave's original selector is still there, doing what it's supposed to do elsewhere.