image of sheets folded and stacked on top of one another
Stylesheets in Drupal 8: Removing and Overriding
The new info.yml file properties for removing and overriding stylesheets in Drupal 8 has resolved many of the issues that we experienced in previous versions.

In Drupal 7, there was a stylesheets[] property for theme .info files, which allowed to

  • add new CSS files of a theme or base theme
  • override (replace) CSS files that were previously added by a module or base theme in a theme
  • remove CSS files of a module or base theme

The facility to override and remove CSS files was partially broken in that it caused the replacement CSS files to be loaded in a different order/position than the original, and all other meta/loading properties of the original CSS file got lost, since the file essentially was re-defined from scratch.  This rendered the override/remove facility of the stylesheets[] property useless for most cases and theme authors had to resort to writing relatively complex PHP code to achieve the correct behaviour.

The problem has been fixed in Drupal 8 by introducing dedicated and separate theme .info.yml file properties for adding, overriding, and removing stylesheets.

Example of new properties:

 

# Add a new CSS file:
stylesheets:
  all:
    - layout.css

# Override a CSS file:
stylesheets-override:
  - system.theme.css

# Remove a CSS file:
stylesheets-remove:
  - node.css

 

For more information regarding removing and overriding stylesheets in Drupal 8, please see https://www.drupal.org/node/1876600

Navy blue plain colour background

As Founder and CEO, Chris lives and breathes the paradigm that OPIN was founded on: Open Innovation. This mantra has helped our founder grow OPIN from its roots to Canada's fastest-growing digital agency. Chris is considered a thought leader in the entrepreneurship, open-source and government communities.

Let our industry experts take the drivers seat and discuss the flexibility and extensibility of Drupal
#833394