@tacc/core-styles 2.17.5 → 2.19.0

package/src/lib/_imports/components/c-pill.selectors.css

@@ -0,0 +1,28 @@
+@import url("../tools/selectors.css");
+
+@custom-selector :--c-pill
+    .c-pill,
+    [class*="pill--"];
+
+@custom-selector :--c-pill--should-truncate
+    .c-pill--should-truncate,
+    [class*="pill--truncate"];
+
+@custom-selector :--c-pill--is-danger
+    .c-pill--is-danger,
+    [class*="pill--danger"];
+@custom-selector :--c-pill--is-success
+    .c-pill--is-success,
+    [class*="pill--success"];
+@custom-selector :--c-pill--is-warning
+    .c-pill--is-warning,
+    [class*="pill--warning"];
+@custom-selector :--c-pill--is-normal
+    .c-pill--is-normal,
+    [class*="pill--normal"];
+@custom-selector :--c-pill--is-fixed
+    .c-pill--is-fixed,
+    [class*="pill--fixed"];
+@custom-selector :--c-pill--is-updated
+    .c-pill--is-updated,
+    [class*="pill--updated"];

package/src/lib/_imports/components/c-tag/01-c-tag--types.hbs

@@ -0,0 +1,14 @@
+<dl>
+  <dt>Standard</dt>
+  <dd>
+    There are no standard tag types.<br />
+    <small>Clients must create their own modifier classes.</small>
+  </dd>
+  <dt>Custom</dt>
+  <dd>
+    There are <a href="https://github.com/TACC/tup-ui/blob/v1.0.13/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-tag.css#L11-L63" target="_blank">examples (code) on TACC website</a>.
+  </dd>
+  <dd>
+    {{> @c-tag type="whatever" name="whatever" }}
+  </dd>
+</dl>

package/src/lib/_imports/components/c-tag/02-c-tag--html-elements.hbs

@@ -0,0 +1 @@
+{{> @inline-element-samples class="c-tag" name="tag" }}

package/src/lib/_imports/components/c-tag/c-tag.hbs

@@ -1,22 +1 @@
-<dl>
-  <dt><code>&lt;span&gt;</code> <small>e.g. <code>display: inline</code></small></dt>
-  <dd>
-    <span class="c-tag">i am tag</span>
-  </dd>
-  <dt><code>&lt;span <small>style="display: inline-block"</small>&gt;</code></dt>
-  <dd>
-    <span class="c-tag" style="display: inline-block">i am tag</span>
-  </dd>
-  <dt><code>&lt;div&gt;</code> <small>e.g. <code>display: block</code></small></dt>
-  <dd>
-    <div class="c-tag">i am tag</div>
-  </dd>
-  <dt><code>&lt;a&gt;</code></dt>
-  <dd>
-    <a href="#" class="c-tag">i am tag</a>
-  </dd>
-  <dt><code>&lt;button&gt;</code></dt>
-  <dd>
-    <button class="c-tag">i am tag</button>
-  </dd>
-</dl>
+<span class="c-tag c-tag--is-{{ type }}">{{ name }}</span>

package/src/lib/_imports/components/c-tag/config.yml

@@ -0,0 +1,6 @@
+status: ready
+variants:
+  - name: default
+    hidden: true
+  - name: html-elements
+    label: HTML Elements

package/src/lib/_imports/components/c-tag/demo.css

@@ -1,6 +1,11 @@
 /* This CSS is ONLY for the pattern library. It is NOT part of the pattern. */
 
-.c-tag {
+.c-tag:not([class*="c-tag--"]) {
   color: var(--global-color-primary--xx-light);
   background-color: var(--global-color-primary--xxx-dark);
 }
+
+.c-tag--is-whatever {
+  color: var(--global-color-tertiary--xx-light);
+  background-color: var(--global-color-tertiary--dark);
+}

package/src/lib/_imports/components/c-tag/readme.md

@@ -1 +1,6 @@
 To organize similar elements e.g. category, tag, type, group.
+
+| Class (Std.)               | Class (Alt.)             | Description
+| - | - | - |
+| `.c-tag`                   | `.tag`                   | space, shape, and size
+| `.c-tag--is-...`           | `.tag--...`              | to apply custom colors

package/src/lib/_imports/components/c-tag.css

@@ -12,4 +12,4 @@
   font-weight: var(--bold);
   text-transform: uppercase;
   white-space: nowrap;
-}
+}

package/src/lib/_imports/components/c-tag.selectors.css

@@ -1,5 +1,3 @@
-@import url("../tools/selectors.css");
-
 @custom-selector :--c-tag
     .c-tag,
     [class*="tag--"];

package/src/lib/_imports/components/c-update/c-update.hbs

@@ -0,0 +1,27 @@
+<dl>
+  <dt>Update</dt>
+  <dd>
+    <aside class="c-update">
+      <header class="c-update__header">
+        <h3 class="c-update__title">
+          <span class="c-pill c-pill--is-updated">Update</span>&nbsp;
+        </h3>
+        <span>Published:</span>&nbsp;
+        <time datetime="2023-10-13T14:27:18.637000">
+          October 13, 2023
+        </time>
+      </header>
+    </aside>
+  </dd>
+  <dd>
+  </dd>
+  <dt>Original</dt>
+  <dd>
+    <header class="c-update__header">
+      <span>Published:</span>&nbsp;
+      <time datetime="2023-10-03T17:55:22.513000">
+        October 03, 2023
+      </time>
+    </header>
+  </dd>
+</dl>

package/src/lib/_imports/components/c-update/config.yml

@@ -0,0 +1,3 @@
+status: ready
+context:
+  shouldLoadCMS: true

package/src/lib/_imports/components/c-update/readme.md

@@ -0,0 +1,2 @@
+- Will show "Update" pill and date
+- Will show "ORIGINAL MESSAGE" and date

package/src/lib/_imports/components/c-update.css

@@ -0,0 +1,10 @@
+.c-update__header {
+    display: flex;
+    align-items: baseline;
+}
+
+.c-update__title {
+    margin-right: 0.5em;
+
+    text-transform: uppercase;
+}

package/src/lib/_imports/components/django-cms-forms/readme.md

@@ -12,9 +12,4 @@ To style forms built by [Django CMS forms][djcms-forms].
 [djcms-forms-tpl]: https://github.com/avryhof/djangocms-forms/blob/ab38b22/djangocms_forms/templates/djangocms_forms/form_template/default.html "DjangoCMS Forms (Maintained) Template"
 [django-form-widgets]: https://docs.djangoproject.com/en/2.2/ref/forms/widgets/ "Django Form Widgets"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/components/pymdownx/pymdownx.readme.md

@@ -1,8 +1,3 @@
 Styles for markup with classes from [PyMdown Extensions](https://facelessuser.github.io/pymdown-extensions/).
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/components/tacc-docs/readme.md

@@ -15,9 +15,4 @@ Components used on [TACC-Docs].
 [TACC-Docs]: https://github.com/TACC/TACC-Docs/
 [Node]: https://nodejs.org/en/
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/core-styles.base.css

@@ -10,8 +10,9 @@
 /* GENERICS */
 /* Mostly from Bootstrap */
 /* https://confluence.tacc.utexas.edu/x/b53tDg */
-@import url('./generics/fonts.css');
+@import url("./generics/fonts.css");
 @import url("./generics/pseudo-elements.css");
+@import url("./generics/attributes.css");
 
 /* ELEMENTS */
 /* To override Bootstrap */
@@ -40,6 +41,7 @@
 @import url("./components/c-island.css");
 @import url("./components/c-nav.css");
 @import url("./components/c-page.css");
+@import url("./components/c-pill.css");
 @import url("./components/c-see-all-link.css");
 @import url("./components/c-tag.css");
 

package/src/lib/_imports/core-styles.cms.css

@@ -26,17 +26,22 @@
 @import url("./objects/o-float-content.css");
 @import url("./objects/o-offset-content.css");
 @import url("./objects/o-section.css");
+@import url("./objects/o-heading-steps.css");
+
 
 /* COMPONENTS */
 @import url("./components/bootstrap.col.css");
 @import url("./components/bootstrap.modal--cms.css");
 @import url("./components/bootstrap.row.css");
+@import url("./components/c-content-block.css");
 @import url("./components/cortal.icon.css");
 @import url("./components/c-card.css");
 @import url("./components/c-form--cms.css");
 @import url("./components/c-message.css");
 @import url("./components/c-message--expanded.css");
 @import url("./components/c-recognition.css");
+@import url("./components/c-update.css");
+
 /* TODO: Move to TACC/Core-CMS-Resources:/frontera-cms
         or — alternatively — TACC/Core-CMS */
 @import url("./components/c-card--frontera-about-page.css");

package/src/lib/_imports/elements/form.cms/readme.md

@@ -8,9 +8,4 @@
 >
 > These overwrite, but may accidentally rely on, [Bootstrap Reboot: Forms](https://getbootstrap.com/docs/4.0/content/reboot/#forms).
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/headings/readme.md

@@ -4,9 +4,4 @@
 <h1> <h2> <h3> <h4> <h5> <h6>
 ```
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/links/readme.md

@@ -1,8 +1,3 @@
 The [`<a>` anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a).
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/root/readme.md

@@ -1,8 +1,3 @@
 The [`<html>` element (Main root)](https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Main_root) and [`<body>` element (Sectioning root)](https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Sectioning_root).
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/table/readme.md

@@ -4,9 +4,4 @@
 <table> <thead> <tbody> <th> <td> <tfoot> <colgroup> <col> <caption>
 ```
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/table/table--via-paragraphs.readme.md

@@ -5,9 +5,4 @@ A [table]({{path './table' }}) that uses [paragraphs](https://developer.mozilla.
 > - Text will not truncate. It will wrap.
 > - Only a single column is supported.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/elements/table/table--with-paragraphs.readme.md

@@ -4,9 +4,4 @@ A [table]({{path './table' }}) with cells that have [paragraphs](https://develop
 >
 > On [Portal tables]({{path './table--with-paragraphs-portal' }}) and [`s-truncated-table`s]({{path './s-data-table' }}), text in a `<p>` tag. will truncate at N lines; see [truncate mixin]({{path './x-truncate' }}) to control line count.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/generics/attributes/attributes.hbs

@@ -0,0 +1,3 @@
+<time data-prefix="Published:" >
+  <span>OCTOBER 3, 2023</span>
+</time>

package/src/lib/_imports/generics/attributes/readme.md

@@ -0,0 +1 @@
+Renders data-prefix attribute value as prefix to text. Typically used in blog titles.

package/src/lib/_imports/generics/attributes.css

@@ -0,0 +1,12 @@
+/* To render data-prefix value as prefixed text */
+[data-prefix]::before {
+  display: inline-block;
+  content: attr(data-prefix);
+  margin-right: 0.25ch;
+
+  text-transform: none;
+}
+
+[disabled] {
+  pointer-events: none;
+}

package/src/lib/_imports/objects/o-fixed-header-table/readme.md

@@ -14,9 +14,4 @@ A [table]({{path './table' }}) with its header pinned during vertical scroll.
 
 [source]: https://css-tricks.com/position-sticky-and-table-headers/ "CSS Tricks: Position Sticky & Table Headers"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-flex-item-table-wrap/readme.md

@@ -14,9 +14,4 @@ Make [table]({{path './table' }}) behave like a flex item, for a specific CEPv2
 
 [source]: https://stackoverflow.com/a/41421700/11817077 "Stack Overflow: Why does flex-box work with a div, but not a table?"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-heading-steps/config.yml

@@ -0,0 +1,3 @@
+status: ready
+context:
+  shouldLoadCMS: true

package/src/lib/_imports/objects/o-heading-steps/o-heading-steps.hbs

@@ -0,0 +1,14 @@
+<div class="heading-steps">
+    <article class="heading-steps__item">
+      <h3>Create an Account</h3>
+    </article>
+    <article class="heading-steps__item">
+      <h3>Request Allocations</h3>
+    </article>
+    <article class="heading-steps__item">
+      <h3>Learn How to Use Our Resources</h3>
+    </article>
+    <article class="heading-steps__item">
+          <h3>Work With Our Team</h3>
+    </article>
+</div>

package/src/lib/_imports/objects/o-heading-steps/readme.md

@@ -0,0 +1,2 @@
+Heading Steps will add numbers to the beginning of a heading. 
+A visual representation of this is shown in the numebers 1-4 listed in the example above.

package/src/lib/_imports/objects/o-heading-steps.css

@@ -0,0 +1,17 @@
+/* To add numbers to steps */
+.heading-steps,
+[class*="heading-steps--"] {
+  counter-reset: step;
+}
+
+.heading-steps :is(h1, h2, h3, h4, h5, h6),
+[class*="heading-steps--"] :is(h1, h2, h3, h4, h5, h6) {
+  counter-increment: step;
+}
+
+.heading-steps--root :is(h1, h2, h3, h4, h5, h6)::before,
+.heading-steps__item :is(h1, h2, h3, h4, h5, h6)::before {
+  content: counter(step) '. ';
+  color: var(--global-color-accent--secondary);
+  font-weight: var(--medium);
+}

package/src/lib/_imports/objects/o-section/readme.md

@@ -24,9 +24,4 @@ Older features are not illustrated in the demo:
 | `.o-section--layout-c`    | (on wider screens) 1 narrow column & 1 wide column
 | `.o-section--layout-d`    | (on wider screens) 3 even columns
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/o-table-wrap--flexible-horz.readme.md

@@ -12,9 +12,4 @@ For extra customization, see relevant <code>extra…</code> "File" from "Assets"
 
 [source-flex]: https://stackoverflow.com/a/41421700/11817077 "Stack Overflow: Why does flex-box work with a div, but not a table?"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/o-table-wrap--flexible-vert.readme.md

@@ -10,9 +10,4 @@ Make [table]({{path './table' }}) width able to <strong>stretch</strong> <em>but
 
 [source-flex]: https://stackoverflow.com/a/41421700/11817077 "Stack Overflow: Why does flex-box work with a div, but not a table?"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/o-table-wrap--overflow-hidden.readme.md

@@ -6,9 +6,4 @@ For extra customization, see relevant <code>extra…</code> "File" from "Assets"
 >
 > This class can **only** be used on a table wrapper. It has **no** affect when used on table directly.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/o-table-wrap--overflow-scroll-extra.readme.md

@@ -10,9 +10,4 @@ Make [table]({{path './table' }}) overflow <strong>scrollable</strong> (advanced
 
 [source-scroll]: https://stackoverflow.com/a/19794391/11817077 "Stack Overflow: Horizontal scroll on overflow of table (answer)"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/o-table-wrap--overflow-scroll.readme.md

@@ -12,9 +12,4 @@ For extra customization, see relevant <code>extra…</code> "File" from "Assets"
 
 [source-scroll]: https://stackoverflow.com/a/19794391/11817077 "Stack Overflow: Horizontal scroll on overflow of table (answer)"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-table-wrap/readme.md

@@ -16,9 +16,4 @@ For client customization examples, see relevant <code>example.…-….css</code>
 [source-flex]: https://stackoverflow.com/a/41421700/11817077 "Stack Overflow: Why does flex-box work with a div, but not a table?"
 [source-scroll]: https://stackoverflow.com/a/19794391/11817077 "Stack Overflow: Horizontal scroll on overflow of table (answer)"
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/settings/color/readme.md

@@ -1,8 +1,3 @@
 [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Variables) for colors.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/settings/font/readme.md

@@ -1,8 +1,3 @@
 [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Variables) for [font](https://developer.mozilla.org/en-US/docs/Web/CSS/font) properties.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/tools/x-link/readme.md

@@ -7,9 +7,4 @@ UI states of [`<a>` anchor element](https://developer.mozilla.org/en-US/docs/Web
 | `.x-link--hover`  | `:hover` state
 | `.x-link--active` | `:active` (click) state
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/tools/x-tabs/readme.md

@@ -14,9 +14,4 @@ Mixins for tab components e.g. [Bootstrap Nav Tabs]({{path './bootstrap--nav-tab
 | `.x-tabs__content--active`       | visible content
 | `.x-tabs__content--force-active` | to force content to be visible
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/trumps/s-affixed-input-wrapper/README.md

@@ -16,9 +16,4 @@ _This is an isolated feature from [Bootstrap Input Group](https://getbootstrap.c
    - `<input type="date">` calendar
    - `<input type="time">` clock
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/trumps/s-blockquote/readme.md

@@ -4,9 +4,4 @@ A [`<blockquote>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blo
 >
 > Should this be implemented as `figure.has-blockquote` (fallback) `figure:has(blockquote)` (actual)? We can retain legacy support for `figure.s-blockquote` as an alternate class name.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/trumps/s-form/readme.md

@@ -1,8 +1,3 @@
 To style when mostly raw [Form elements](https://developer.mozilla.org/en-US/docs/Web/HTML/Element#table_content) are sufficient.
 
-<script>
-/* To open external links in new window */
-Array.from(document.links)
-  .filter(link => link.hostname != window.location.hostname)
-  .forEach(link => link.target = '_blank');
-</script>
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/trumps/s-form-page/_s-form-page--footer.hbs

@@ -0,0 +1,13 @@
+<footer>
+  <a href="https://tacc.utexas.edu/about/security-and-compliance/">
+    Security
+  </a>
+  <a href="https://tacc.utexas.edu/use-tacc/user-policies/">
+    Policies
+  </a>
+  <a href="https://www.nsf.gov/" target="_blank">
+    Funded by:
+    <img src="https://cep.tacc.utexas.edu/static/site_cms/img/org_logos/nsf-logo.svg"
+      alt="NSF" title="National Science Foundation" height="50px">
+  </a>
+</footer>

package/src/lib/_imports/trumps/s-form-page/s-form-page--login.hbs

@@ -1,11 +1,4 @@
 <div class="s-form-page">
   {{ render '@s-form--login' }}
-  <footer>
-    <a href="https://tacc.utexas.edu/about/security-and-compliance/">
-      Security
-    </a>
-    <a href="https://tacc.utexas.edu/use-tacc/user-policies/">
-      Policies
-    </a>
-  </footer>
+  {{> @s-form-page--footer }}
 </div>

package/src/lib/_imports/trumps/s-form-page/s-form-page.hbs

@@ -2,12 +2,5 @@
   <form>
     [ form goes here ]
   </form>
-  <footer>
-    <a href="https://tacc.utexas.edu/about/security-and-compliance/">
-      Security
-    </a>
-    <a href="https://tacc.utexas.edu/use-tacc/user-policies/">
-      Policies
-    </a>
-  </footer>
+  {{> @s-form-page--footer }}
 </div>