Styles

Package: @prism/styles

CSS files are built from the contents of the @prism/scss package and made avialable within the @prism/styles package. The assets are created using the following schema:

Root assets match:
<theme>[-grid|-reboot][.comps][.sandbox][.min].css

Theme assets match:
<theme>/<component>[.sandbox][.min].css

  • <theme>: the theme represented in the file
  • <component>: component styles are specific to
  • [-grid|-reboot]: (optional) Bootstrap provides three root files: bootstrap.scss, bootstrap-grid, and bootstrap-reboot. These files are represented here using logic from Bootstrap.
  • [.comps]: (optional) includes all component styles
  • [.sandbox]: (optional) prefixes all selectors with .prism-sandbox; this prevents PRISM defined styles from "leaking" outside of the container. Developers must wrap all PRISM components with this class name in order to have the PRISM styles appear.
  • [.min]: (optional) minified file using CSSNano

Themes available now:

  • prism: this is the "Manheim" theme; the name is scheduled to change to "manheim" in the future
  • mui: (deprecated) a theme to carry over MUI styles to make ease transitions

Package: @prism/scss

This package consists of raw scss files used within the PRISM library to build the @prism/styles package. The @prism/scss package can be useful to build app specific components that will match the PRISM design system as it changes over time.

As of version 1.10.0, work is being done to extend Bootstrap in a more cohesive manner enabling more updates and code to be leveraged from the Bootstrap ecosystem. This work will impact the @prism/scss package over time.