Problem/Motivation

The team theming for the Barcelona Event site needs to be able to work quickly Adding new components to the Bluecheese theme without updating everything in the existing BlueCheese theme and without breaking legacy styles.

Steps to reproduce

If you create any component on the site it will load both the existing styles.css and the new global-styles.css files which can lead to conflicts in styling.

Proposed resolution

  • Remove all CSS from the global bluecheese Library
  • Create legacy-global and barcelona-global where legacy loads the old styles.css and barcelona loads the new global-styles.css
  • Add a barcelona content type based on the component content type
  • Create preprocessing function at HTML level to only attach barcelona libraries to barcelona content type and otherwise load the legacy library
  • Update storybook to load global-styles.css in a .storybook/preview-head.html so that all components share the global styles.

Issue fork bluecheese-3471060

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

biz123 created an issue. See original summary.

biz123’s picture

Status: Active » Needs review
drumm’s picture

Breaking legacy styles is not a concern right now, we’re activating parts of the migrated site piece-by-piece, so we have a chance to review and catch any legacy styles that got into a non-ideal place. To reduce potential long-term technical debt, I think its better to go ahead and aggressively adapt legacy styles as they get in the way, rather than leave them in a separate silo.

fjgarlin’s picture

Status: Needs review » Needs work

I left some comments in the MR and @drumm did so in this issue as well. Before we move forward with architectural decisions (in both CSS and Drupal content types configuration), let's try to agree on what would be valid vs not.

spicy.werewolf’s picture

spicy.werewolf’s picture

Status: Needs work » Fixed
spicy.werewolf’s picture

Status: Fixed » Closed (fixed)