Enabler: Create Initial Theme for www using the NCI Design System

[bryanpizzillo]

Create the new NCI DS Digital Platform Theme for www

As part of implementing the NCI DS we need to create a brand new theme and jettison all the old front-end cruft from cgov/cgov_common theme. I hope that this theme could be used as a base for other microsite themes, as such we should just name the theme cgdp-ncids assuming www is the default theme. If we need to create other themes for microsites they can sub-theme this and override stuff. (Most likely it will just be the CSS that changes, but who knows.)

Items to be performed (These should be turned into tasks):

• [ ] 1. Create two new themes under docroot/themes/custom:
  • ncids - to be a general purpose ncids theme that could be shared at a later date. Mostly to be empty for now.
    • The theme should be be based on the default, which IIRC is stark. (I.E. the theme's info.yml should not list a base theme)
  • cgdp_ncids - the www theme, which will be considered the default CGDP theme.
    • this theme should have ncids as its base theme
• [ ] 2. Disable the Drupal code sniffer for JS & sass in the theme. It does not know modern JS and will throw linting issues all over the place. ESLint should take the place of it.
• [ ] 3. Setup the front end stuff
  • Setup the package.json and import ncids-css.
  • Setup linting, jest, etc for our project.
  • Setup webpack and entry points for a global css/js and one for each content type(?).
• [ ] 4. Setup the theme libraries to reference the entry points (in the dist folder of course)
  • The global js & css entries should be pointing to the "common" entrypoint - this is what is added on every page.
  • There should also be an entry point for the CKEditor CSS. The is the css for the WYSIWYG This is defined in the info.yml as

    ckeditor_stylesheets:
      - dist/css/Ckeditor.css

  • The global entries should be marked to NOT preprocess
  • it is still undecided if we should do page specific entry points or not. It may be that we should do component specific entry points or something.
• [ ] 5. Update BLT to build the front-end of the new theme. Right now it just does an npm ci & build for cgov_common. The update must build both front-ends.
• [ ] 6. Create an ODE with production content using this theme. Document the steps to refresh.
• [ ] 7. (Optional) Do something to make the content use the new theme. (This is probably going to be harder since the profile uses the cgov_common theme...) ...

ESTIMATE TBD

[bryanpizzillo]

I am going to close this as we did create an initial theme and have been on this for a while.