Style updates 2.1 Beta 2 Style Updates

Hello everyone, we're pushing our 2.1 Beta 2 updates out today. We stand with XenForo when they say "This is beta software. It is not officially supported. We do not recommend running it in production.". These updates should ideally only be installed on your 2.1 Beta 2 TEST FORUM, not your live site. Once you receive the email you'll be able to download it immediately with an active license via your purchase area.

This time around we're releasing this update as "Unsupported" so you need to choose it from the dropdown list of active downloads.

This is a major style release primarily focusing on bug fixes and overall improvements. One of the main focuses of this update was removing as many template edits as possible to make future updates easier for everyone. A full change-log can be found at the bottom of this post. You must upgrade your forum to at least 2.1 Beta 2 to install this style update.

Before Upgrading
As always backup your current styles before importing the new version. Backing up is simply exporting your current styles before upgrading. Check out our documentation on how to backup your style if you have further questions.

Installation and Upgrading instructions for XenForo 2.0 styles
Full details for how to install and upgrade can be in our Documentation.

Run into issues? Please create a ticket and we'll respond to you as quick as we can.

Found a bug? Let's squash it, submit a bug report.

Release notes
 
New
  • Full support for XF 2.1
  • Font Awesome 5 icons full support, FA4 codes will no longer work, you may need to adjust your node icons
  • Discord url added in basic options (social icons)
Changes
  • Block tab selected coloring issues adjusted
  • Featured border correction across most styles
  • Adjusted our XenBase user banner CSS to allow for add-on compatibility
  • Social media profiles no longer linking to "test" by default
  • Changed the phrase Width in "Change Width" to lowercase
  • Moved our custom-xbBody JS helper below all other JS
  • Message header now using correct contrast background, was pulling block header before instead of message header
  • Block filter bar now uses a contrasting color to it's own background instead of blockheader on some styles
  • Removed "xbMainWrapper" and xb-main--wrapper, was an extra div that xb-page--wrapper covers
  • Footer will be shoved to the bottom of the page if the content is too short (how XF has it by default)
  • Completely revamped footer css, spacing in mobile should be more consistent
  • Login form styling adjusted
  • Category block css changed to not overwrite the last + first child CSS
  • Separate normal and sticky threads no longer has the option to use both text and the bar, you can still achieve this via simple css but we chose to limit template edits where possible, and this was an easy sacrifice to make
  • In forum view you can manually apply an edit if you need to expose the node id:
    change:
    Code: 
    <div class="block" data-xf-init="{{ $canInlineMod ? 'inline-mod' : '' }}" data-type="thread" data-href="{{ link('inline-mod') }}">
    to:
    Code: 
    <div class="block block--node{$forum.node_id}" data-xf-init="{{ $canInlineMod ? 'inline-mod' : '' }}" data-type="thread" data-href="{{ link('inline-mod') }}">
  • Merge staff with online is no longer built in the style, this entire update was around cleaning up items and minimizing template edits as much as I could. This being a specific unique edit it's out of the framework. You can, however, achieve it easily via my instructions here: https://pixelexit.com/threads/merge-staff-with-online-edit.7197/
  • Moved all of our custom js inside helper_js_global to: PAGE_CONTAINER & xb_body_helper, you edited the backstretch or sticky sidebar JS you'll need to apply those edits to xb_body_helper
  • Removed "Account tabs" setting, XF handles this manner using blank phrases now (nav_alerts / nav_inbox)
  • Removed Google + url in basic options
  • Removed edits from core.less
  • Removed edits from core_labels.less
  • Removed edits from notices.less
  • Removed edits from core_inputs.less
  • Removed edits from share_controls.less
  • Removed edits from app_footer.less (this template is no longer being used, all footer css can be found in xb_footer.less)
  • Removed edits from app_user_banners.less
  • Removed edits from core_offcanvas.less
  • Removed edits from forum_view
  • Removed edits from widget_members_online
  • Removed helper_js_global
Fixes
  • Message user info collapse icon had incorrect alignment, removed margin-left: 5px;
  • Welcome notice now using the proper "register" phrase
  • Collapse sidebar button will now work on any page with a sidebar (before only showed if there were other buttons there like new post + post new thread)
  • Page asset link styling no longer changes button CSS
  • Large avatars will now only change the thread_view sizing, the size was spilling out to other areas such as profile view and other misc pages
  • Editor tabs (such as smileys) had illegible text color on certain styles
  • Privacy policy and contact links are fixed now when using the "default links" for a footer block
  • Sidebar login form now has an icon for when sidebar icons are enabled
  • Online stats block now has an icon for when sidebar icons are enabled
  • Text based logo in footer would be cut off in mobile
  • Header text such as social icons was blending into the background on certain styles
Click to expand...
Some key things with these updates:

  • We removed a ton of template edits in the framework to make future updates easier
  • We're shipping with Font Awesome Light out of the box, it's my personal favorite but you can experiment with all the icon weights by going to Style properties -> Basic options -> Font Awesome weight, choose Light/Regular/Solid, refresh after you save to view the differences. Our styles and all our options work with every icon weight
  • Footer was completely re-coded on the HTML side of things, if you made changes to the containers down there you may need to re-apply

Thank you all, this update took a ton of work and I hope the test runs go well for you all! Remember do not install 2.1 on a live forum, these updates are meant for a test board!
 
Thank you guys so very much.

Waiting here the final version before the update. Probably I'm going to need some help to install this updated style on the new version of XF, i don't want to loose any changes that i made.

Nova was 95% accepted by my Community, almost everybody is using (majority on the dark version). Most people who never changed the Style is because they don't enter in the Forum anymore.

Very nice work!
 
palhanow said:
Thank you guys so very much.

Waiting here the final version before the update. Probably I'm going to need some help to install this updated style on the new version of XF, i don't want to loose any changes that i made.

Nova was 95% accepted by my Community, almost everybody is using (majority on the dark version). Most people who never changed the Style is because they don't enter in the Forum anymore.

Very nice work!
Click to expand...
As long as you put your edits in a child style upgrades are usually easy!
 
Russ said:
As long as you put your edits in a child style upgrades are usually easy!
Click to expand...
Hello,

I have a child style and put my all changes to child style. I've upgraded my parent style but when i make my child style default theme forum looks not right, when i select parent style it looks ok but i loose my edits. What am i missing?
 
Deepblue said:
Hello,

I have a child style and put my all changes to child style. I've upgraded my parent style but when i make my child style default theme forum looks not right, when i select parent style it looks ok but i loose my edits. What am i missing?
Click to expand...

It could be outdated, if you want to submit a ticket with an admin login I can take a closer look. Lots of variables are involved here so a login would be the best and quickest way to debug it.
 
Russ said:
It could be outdated, if you want to submit a ticket with an admin login I can take a closer look. Lots of variables are involved here so a login would be the best and quickest way to debug it.
Click to expand...
Thank you for your kind approach, i've decided to roll back and wait until stable release.
 
Russ said:
Changes
  • Removed "xbMainWrapper" and xb-main--wrapper, was an extra div that xb-page--wrapper covers
Click to expand...

Many thanks for this update! :D

I've imported FlatAwesome+ 2.1 Beta into my local dev environment for testing. In the style property group 'Page setup' there was a Main wrapper property (xbMainWrapper). Is there a similar property for the page wrapper?

In XF 2.0 I have a background image specified in a child style on the main wrapper (so that it drops down below the staff bar). For XF 2.1, to retain this behaviour I've added the background manually in EXTRA.less to .xb-page-wrapper.
 
That would be the appropriate div. There was a bug with the footer and part of the solution was removing this particular unnecessary div. I can add a property back in for the one you selected though.
 
  • Like
Reactions: ACL
dethfire said:
Are you taking custom work now for 2.1 or should we wait till RC or gold?
Click to expand...

Taking it now :), styles have been updated for 2.1 so the big work is done, Beta 2 to Beta 4 there was like 2 lines of CSS that were outdated.

Any custom work being done now gets upgraded to the stable of 2.1 for free of course.
 
You must log in or register to reply here.

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.

View our stylesBrowse all our XenForo styles
DocumentationEssential information for our styles
Back