Change record status: 
Project: 
Introduced in branch: 
8.x-3.x
Introduced in version: 
8.x-3.10
Description: 



Note: if your sub-theme does extensive custom library implementations and/or manipulation, then you will need to extrapolate the changes needed to happen in your sub-theme. This change record only covers the base implementation of each starterkit.

The previous implementation of the Bootstrap Framework assets in the starterkits caused the files to be loaded after the base theme's assets. This caused issues where certain functionality was extended by the base theme, but immediately re-overridden by the sub-theme implementation.

The base theme's bootstrap/drupal.bootstrap library now depends on a newly created bootstrap/framework library. This new library is automatically extended with any CDN assets (if that starterkit is chosen).

If a sub-theme implements its own source files, then it should extend the bootstrap/framework library with its own implementation that adds the necessary CSS and JS assets.

It should also be mentioned that, while this isn't necessarily a breaking change, newer functionality like #2831237: Bootstrap modal does not work well with jQuery UI dialog may not work properly or at all until this change is implemented.

Only the Bootstrap Framework assets should be added to this library. If you sub-theme implements additional custom assets, a new library should be created for them.

CDN Starterkit

No changes necessary.

LESS Starterkit

Combine both global-styling and bootstrap-scripts into the single framework library for your sub-theme, which extends the base theme's bootstrap/framework library.

THEMENAME.info.yml:

- libraries:
-   - 'THEMENAME/global-styling'
-   - 'THEMENAME/bootstrap-scripts'
+ libraries-extend:
+   bootstrap/framework:
+     - THEMENAME/framework

THEMENAME.libraries.yml:

- global-styling:
+ framework:
    css:
      theme:
        css/style.css: {}
-  
- bootstrap-scripts:
    js:
      bootstrap/js/affix.js: {}

SASS Starterkit

Combine both global-styling and bootstrap-scripts into the single framework library for your sub-theme, which extends the base theme's bootstrap/framework library.

THEMENAME.info.yml:

- libraries:
-   - 'THEMENAME/global-styling'
-   - 'THEMENAME/bootstrap-scripts'
+ libraries-extend:
+   bootstrap/framework:
+     - THEMENAME/framework

THEMENAME.libraries.yml:

- global-styling:
+ framework:
    css:
      theme:
        css/style.css: {}
-  
- bootstrap-scripts:
    js:
      bootstrap/assets/javascripts/bootstrap/affix.js: {}
Impacts: 
Themers
Updates Done (doc team, etc.)
Online documentation: 
Not done
Theming guide: 
Not done
Module developer documentation: 
Not done
Examples project: 
Not done
Coder Review: 
Not done
Coder Upgrade: 
Not done
Other: 
Other updates done