hotfix: tup-654 mfa c nav pipe not showing

[wesleyboar]

Overview

Show the invisible pipe between header links in MFA section.

Details

### Problems On the first link (the ``), multiple `overflow: hidden`'s were overriding the `overflow: visible` from `c-nav`.

1. From `TextCopyField.module.css` via `c-button.css`: 1. The `x-truncate`'s `overflow: hidden` overwrote `overflow: visible`. 2. It should be the other way around. 3. Composing from `c-button.css` from `dist/` includes entire file into global scope. 2. From `main.global.css` via `c-form--login.css`: 1. The `x-truncate`'s `overflow: hidden` overwrote `overflow: visible`. 2. It should be the other way around. 3. Importing `c-form--login.css` without layer gave it precedence.

### Solutions 1. Compose from `/src`, to allow CSS pre-processing to get only what is necessary. 2. Import into `base` layer, so all (relevant) Core-Styles are in base. ### Lessons 1. Always `composes` from `/src` (not `/dist`). 2. Always `@import` Core-Styles into `base` layer (not "anonymous").

Related

• TUP-654
• exacerbated by #374

Changes

• changed composes path to be from src/ instead of dist/
• changed import to be in base layer instead of "anonymous"

Testing

1. Open https://dev.tup.tacc.utexas.edu/portal/mfa.
2. Verify there is a pipe between "Get Help" and "MFA Documentation".

UI

Before	After