@tacc/core-styles 2.51.0 → 2.53.0

package/dist/trumps/s-guide-doc.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-guide-doc table{max-width:500px;text-align:center;width:100%}.s-guide-doc dt{display:block;float:left;font-weight:var(--bold);margin-bottom:0}.s-guide-doc dt:after{content:":";margin-inline-end:.25em}.s-guide-doc dd{clear:right;margin-bottom:0}.s-guide-doc .row>.col>:last-child{margin-bottom:0}.s-guide-doc .row .row{padding:var(--global-space--normal) 0}.s-guide-doc .row .row:nth-child(2n){background-color:var(--global-color-primary--x-light)}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-guide-doc table{max-width:500px;text-align:center;width:100%}.s-guide-doc dt{display:block;float:left;font-weight:var(--bold);margin-bottom:0}.s-guide-doc dt:after{content:":";margin-inline-end:.25em}.s-guide-doc dd{clear:right;margin-bottom:0}.s-guide-doc .row>.col>:last-child{margin-bottom:0}.s-guide-doc .row .row{padding:var(--global-space--normal) 0}.s-guide-doc .row .row:nth-child(2n){background-color:var(--global-color-primary--x-light)}

package/dist/trumps/s-header/s-header.demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */:root{--global-font-family:var(--global-font-family--sans);--font-family-sans-serif:var(--global-font-family--sans);--font-family-monospace:var(--global-font-family--mono)}main{padding-block:unset;width:unset}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */:root{--global-font-family:var(--global-font-family--sans);--font-family-sans-serif:var(--global-font-family--sans);--font-family-monospace:var(--global-font-family--mono)}main{padding-block:unset;width:unset}

package/dist/trumps/s-header.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-header{--height:50px;--header-major-border-width:1px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:var(--header-major-border-width) solid var(--header-major-border-color);font-family:var(--global-font-family--sans--portal);font-size:14px;font-weight:var(--bold);letter-spacing:.025px;line-height:1.4}.s-header .navbar-brand{height:calc(var(--height) - var(--nav-padding-vert)*2 - var(--header-major-border-width))}.s-header .navbar-brand{align-items:center;display:flex;flex-basis:175px;flex-shrink:0;margin-right:15px;padding:unset}.s-header,.s-header .navbar-collapse{align-items:stretch}.s-header{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--header-bkgd-color);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--border-width:4px;border-color:transparent;border-style:solid;border-width:0 0 var(--border-width);white-space:nowrap}.s-header .navbar-nav .nav-link{padding-inline:14px}@media (min-width:576px){.navbar-expand-sm.s-header .nav-item{display:flex}.navbar-expand-sm.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:768px){.navbar-expand-md.s-header .nav-item{display:flex}.navbar-expand-md.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:992px){.navbar-expand-lg.s-header .nav-item{display:flex}.navbar-expand-lg.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:1200px){.navbar-expand-xl.s-header .nav-item{display:flex}.navbar-expand-xl.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (max-width:575.98px){.navbar-expand-sm.s-header .nav-link{padding-block:8px}}@media (max-width:767.98px){.navbar-expand-md.s-header .nav-link{padding-block:8px}}@media (max-width:991.98px){.navbar-expand-lg.s-header .nav-link{padding-block:8px}}@media (max-width:1199.98px){.navbar-expand-xl.s-header .nav-link{padding-block:8px}}.s-header .nav-item.active .nav-link,.s-header .nav-link:active,.s-header .nav-link:focus,.s-header .nav-link:hover{border-color:var(--global-color-secondary--light)}#s-header .nav-link,#s-header .nav-link>a{color:var(--header-text-color)}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--header-minor-border-color);margin-left:12px}.s-header .dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.s-header .navbar-toggler{border-radius:0;padding:5px 8px}.s-header button.navbar-toggler{line-height:18px}.s-header .navbar-toggler-icon{filter:var(--menu-toggle-icon);height:18px;width:18px}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-header{--height:50px;--header-major-border-width:1px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:var(--header-major-border-width) solid var(--header-major-border-color);font-family:var(--global-font-family--sans--portal);font-size:14px;font-weight:var(--bold);letter-spacing:.025px;line-height:1.4}.s-header .navbar-brand{height:calc(var(--height) - var(--nav-padding-vert)*2 - var(--header-major-border-width))}.s-header .navbar-brand{align-items:center;display:flex;flex-basis:175px;flex-shrink:0;margin-right:15px;padding:unset}.s-header,.s-header .navbar-collapse{align-items:stretch}.s-header{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--header-bkgd-color);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--border-width:4px;border-color:transparent;border-style:solid;border-width:0 0 var(--border-width);white-space:nowrap}.s-header .navbar-nav .nav-link{padding-inline:14px}@media (min-width:576px){.navbar-expand-sm.s-header .nav-item{display:flex}.navbar-expand-sm.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:768px){.navbar-expand-md.s-header .nav-item{display:flex}.navbar-expand-md.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:992px){.navbar-expand-lg.s-header .nav-item{display:flex}.navbar-expand-lg.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (min-width:1200px){.navbar-expand-xl.s-header .nav-item{display:flex}.navbar-expand-xl.s-header .nav-link{align-items:center;display:flex;height:calc(100% + var(--nav-padding-vert) + var(--header-major-border-width));padding-block:5px}}@media (max-width:575.98px){.navbar-expand-sm.s-header .nav-link{padding-block:8px}}@media (max-width:767.98px){.navbar-expand-md.s-header .nav-link{padding-block:8px}}@media (max-width:991.98px){.navbar-expand-lg.s-header .nav-link{padding-block:8px}}@media (max-width:1199.98px){.navbar-expand-xl.s-header .nav-link{padding-block:8px}}.s-header .nav-item.active .nav-link,.s-header .nav-link:active,.s-header .nav-link:focus,.s-header .nav-link:hover{border-color:var(--global-color-secondary--light)}#s-header .nav-link,#s-header .nav-link>a{color:var(--header-text-color)}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--header-minor-border-color);margin-left:12px}.s-header .dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.s-header .navbar-toggler{border-radius:0;padding:5px 8px}.s-header button.navbar-toggler{line-height:18px}.s-header .navbar-toggler-icon{filter:var(--menu-toggle-icon);height:18px;width:18px}

package/dist/trumps/s-hero-banner/s-hero-banner.demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */main{padding-block:unset;width:unset}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */main{padding-block:unset;width:unset}

package/dist/trumps/s-hero-banner.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */:has(>.x-hero-banner){container-type:inline-size}.x-hero-banner{position:relative}.x-hero-banner--wide-context{display:block;height:55.5rem;width:100%}.x-hero-banner--slim-context{display:grid;height:auto}.x-hero-banner__article{--inset-left:48px;background-color:hsla(0,0%,100%,.9);color:var(--global-color-primary--xx-dark);font-weight:700;padding:24px 84px 36px var(--inset-left);z-index:2}.x-hero-banner--wide-context .x-hero-banner__article{--container-gap:0;bottom:50px;box-sizing:border-box;left:0;margin-left:calc(var(--inset-left)*-1 + var(--container-gap));max-width:100cqw;position:absolute;width:610px}.x-hero-banner__title{border-bottom:var(--global-border-width--normal) solid var(--global-color-primary--xx-dark);font-size:2.4rem;margin-bottom:18px;margin-top:0;padding-bottom:14px}.x-hero-banner__media{height:100%;left:50%;-o-object-fit:cover;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:100cqw;z-index:1}:has(>.s-hero-banner){container-type:inline-size}.s-hero-banner{position:relative}@media (min-width:992px){.s-hero-banner{display:block;height:55.5rem;width:100%}.s-hero-banner article{--container-gap:0;bottom:50px;box-sizing:border-box;left:0;margin-left:calc(var(--inset-left)*-1 + var(--container-gap));max-width:100cqw;position:absolute;width:610px}}@media (max-width:991.98px){.s-hero-banner{display:grid;height:auto}}.s-hero-banner article{--inset-left:48px;background-color:hsla(0,0%,100%,.9);color:var(--global-color-primary--xx-dark);font-weight:700;padding:24px 84px 36px var(--inset-left);z-index:2}.s-hero-banner.container article{--container-gap:calc(var(--global-space--bootstrap-gap)/2)}.s-hero-banner h1{border-bottom:var(--global-border-width--normal) solid var(--global-color-primary--xx-dark);font-size:2.4rem;margin-bottom:18px;margin-top:0;padding-bottom:14px}.s-hero-banner img{height:100%;left:50%;-o-object-fit:cover;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:100cqw;z-index:1}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */:has(>.x-hero-banner){container-type:inline-size}.x-hero-banner{position:relative}.x-hero-banner--wide-context{display:block;height:55.5rem;width:100%}.x-hero-banner--slim-context{display:grid;height:auto}.x-hero-banner__article{--inset-left:48px;background-color:hsla(0,0%,100%,.9);color:var(--global-color-primary--xx-dark);font-weight:700;padding:24px 84px 36px var(--inset-left);z-index:2}.x-hero-banner--wide-context .x-hero-banner__article{--container-gap:0;bottom:50px;box-sizing:border-box;left:0;margin-left:calc(var(--inset-left)*-1 + var(--container-gap));max-width:100cqw;position:absolute;width:610px}.x-hero-banner__title{border-bottom:var(--global-border-width--normal) solid var(--global-color-primary--xx-dark);font-size:2.4rem;margin-bottom:18px;margin-top:0;padding-bottom:14px}.x-hero-banner__media{height:100%;left:50%;-o-object-fit:cover;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:100cqw;z-index:1}:has(>.s-hero-banner){container-type:inline-size}.s-hero-banner{position:relative}@media (min-width:992px){.s-hero-banner{display:block;height:55.5rem;width:100%}.s-hero-banner article{--container-gap:0;bottom:50px;box-sizing:border-box;left:0;margin-left:calc(var(--inset-left)*-1 + var(--container-gap));max-width:100cqw;position:absolute;width:610px}}@media (max-width:991.98px){.s-hero-banner{display:grid;height:auto}}.s-hero-banner article{--inset-left:48px;background-color:hsla(0,0%,100%,.9);color:var(--global-color-primary--xx-dark);font-weight:700;padding:24px 84px 36px var(--inset-left);z-index:2}.s-hero-banner.container article{--container-gap:calc(var(--global-space--bootstrap-gap)/2)}.s-hero-banner h1{border-bottom:var(--global-border-width--normal) solid var(--global-color-primary--xx-dark);font-size:2.4rem;margin-bottom:18px;margin-top:0;padding-bottom:14px}.s-hero-banner img{height:100%;left:50%;-o-object-fit:cover;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:100cqw;z-index:1}

package/dist/trumps/s-image-grid.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.x-grid--layout-cols-equal-set-count{grid-template-columns:repeat(var(--count),auto)}.x-grid--layout-cols-equal-min-width{grid-template-columns:repeat(auto-fit,minmax(var(--width),1fr))}.s-image-grid,.x-grid--layout-cols-equal-min-width-max-count{--gap:var(--global-space--grid-gap);--max-cols:7;--min-width:250px;--row-height:auto;--gap-count:calc(var(--max-cols) - 1);--total-gap-width:calc(var(--gap-count)*var(--gap));--max-width:calc((100% - var(--total-gap-width))/var(--max-cols));display:grid;gap:var(--gap);grid-auto-rows:var(--row-height);grid-template-columns:repeat(auto-fill,minmax(max(var(--min-width),var(--max-width)),1fr))}.x-grid--layout-rows-equal-max-height{grid-auto-rows:1fr}.x-grid--layout-rows-equal-set-height{grid-auto-rows:var(--height)}.x-grid--content-align-center{align-items:center;justify-items:center}.s-image-grid *{max-height:100%;max-width:100%}ul.s-image-grid{margin-bottom:unset;padding-inline-start:unset}ul.s-image-grid>li{list-style:none}.s-image-grid>a,.s-image-grid>li,.s-image-grid>li>a{align-items:center;display:flex;justify-content:center}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.x-grid--layout-cols-equal-set-count{grid-template-columns:repeat(var(--count),auto)}.x-grid--layout-cols-equal-min-width{grid-template-columns:repeat(auto-fit,minmax(var(--width),1fr))}.s-image-grid,.x-grid--layout-cols-equal-min-width-max-count{--gap:var(--global-space--grid-gap);--max-cols:7;--min-width:250px;--row-height:auto;--gap-count:calc(var(--max-cols) - 1);--total-gap-width:calc(var(--gap-count)*var(--gap));--max-width:calc((100% - var(--total-gap-width))/var(--max-cols));display:grid;gap:var(--gap);grid-auto-rows:var(--row-height);grid-template-columns:repeat(auto-fill,minmax(max(var(--min-width),var(--max-width)),1fr))}.x-grid--layout-rows-equal-max-height{grid-auto-rows:1fr}.x-grid--layout-rows-equal-set-height{grid-auto-rows:var(--height)}.x-grid--content-align-center{align-items:center;justify-items:center}.s-image-grid *{max-height:100%;max-width:100%}ul.s-image-grid{margin-bottom:unset;padding-inline-start:unset}ul.s-image-grid>li{list-style:none}.s-image-grid>a,.s-image-grid>li,.s-image-grid>li>a{align-items:center;display:flex;justify-content:center}

package/dist/trumps/s-inline-dl.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */dl.s-inline-dl dt{display:block;float:left;font-weight:var(--bold);margin-bottom:0}dl.s-inline-dl dd{clear:right;margin-bottom:0}dl.s-inline-dl dt:after{content:":";margin-inline-end:.25em}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */dl.s-inline-dl dt{display:block;float:left;font-weight:var(--bold);margin-bottom:0}dl.s-inline-dl dd{clear:right;margin-bottom:0}dl.s-inline-dl dt:after{content:":";margin-inline-end:.25em}

package/dist/trumps/s-irregular-links.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.x-link{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.x-link--disabled{opacity:.5;pointer-events:none}.x-link--hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.x-link--active{text-decoration-line:underline;text-decoration-style:dotted}.x-link--irregular{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-line:underline;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.x-link--irregular--disabled{opacity:.5;pointer-events:none}.x-link--irregular--hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-style:dashed;text-decoration-thickness:var(--global-border-width--normal)}.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-style:dotted}.s-irregular-links :is([class*=button--as-link],.btn-link),.s-irregular-links a{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-line:underline;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.s-irregular-links :is([class*=button--as-link],.btn-link):hover,.s-irregular-links a:hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-style:dashed;text-decoration-thickness:var(--global-border-width--normal)}.s-irregular-links :is([class*=button--as-link],.btn-link):active,.s-irregular-links a:active{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-style:dotted}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.x-link{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.x-link--disabled{opacity:.5;pointer-events:none}.x-link--hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.x-link--active{text-decoration-line:underline;text-decoration-style:dotted}.x-link--irregular{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-line:underline;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.x-link--irregular--disabled{opacity:.5;pointer-events:none}.x-link--irregular--hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-style:dashed;text-decoration-thickness:var(--global-border-width--normal)}.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-style:dotted}.s-irregular-links :is([class*=button--as-link],.btn-link),.s-irregular-links a{color:var(--global-color-accent--normal);text-decoration:none;text-decoration-line:underline;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.s-irregular-links :is([class*=button--as-link],.btn-link):hover,.s-irregular-links a:hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-style:dashed;text-decoration-thickness:var(--global-border-width--normal)}.s-irregular-links :is([class*=button--as-link],.btn-link):active,.s-irregular-links a:active{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-style:dotted}

package/dist/trumps/s-paragraph-table.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */

package/dist/trumps/s-portal-nav.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-portal-nav{text-transform:none}ul.s-portal-nav{margin-bottom:0;padding-left:0}.s-portal-nav a:hover{text-decoration:none}.s-portal-nav .icon{font-size:1.5em;margin-right:.25em;vertical-align:middle}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-portal-nav{text-transform:none}ul.s-portal-nav{margin-bottom:0;padding-left:0}.s-portal-nav a:hover{text-decoration:none}.s-portal-nav .icon{font-size:1.5em;margin-right:.25em;vertical-align:middle}

package/dist/trumps/s-references.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-references p+ol{margin-top:unset}.s-references ol li{margin-block:1em}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-references p+ol{margin-top:unset}.s-references ol li{margin-block:1em}

package/dist/trumps/s-style-guide.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-style-guide section:not(.o-section)>h1:first-child,.s-style-guide section:not(.o-section)>h2:first-child,.s-style-guide section:not(.o-section)>h3:first-child,.s-style-guide section:not(.o-section)>h4:first-child,.s-style-guide section:not(.o-section)>h5:first-child,.s-style-guide section:not(.o-section)>h6:first-child,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h1,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h2,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h3,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h4,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h5,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h6{margin-top:var(--global-space--x-large)}.s-style-guide section>h1,.s-style-guide section>h2,.s-style-guide section>h3,.s-style-guide section>h4,.s-style-guide section>h5,.s-style-guide section>h6{margin-bottom:var(--global-space--normal)}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-style-guide section:not(.o-section)>h1:first-child,.s-style-guide section:not(.o-section)>h2:first-child,.s-style-guide section:not(.o-section)>h3:first-child,.s-style-guide section:not(.o-section)>h4:first-child,.s-style-guide section:not(.o-section)>h5:first-child,.s-style-guide section:not(.o-section)>h6:first-child,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h1,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h2,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h3,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h4,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h5,.s-style-guide section>:not(h1,h2,h3,h4,h5,h6)+h6{margin-top:var(--global-space--x-large)}.s-style-guide section>h1,.s-style-guide section>h2,.s-style-guide section>h3,.s-style-guide section>h4,.s-style-guide section>h5,.s-style-guide section>h6{margin-bottom:var(--global-space--normal)}

package/dist/trumps/s-system-specs.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.s-system-specs{font-size:var(--global-font-size--small);font-weight:var(--medium)}@media only screen and (min-width:768px){.s-system-specs{display:flow-root}.s-system-specs>*{display:inline-block}.s-system-specs>figure{float:left}}.s-system-specs{--row-height:32px}.s-system-specs>aside{margin-top:var(--row-height)}@media only screen and (max-width:991.98px){.s-system-specs>figure{margin-bottom:var(--row-height)}}@media only screen and (min-width:992px){.s-system-specs{--col-width--thin:42%;--col-width--wide:48%;--col-gutter:10%;--col-padding:40px;padding-inline:var(--col-padding)}.s-system-specs>aside,.s-system-specs>div{padding-inline:var(--col-padding)}.s-system-specs>div{width:var(--col-width--thin)}.s-system-specs>figure{margin-right:var(--col-gutter);width:var(--col-width--wide)}}@media only screen and (min-width:1200px){.s-system-specs>aside{width:var(--col-width--thin)}}.s-system-specs>figure>img{display:block;width:100%}.s-system-specs>figure>figcaption{margin-top:-40px;position:relative}@media only screen and (max-width:991.98px){.s-system-specs>figure>img{margin-left:auto;margin-right:auto;width:60%}}@media only screen and (min-width:992px){.s-system-specs>figure>figcaption{margin-left:auto;margin-right:auto;width:80%}}.s-system-specs .c-data-list__key a{font-weight:var(--medium)}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.s-system-specs{font-size:var(--global-font-size--small);font-weight:var(--medium)}@media only screen and (min-width:768px){.s-system-specs{display:flow-root}.s-system-specs>*{display:inline-block}.s-system-specs>figure{float:left}}.s-system-specs{--row-height:32px}.s-system-specs>aside{margin-top:var(--row-height)}@media only screen and (max-width:991.98px){.s-system-specs>figure{margin-bottom:var(--row-height)}}@media only screen and (min-width:992px){.s-system-specs{--col-width--thin:42%;--col-width--wide:48%;--col-gutter:10%;--col-padding:40px;padding-inline:var(--col-padding)}.s-system-specs>aside,.s-system-specs>div{padding-inline:var(--col-padding)}.s-system-specs>div{width:var(--col-width--thin)}.s-system-specs>figure{margin-right:var(--col-gutter);width:var(--col-width--wide)}}@media only screen and (min-width:1200px){.s-system-specs>aside{width:var(--col-width--thin)}}.s-system-specs>figure>img{display:block;width:100%}.s-system-specs>figure>figcaption{margin-top:-40px;position:relative}@media only screen and (max-width:991.98px){.s-system-specs>figure>img{margin-left:auto;margin-right:auto;width:60%}}@media only screen and (min-width:992px){.s-system-specs>figure>figcaption{margin-left:auto;margin-right:auto;width:80%}}.s-system-specs .c-data-list__key a{font-weight:var(--medium)}

package/dist/trumps/s-truncated-table.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.x-truncate--many-lines{--lines:2;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines);display:-webkit-box;overflow:hidden}.x-untruncate--many-lines{-webkit-line-clamp:inherit;overflow:visible}.x-untruncate--many-lines{-webkit-line-clamp:inherit;overflow:visible}.x-truncate--one-line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-truncated-table p{--lines:2;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines);display:-webkit-box;overflow:hidden}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.x-truncate--many-lines{--lines:2;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines);display:-webkit-box;overflow:hidden}.x-untruncate--many-lines{-webkit-line-clamp:inherit;overflow:visible}.x-untruncate--many-lines{-webkit-line-clamp:inherit;overflow:visible}.x-truncate--one-line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-truncated-table p{--lines:2;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines);display:-webkit-box;overflow:hidden}

package/dist/trumps/tacc-search-bar.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */:host{--button-horz-pad:10px;--input-horz-pad:0.125em;--input-height:26px;--button-font-size:18px;--input-font-size:14px}:host [part=form]{align-items:center;display:flex;font-family:Roboto;position:relative}:host [part=button]{align-items:center;background-color:transparent;border:none;box-sizing:content-box;color:var(--header-text-color);font-size:16px;font-size:var(--button-font-size);height:var(--input-height,38px);left:0;margin:0;padding:0 var(--button-horz-pad);position:absolute;top:50%;transform:translateY(-50%)}:host [part=input]{background-color:var(--header-search-bkgd-color);border:var(--global-border-width--normal) solid var(--header-search-brdr-color);border-radius:5px;color:var(--header-text-color);display:block;font-size:var(--input-font-size);height:var(--input-height);margin:0;padding-bottom:0;padding-left:calc(var(--button-horz-pad) + var(--button-font-size) + var(--button-horz-pad) + var(--input-horz-pad));padding-right:var(--input-horz-pad);padding-top:0;width:100%}:host [part=input]::-moz-placeholder{color:var(--header-text-color);opacity:.5}:host [part=input]::placeholder{color:var(--header-text-color);opacity:.5}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */:host{--button-horz-pad:10px;--input-horz-pad:0.125em;--input-height:26px;--button-font-size:18px;--input-font-size:14px}:host [part=form]{align-items:center;display:flex;font-family:Roboto;position:relative}:host [part=button]{align-items:center;background-color:transparent;border:none;box-sizing:content-box;color:var(--header-text-color);font-size:16px;font-size:var(--button-font-size);height:var(--input-height,38px);left:0;margin:0;padding:0 var(--button-horz-pad);position:absolute;top:50%;transform:translateY(-50%)}:host [part=input]{background-color:var(--header-search-bkgd-color);border:var(--global-border-width--normal) solid var(--header-search-brdr-color);border-radius:5px;color:var(--header-text-color);display:block;font-size:var(--input-font-size);height:var(--input-height);margin:0;padding-bottom:0;padding-left:calc(var(--button-horz-pad) + var(--button-font-size) + var(--button-horz-pad) + var(--input-horz-pad));padding-right:var(--input-horz-pad);padding-top:0;width:100%}:host [part=input]::-moz-placeholder{color:var(--header-text-color);opacity:.5}:host [part=input]::placeholder{color:var(--header-text-color);opacity:.5}

package/dist/trumps/u-empty.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */

package/dist/trumps/u-hide.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-hide--visually:not(:focus,:active){clip:rect(0 0 0 0);border:none;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-hide--visually:not(:focus,:active){clip:rect(0 0 0 0);border:none;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}

package/dist/trumps/u-highlight/u-highlight.demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-highlight-container{max-width:800px}.u-highlight{background-color:var(--global-color-primary--xxx-dark);color:var(--global-color-primary--xx-light);line-height:1;padding-inline:10px;text-transform:uppercase}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-highlight-container{max-width:800px}.u-highlight{background-color:var(--global-color-primary--xxx-dark);color:var(--global-color-primary--xx-light);line-height:1;padding-inline:10px;text-transform:uppercase}

package/dist/trumps/u-highlight.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-highlight{-webkit-box-decoration-break:clone;box-decoration-break:clone}:is(h1,h2,h3,h4).u-highlight{display:inline}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-highlight{-webkit-box-decoration-break:clone;box-decoration-break:clone}:is(h1,h2,h3,h4).u-highlight{display:inline}

package/dist/trumps/u-image-zoom/u-image-zoom.demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-image-zoom--on-hover{max-width:-moz-fit-content;max-width:fit-content}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-image-zoom--on-hover{max-width:-moz-fit-content;max-width:fit-content}

package/dist/trumps/u-image-zoom.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */:is(.u-image-zoom,[class*=image-zoom--]){--scale:1.5;display:block;overflow:hidden}:is(.u-image-zoom,[class*=image-zoom--])>:is(img,svg){transition:transform .5s ease}a:hover :is(.u-image-zoom,[class*=image-zoom--]) :is(img,svg),a:is(.u-image-zoom,[class*=image-zoom--]):hover :is(img,svg){transform:scale(var(--scale,1.5))}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */:is(.u-image-zoom,[class*=image-zoom--]){--scale:1.5;display:block;overflow:hidden}:is(.u-image-zoom,[class*=image-zoom--])>:is(img,svg){transition:transform .5s ease}a:hover :is(.u-image-zoom,[class*=image-zoom--]) :is(img,svg),a:is(.u-image-zoom,[class*=image-zoom--]):hover :is(img,svg){transform:scale(var(--scale,1.5))}

package/dist/trumps/u-image-zoom.selectors.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */

package/dist/trumps/u-mailto-text-replace.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-mailto-text-replace[data-user][data-domain]{font-size:0;text-underline-offset:.3rem;visibility:hidden}.u-mailto-text-replace[data-user][data-domain]:before{content:attr(data-user) "@" attr(data-domain);display:inline;font-size:initial;visibility:visible}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-mailto-text-replace[data-user][data-domain]{font-size:0;text-underline-offset:.3rem;visibility:hidden}.u-mailto-text-replace[data-user][data-domain]:before{content:attr(data-user) "@" attr(data-domain);display:inline;font-size:initial;visibility:visible}

package/dist/trumps/u-nested-text-content.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.u-nested-text-content{padding-left:var(--global-space--list-indent)}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.u-nested-text-content{padding-left:var(--global-space--list-indent)}

package/dist/trumps/u-summary/u-summary.demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.data-tree{--indent:1.5rem}.data-tree__item details{margin-left:var(--indent)}.data-tree__item summary{margin-left:calc(var(--indent)*-1)}.data-tree__item summary.u-summary-fake-marker:before,.data-tree__item summary.u-summary-with-a-link:before{display:inline-block;width:var(--indent)}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.data-tree{--indent:1.5rem}.data-tree__item details{margin-left:var(--indent)}.data-tree__item summary{margin-left:calc(var(--indent)*-1)}.data-tree__item summary.u-summary-fake-marker:before,.data-tree__item summary.u-summary-with-a-link:before{display:inline-block;width:var(--indent)}

package/dist/trumps/u-summary.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */summary.u-summary-with-a-link>a:not([href]){opacity:1;pointer-events:auto}summary.u-summary-fake-marker,summary.u-summary-with-a-link{list-style:none}summary.u-summary-fake-marker:before,summary.u-summary-with-a-link:before{content:"▸"}details[open]>summary.u-summary-fake-marker:before,details[open]>summary.u-summary-with-a-link:before{content:"▾"}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */summary.u-summary-with-a-link>a:not([href]){opacity:1;pointer-events:auto}summary.u-summary-fake-marker,summary.u-summary-with-a-link{list-style:none}summary.u-summary-fake-marker:before,summary.u-summary-with-a-link:before{content:"▸"}details[open]>summary.u-summary-fake-marker:before,details[open]>summary.u-summary-with-a-link:before{content:"▾"}

package/dist/vendors/bootstrap5/demo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.button-wrapper,.c-form__buttons,:where(.s-form>footer){margin-top:unset}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.button-wrapper,.c-form__buttons,:where(.s-form>footer){margin-top:unset}

package/dist/vendors/bootstrap5--border-spinner.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.51.0+ | MIT | github.com/TACC/Core-Styles */.spinner-border{animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);border-radius:50%;display:inline-block;height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);width:var(--bs-spinner-width)}@keyframes spinner-border{to{transform:rotate(1turn)}}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border-right-color:currentcolor;border:var(--bs-spinner-border-width) solid;border-right:var(--bs-spinner-border-width) solid transparent}@media (prefers-reduced-motion:reduce){.spinner-border{--bs-spinner-animation-speed:1.5s}}
+/*! @tacc/core-styles 2.53.0+ | MIT | github.com/TACC/Core-Styles */.spinner-border{animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);border-radius:50%;display:inline-block;height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);width:var(--bs-spinner-width)}@keyframes spinner-border{to{transform:rotate(1turn)}}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border-right-color:currentcolor;border:var(--bs-spinner-border-width) solid;border-right:var(--bs-spinner-border-width) solid transparent}@media (prefers-reduced-motion:reduce){.spinner-border{--bs-spinner-animation-speed:1.5s}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tacc/core-styles",
-  "version": "2.51.0",
+  "version": "2.53.0",
   "license": "MIT",
   "author": "TACC COA CMD <coa-cmd@tacc.utexas.edu>",
   "contributors": [

package/src/lib/_imports/_partials/figure.hbs

@@ -1,14 +1,18 @@
 <figure {{#if class}}class="{{ class }}"{{/if}}>
   {{#if use-image-wide}}
-    {{> @img large=true wide=true }}
+    {{> @img large=true wide=true class=img-class }}
   {{else if use-image-tall}}
-    {{> @img large=true tall=true }}
+    {{> @img large=true tall=true class=img-class }}
   {{else}}
-    {{> @img }}
+    {{> @img class=img-class }}
   {{/if}}
   <figcaption>
-    I am a &lt;figcaption&gt; within a &lt;figure&gt;. 
-    {{> @message tag="span" type="warning" scope="inline"
-        content="I may be wider than image. If so, should I wrap?" }}
+    {{#if caption}}
+      {{{ caption }}}
+    {{else}}
+      I am a &lt;figcaption&gt; within a &lt;figure&gt;. 
+      {{> @message tag="span" type="warning" scope="inline"
+          content="I may be wider than image. If so, should I wrap?" }}
+    {{/if}}
   </figcaption>
 </figure>

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

@@ -18,7 +18,6 @@ variants:
         - [piped, boxed, piped--before]
         - [piped, piped--after]
         - [piped, boxed, piped--after]
-    status: wip
   - name: no-list
     context:
       show_buttons: true

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

@@ -87,7 +87,7 @@ nav.c-nav--boxed.c-nav--no-list {
 /* Modifiers: Pipes */
 
 nav.c-nav--piped {
-  --pipe-style: var(--global-border--normal);
+  --pipe-style: 1px solid currentColor;
 }
 
 /* To ensure pipe is visible */
@@ -100,33 +100,34 @@ nav[class*="c-nav--piped"] button:--c-button--as-link {
 /* Modifiers: Pipes: Methods */
 
 @custom-selector :--child-no-list
-  > :not(ul,ol);
+  :not(ul,ol);
 @custom-selector :--child-of-list
   :is(ul,ol) > *;
 
-.c-nav--piped--after :--child-of-list,
-.c-nav--piped--after :--child-no-list,
-.c-nav--piped--before :--child-of-list,
-.c-nav--piped--before :--child-no-list {
+.c-nav--piped--after > :--child-of-list,
+.c-nav--piped--after > :--child-no-list,
+.c-nav--piped--before > :--child-of-list,
+.c-nav--piped--before > :--child-no-list {
   position: relative;
 }
-.c-nav--piped--after :--child-of-list::after,
-.c-nav--piped--after :--child-no-list::after,
-.c-nav--piped--before :--child-of-list::before,
-.c-nav--piped--before :--child-no-list::before {
+.c-nav--piped--after > :--child-of-list::after,
+.c-nav--piped--after > :--child-no-list::after,
+.c-nav--piped--before > :--child-of-list::before,
+.c-nav--piped--before > :--child-no-list::before {
   content: '';
   display: block;
   height: 1em;
 
   /* To vertically center (because height ≠ 100%) */
   position: absolute;
+  margin-top: 0.1em;
   top: 50%;
   transform: translateY(-50%);
 }
 
 /* via "after" pseduo-element */
-.c-nav--piped--after :--child-no-list:not(:last-child)::after,
-.c-nav--piped--after :--child-of-list:not(:last-child)::after {
+.c-nav--piped--after > :--child-no-list:not(:last-child)::after,
+.c-nav--piped--after > :--child-of-list:not(:last-child)::after {
   border-right: var(--pipe-style);
   right: calc( -0.5 * var(--link-padding));
 }
@@ -137,8 +138,8 @@ nav[class*="c-nav--piped"] button:--c-button--as-link {
   margin-right: calc( -2 * var(--global-border-width--normal));
 }
 /* via "before" pseduo-element */
-.c-nav--piped--before :--child-no-list:not(:first-child)::before,
-.c-nav--piped--before :--child-of-list:not(:first-child)::before {
+.c-nav--piped--before > :--child-no-list:not(:first-child)::before,
+.c-nav--piped--before > :--child-of-list:not(:first-child)::before {
   border-left: var(--pipe-style);
   left: calc( -0.5 * var(--link-padding));
 }

package/src/lib/_imports/objects/o-offset-content/config.yml

@@ -0,0 +1,3 @@
+status: ready
+context:
+  shouldSkipPattern: false

package/src/lib/_imports/objects/o-offset-content/o-offset-content.hbs

@@ -0,0 +1,13 @@
+<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
+
+{{> @figure class="o-offset-content--right" caption="This figure is offset to the right.<br>On narrow screens, it is<br><strong>not</strong> explicitely offset." }}
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
+
+{{> @figure class="o-offset-content--left" caption="This figure is offset to the left.<br>On narrow screens, it is<br><strong>not</strong> explicitely offset." }}
+
+<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet.</p>
+
+<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.</p>

package/src/lib/_imports/objects/o-offset-content/readme.md

@@ -0,0 +1,10 @@
+Content that should be:
+1. offset from the flow of text within which it is placed
+2. not offset at narrow viewports
+
+| Class | Description
+| - | - |
+| `.offset-content--left` | offset content to the left |
+| `.offset-content--right` | offset content to the right |
+
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/objects/o-offset-content.css

@@ -8,35 +8,38 @@ Content that should be:
 Styleguide Objects.OffsetContent
 */
 @import url("../tools/media-queries.css");
+@import url("../tools/x-offset-content.css");
 
 .o-offset-content--left,
 .o-offset-content--right {
-  	--offset-distance: 12vw;
-	--buffer: calc( 2 * var(--global-space--grid-gap) );
-
-    max-width: 85%;
+	@mixin offset-content;
 }
 
 /* To merely float content on narrow screens */
 @media only screen and (--medium-and-above) {
 	.o-offset-content--right {
-		float: right;
-		margin-left: var(--buffer);
+		@mixin offset-content--float-right;
+		& + & {
+			@mixin offset-content--terminate-offset-right;
+		}
 	}
-	.o-offset-content--right + .o-offset-content--right { clear: right; }
 
 	.o-offset-content--left {
-		float: left;
-		margin-right: var(--buffer);
+		@mixin offset-content--float-left;
+		& + & {
+			@mixin offset-content--terminate-offset-left;
+		}
 	}
-	.o-offset-content--left + .o-offset-content--left { clear: left; }
 
-    .figure:is(
-	  .o-offset-content--left,
-	  .o-offset-content--right
+	/* WARNING: Seems specific to one website's use case */
+	/* TODO: Determine whether to apply to:
+	          <figcaption>, only CMS, only Texascale */
+	.figure:is(
+		.o-offset-content--left,
+		.o-offset-content--right
 	) .figure-caption {
-        padding-right: 125px;
-    }
+		padding-right: 125px;
+	}
 }
 
 /* To offset content only on wide screens */
@@ -44,9 +47,9 @@ Styleguide Objects.OffsetContent
 /* FAQ: M.S. did on texascale.org but that may have been only for that site */
 @media only screen and (--medium-and-above)/* and (--max-wide-and-below) */{
 	.o-offset-content--right {
-		margin-right: calc( var(--offset-distance) * -1);
+		@mixin offset-content--offset-right;
 	}
 	.o-offset-content--left {
-		margin-left: calc( var(--offset-distance) * -1);
+		@mixin offset-content--offset-left;
 	}
 }

package/src/lib/_imports/tools/x-offset-content/config.yml

@@ -0,0 +1,5 @@
+status: ready
+context:
+  shouldSkipPattern: false
+  supportStyles:
+    - ../../assets/tools/x-offset-content.demo.css

package/src/lib/_imports/tools/x-offset-content/readme.md

@@ -0,0 +1,14 @@
+Mixins for content that can be offset from the flow of text within which it is placed.
+
+| Mixin | Description
+| - | -
+| `offset-content` | base styles |
+| `offset-content--float-left` | float content to the left |
+| `offset-content--float-right` | float content to the right |
+| `offset-content--offset-left` | offset content to the left |
+| `offset-content--offset-right` | offset content to the right |
+| `offset-content--terminate-offset-left` | terminate offset sequence for left-floated content (prevents consecutive elements from stacking) |
+| `offset-content--terminate-offset-right` | terminate offset sequence for right-floated content (prevents consecutive elements from stacking) |
+| `offset-content__figure-caption` | style for figure captions within offset content |
+
+<script src="{{path '/assets/_utils/js/open-ext-links-in-new-window.js'}}" />

package/src/lib/_imports/tools/x-offset-content/x-offset-content.hbs

@@ -0,0 +1,14 @@
+<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
+
+{{> @figure class="x-offset-content--right" caption="This figure is offset to the right." }}
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
+
+{{> @figure class="x-offset-content--left" caption="This figure is offset to the left." }}
+
+<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet.</p>
+
+<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.</p>
+

package/src/lib/_imports/tools/x-offset-content.css

@@ -0,0 +1,37 @@
+/* Base */
+
+@define-mixin offset-content {
+	--offset-distance: 12vw;
+	--buffer: calc( 2 * var(--global-space--grid-gap) );
+
+	max-width: 85%;
+}
+
+
+/* Modifiers */
+
+@define-mixin offset-content--float-left {
+	float: left;
+	margin-right: var(--buffer);
+}
+
+@define-mixin offset-content--float-right {
+	float: right;
+	margin-left: var(--buffer);
+}
+
+@define-mixin offset-content--offset-left {
+	margin-left: calc( var(--offset-distance) * -1);
+}
+
+@define-mixin offset-content--offset-right {
+	margin-right: calc( var(--offset-distance) * -1);
+}
+
+@define-mixin offset-content--terminate-offset-left {
+	clear: left;
+}
+
+@define-mixin offset-content--terminate-offset-right {
+	clear: right;
+}

package/src/lib/_imports/tools/x-offset-content.demo.css

@@ -0,0 +1,24 @@
+/* This CSS is ONLY for the pattern library. It is NOT part of the pattern. */
+
+@import url("./x-offset-content.css");
+
+.x-offset-content--left,
+.x-offset-content--right {
+	@mixin offset-content;
+}
+
+.x-offset-content--right {
+	@mixin offset-content--float-right;
+	@mixin offset-content--offset-right;
+	& + & {
+		@mixin offset-content--terminate-offset-right;
+	}
+}
+
+.x-offset-content--left {
+	@mixin offset-content--float-left;
+	@mixin offset-content--offset-left;
+	& + & {
+		@mixin offset-content--terminate-offset-left;
+	}
+}