Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Base Theme (/src/app/ directories):  The primary look & feel of DSpace (e.g. HTML layout, header/footer, etc) is defined by the HTML5 templates under this directory. Each HTML5 template is stored in a subdirectory named for the Angular component where that template is used. The base theme includes very limited styling (CSS, etc), based heavily on default Bootstrap (4.x) styling, and only allowing for minor tweaks to improve accessibility (e.g. default Bootstrap's color scheme does not have sufficient color contrast)
  • Custom Theme (/src/themes/custom directories): This directory acts as the scaffolding or template for creating a new custom theme.  It provides (empty) Angular components/templates which allow you to change the theme of individual components.  Since all files are empty by default, if you enable this theme (without modifying it), it will look identical to the Base Theme.
  • DSpace Theme (/src/themes/dspace directories): This is the default theme for DSpace 7.  In version 7.0, it's a very simple example theme providing a custom color scheme & homepage on top of the Base Theme. In later versions of 7.x, this may be enhanced to provide additional theming examples (and to enhance the default DSpace theme itself).  It's important to note that this theme ONLY provides custom CSS/images to override our Base Theme. All HTML5 templates are included at the Base Theme level, as this ensures those HTML5 templates are also available to the Custom Theme.
  • Which theme am I using? or How can I change themes?  Everyone's theme is always based on the Base Theme, but you may have overrides in place based on the "themes" section in the environment.common.ts.  As you can see from that configuration, it is possible to customize your global theme, or customize the theme per Community/Collection/Item.

At this time, the guidelines below refer primarily to the Base Theme, and do not cover either the Custom Theme or DSpace Theme.  Those other Theme directories will be covered in training materials around how to create a custom theme for the DSpace UI.

...