IDC UI Theme boots

IDC's UI Theme based on the Bootstrap Barrio subtheme

Tree structure

├── color
│   └── Color picker
├── config
│   ├── install
│   │   └── Drupal Configs to install with theme
│   └── schema
│       └── Drupal theme schema
├── css
│   └── CSS files
├── images
│   └── Images specific to theme like the logo
├── js
│   └── JS files
├── logo.svg <-- Logo
├── screenshot.png <-- Screenshot of homepage with this theme.
└── templates
    ├── Types
    │   └── Twig templates
    └── Twigs templates organized by types.

Main menu comes from a Drupal migration. It is not part of the theme.

To see most recent screenshot go to

How to edit content

Footer

Fallback collection thumbnail

1. Go to admin/structure/views/view/top_level_collections/edit/page_1
2. Click dropdown "For" > "This page (override)"
3. Click in the "field" section > "(field_media_of) Media: Image"
4. Within the "No results behavior" add the following standard HTML code:

<!-- <img src="https://dummyimage.com/200x200/fff/aaa" style="max-width:200px;" /> -->

<img loading="lazy" src="/themes/contrib/idc_ui_theme_boots/images/jhu_library_fallback.jpg" width="220" height="110" alt="Johns Hopkins Peabody Library.jpg" typeof="foaf:Image" class="image-style-medium" style="max-width:200px;">
src="themes/contrib/idc_ui_theme_boots/images/fallback_collection_thumbnail.jpg"

1. Apply (this display)

Possible Images for the fallback:

• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/peabody-banner-2.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/peabody-banner-1.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/qrr.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/blc-1.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/blc-2.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/clevel-banner.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/hut.jpg
• https://www.library.jhu.edu/wp-content/uploads/sites/3/2017/06/msel-atrium.jpg

Members of a Collection & Compound objects

Block is added by a context in /admin/structure/context/collection

Edit Collection View

Manage the displayed fields admin/structure/types/manage/collection_object/display

Turn off TWIG Debugging

Go to sites/default/services.yml and then modifying the twig.config section in services.yml to set debug: false.

Add a new theme twig suggestion

1. Go to themes/contrib/idc_ui_theme_boots/idc_ui_theme_boots.theme
2. Add a new suggestion in the idc_ui_theme_boots_theme_suggestions_page_alter function
3. Using existing examples $variables['element']['#id'] that takes in the CSS ID of the element to know which template to suggest.
4. Clear cache