bootScore 5.1.3.1

This update ships many bugfixes, improvements and prepares for the next update. Release was originally scheduled to come along with Bootstrap 5.2.0, but Bootstrap has been very quiet for the past two months. Now we know why.

Hey everyone, @mdo here. Wanted to share this update more broadly in case you were wondering about the team and projects. Hoping to be back to shipping things in a few weeks or so as I recover. Meanwhile, take care of yourselves! ❤️ https://t.co/I6ovlfe57r

— Bootstrap (@getbootstrap) January 19, 2022

Scary news. I (Basti) do not know Mark personally, but we had some conversation during the offcanvas navbar implementation. I’m using Bootstrap since version 2 and it’s the backbone for my work and income. I highly appreciate what he do. Mark, thank you for Bootstrap and get well soon!

This will definitely push the Bootstrap release cycle backwards. So we have to be patient for 5.2.0, but we will use the time to take the next step forward.

Eight people contributed to this release. The main features are:

• A dev_mode for SCSS compiler. Files will be recompiled on every page load when dev_mode is active. (Documentation follows)
• Theme’s CSS is now SCSS.
• Some redirects when log-in/log-out/register/failed/succeed in offcanvas-account.
• Improvements in the WooCommerce template files.
• Removed CSS fallbacks for old header.php’s.
• Many minor bugfixes and improvements.

Check the changelog for detailed information.

How to update

Update doesn’t break your child for now. But by the next release we will delete and move some files. So, do some tiny changes in your child to be prepared for this.

1. Backup your site
2. Download new bootScore theme in your dashboard or GitHub and install it via the theme-uploader.
3. Open in your child /css/scss/_bootstrap.min.scss and delete @import "fontawesome"; in line 5.
4. If you use bootcommerce-child, add @import "bscore_woocommerce"; after @import "bscore_style";. Example

Removed Fallbacks for old headers

Since version 5.0.2.3 (July 2021), bootScore has refactored header.php’s. The addidional fallback CSS for the previous headers is now deleted. If you still want to use one of the old header, add the missing CSS to your child.

/* Dropdown Search (replaced by Collapse component in 5.1.0.0. Fallback to old headers) */
@media (max-width: 782px) {
  .logged-in.admin-bar .dropdown-search {
    top: 100px !important;
  }
}

@media (min-width: 783px) {
  .logged-in.admin-bar .dropdown-search {
    top: 86px !important;
  }
}

.dropdown-search.dropdown-menu[data-bs-popper] {
  top: 54px;
}

.dropdown-search .searchform {
  opacity: 0;
  transition: opacity 0.8s;
  transition-delay: 0.3s;
}

.dropdown-search.show .searchform {
  opacity: 1;
}

@media (max-width: 991px) {
  .btn-dropdown.right {
    padding-right: 0;
    border: none;
  }

  #dropdown-search:hover {
    color: currentColor;
    background-color: transparent;
    border-color: transparent;
  }

  #dropdown-search:focus {
    box-shadow: none;
  }
}
/* Dropdown Search Fallback End */

WooCommerce

If you use bootcommerce-child, you need to add this too to keep the logo centered on mobile devices:

/* Since 5.1.0.0 logo is on the left in new header. Fallback to old header */
@media (max-width: 991px) {
  #nav-main .navbar-brand:not(#nav-main .navbar-brand.xs, #nav-main .navbar-brand.md) {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0px);
  }
  #nav-main {
    min-height: 56px;
  }
}
/* Fallback to old header End */

What else?

• New languages: Español de Colombia and Español de Venezuela, thanks to Osdeibi Acurero

What’s next?

• Fontawesome. We plan to move that out of the theme into a plugin and use inline-svg instead for better performance. That’s why you should remove the @import in your child because we delete this file by the next update.
• Theme styles for WooCommerce go into new file _bscore_woocommerce.scss. That’s why you should @import this file now in your bootcommerce-child.
• Now that all CSS files are SCSS and the name bootstrap.min.css is confusing, let’s set the compiled output to style.css. The whole migration of all static CSS files to SCSS since we have Bootstrap source in theme is then complete with that.