Well a few further updates

Following on from our first introductory update The State of the BP Nouveau template pack we are happy to provide a little more insight into the ongoing development of this project.

Since that first update we have updated many files pushing some ~110 commits ~410 commits in total to date.

We have comprehensively re-factored and structured the directory layout and created many new include files. Styles are re-worked into a modular series of partial files representing two levels  – those that are called and compiled as the base styles and those that are unique to given TP & living in the TP directory.

The focus of the last couple of weeks has really been on template re-factoring, updating markup , improving semantics, adding or removing classes as required while working through screens updating styles. Updating visual styles also involves paying attention to  the structure and formatting of the files, looking at the nesting of rules (less depth allowed in lint rules) , attempting to ensure we have lighter files with selector specificity that’s lower and less troublesome to override and ultimately to hopefully compile css files that are a little smaller in kb.
Amongst other additions since last we wrote there have been:

• Navigational user selected styles
  We now provide a vertical navigation selection for user object navs seen here

• Additional styles for Navs or links exist too so we can have  a default subnav view or a tabbed look, the tabbed look  work as styles & classes  that can be dropped on most ul list links so we can use them on links such as the profile group links or the message screen links:These styles for tabbed navs work from classes to apply the styles in the same way the vertical navs function so in time we will add these to the customizer when we’ve worked out what elements benefit from the choices (apart from the obvious).

• Messages gained a massive upgrade courtesy of @im4th as described in the last update further to this we have updated some of the markup for better semantics and tweaked the styling a bit for both the inbox messages listing & preview screen & single message thread views:

• All Nav elements in general have received a review and class tokens upgrade to try and make them a little more useful  and clear – gone is reference to ‘tabs’ unless they are specifically visually styled as such. Navs have had a round of default styling as a base line on which we can build out further styles and attention to some very simple screen widths so that we have something that will work for small mobile/tablet devices.
• On User screens we have looked at creating a more uniform approach and consistency to headings and simple explanatory text so for example on the user settings screens we have added headings and text to all screens so it’s clear exactly what your looking at, this process is replicated across all screens where required.

• Whats new textarea gets a tidy up of styles to compliment the work carried out by imath for both small and wide screen views.
• General tables get a freshen up and font sizes managed for th/td cells.
• BP Lists get attention for heading/meta font sizes & layouts for small / wide screens.
• Update the Group Create steps screens, improves the markup and classes and pulls out the BP core steps navigation to include in nouveau template-tags file and adjusts markup.
• Updates for mixins & scss variable files – improves color choices by variable reference, create more individual specific vars to allow changing of  more specific elements without changing all e.g $nav-hover: $dark-grey; allows $nav-hover to take a different color or var while another element can still use $dark-grey as set. Mixins get updates  for responsive text  to compliment the general font size mixin, this allows a value to be divided by a percentage on smaller breakpoints. New clearfix mixin allows clearfix rules to be added to an element fed as a param of the mixin. Add a variation of the messages box used in companion styles; this mixin allows backgrounds  and color to be passed to message element rulesets, authors can now override the defaults for border, background, color. Update our password strength warning colors for variable definitions rather than hardcoded hex.

Moving forward we have more templates to still run over and review for the best markup structure classes and of course a full and detailed review of accessibility improvements we can bring to our templates which @mercime will be tackling at a convenient moment.

@im4th is currently looking at the implementation of the template pack selector for core on this ticket :

https://buddypress.trac.wordpress.org/ticket/7157

As well as continuing to drive new and exciting functionality for bp-nouveau. (take a look at the proposal here for example: https://github.com/buddypress/next-template-packs/issues/64)

We encourage everyone to download and follow along with the development plugin, you can download from:

https://github.com/buddypress/next-template-packs/archive/master.zip

or of course checkout to your plugins local dev via git:

https://github.com/buddypress/next-template-packs.git

We have specific Template dev Chats on Thursdays @ 19:00 UTC on BP’s slack channel, please come along and provide feedback or simply follow along all and any participation is hugely welcome.

If you’re running the plugin and spot an issue or have an idea for an improvement then you can use BP’s issue tickets on the next-template-pack repo to report them:

https://github.com/buddypress/next-template-packs/issues

And last but not least please feel free to leave any comments or questions on this post and we’ll attempt to respond to them

Regards, the Template Pack Team.