deps: cms v4.20 & core-styles v2.37

[wesleyboar]

Overview

Fix styles bugs. Add styles features. Get some no-op, coat-tailing updates.

Important

After deploy to prod, delete snippet #158.

Related

• requires https://github.com/TACC/Core-CMS/releases/tag/v4.20.0
• requires https://github.com/TACC/Core-Styles/releases/tag/v2.37.0

Changes

• updated Core-Styles & Core-CMS

Testing & UI

✅ Core-CMS v4.18 / Core-Styles v2.35

1. Visit https://tacc.utexas.edu/systems/all/.
2. See extra space to the right of all images in cards. 🫢
3. Visit https://dev.tup.tacc.utexas.edu/systems/all/.
4. See no such space. 😏

Before	After

✅ Core-CMS v4.19 / Core-Styles v2.36

1. Create a Bootstrap column.
2. Choose "Column dark"
3. Verify in that column;
   • background becomes dark
   • text becomes light
   • primary Button becomes lighter
   • Cards adapt as if in a dark Section

Before	After

✅ Core-CMS v4.20

1. Create a "Section (…)".
   ^{i.e. o-section}
2. Verify a <div class="o-section"> is created.
3. Verify it does not have container class.

Plugin	Render

✅ ⚠️ Core-Styles v2.37

1. Create/Find a c-card--plain that has an image.

   1. Create a "Style" block.
   2. Choose c-card--plain.
   3. Save block.
   4. Add "Picture/Image" block inside.
   5. Add "Text" block inside (with an <h3> and a paragraph).

2. Edit the "Picture/Image": Add a link (internal or external).

3. Save block.

4. Verify card layout does not change.

   • ⚠️ Image crop changes.

5. Verify image in card has hover and click state.

6. Verify hover and click state are visible around image.

   • ⚠️ Border is only on 1 side of a card--right image.

add.link.to.card.image.mov

Before	After	After (Hover)	After (Click)