@tacc/core-styles 2.0.1 → 2.0.2

package/dist/trumps/s-article-preview.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.x-truncate--many-lines,[class*=s-article-list--] .s-article-preview p:not(:first-child):not(:last-child){--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-truncate--one-line,[class*=s-article-list--] .s-article-preview h3{overflow:hidden;text-overflow:var(--text-overflow,ellipsis);white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-article-preview p:last-child>a,.x-article-link-stretch{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.s-article-list--layout-gapless .s-article-preview p:last-child>a,.x-article-link-stretch--gapless{left:-15px;width:calc(100% + 30px)}.s-article-preview p:last-child>a:hover,.x-article-link-hover{--outline-offset:1em;outline:1px solid var(--global-color-accent--normal);outline-offset:var(--outline-offset)}.s-article-list--layout-gapless .s-article-preview p:last-child>a:hover,.x-article-link-hover--gapless{--outline-offset:0}.s-article-preview{display:flex;flex-direction:column;position:relative}.s-article-preview p:first-child{margin-bottom:.8rem;order:1;overflow:hidden}.s-article-preview p:first-child>img{left:50%;position:relative;top:50%;transform:translate(-50%,-50%)}.s-article-preview p:first-child>img.img-fluid{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.s-article-list--news .s-article-preview p:first-child{height:180px}.s-article-list--allocations .s-article-preview p:first-child{height:10rem}.s-article-list--events .s-article-preview p:first-child{display:none}.s-article-preview h3{font-size:1.8rem;font-weight:var(--bold);line-height:2.4rem;margin-bottom:.8rem;margin-top:0;order:3}.s-article-list--allocations .s-article-preview h3{color:inherit;font-size:1.6rem;font-weight:var(--bold)}.s-article-list--events .s-article-preview h3{font-size:1.4rem}.s-article-preview p:not(:first-child):not(:last-child){font-size:1.6rem;line-height:2.4rem;margin-bottom:0;order:4}[class*=s-article-list--] .s-article-preview p:not(:first-child):not(:last-child){--lines:3}.s-article-list--allocations .s-article-preview p:not(:first-child):not(:last-child){display:none}.s-article-list--events .s-article-preview p:not(:first-child):not(:last-child){color:var(--global-color-primary--xx-dark);font-size:1.4rem}.s-article-preview ul{display:flex;flex-direction:column;list-style:none;margin-bottom:.8rem;order:2;padding-left:0}.s-article-list--allocations .s-article-preview ul{order:5}.s-article-preview ul>li:first-child{display:flex;flex-direction:row;flex-wrap:wrap;font-weight:var(--medium);order:2}.s-article-list--news .s-article-preview ul>li:first-child{font-size:1rem;margin-bottom:.8rem}.s-article-list--news .s-article-preview ul>li:first-child:before{content:"Published: ";white-space:pre}.s-article-list--events .s-article-preview ul>li:first-child{color:var(--global-color-accent--normal);font-size:1.4rem}.s-article-list--allocations .s-article-preview ul>li:first-child{font-size:1.6rem}.s-article-list--allocations .s-article-preview ul>li:first-child:before{content:"Submission Deadlines: ";white-space:pre}.s-article-preview ul>li:nth-child(2){font-size:1.2rem;font-weight:var(--bold);order:1;text-transform:uppercase}.s-article-list--allocations .s-article-preview ul>li:nth-child(2),.s-article-list--events .s-article-preview ul>li:nth-child(2){display:none}.s-article-preview ul>li:nth-child(3){order:3}.s-article-list--allocations .s-article-preview ul>li:nth-child(3),.s-article-list--events .s-article-preview ul>li:nth-child(3),.s-article-list--news .s-article-preview ul>li:nth-child(3){display:none}.s-article-preview p:last-child{margin-bottom:0}.s-article-preview p:last-child{z-index:1}.s-article-preview p:last-child>a{color:transparent}.s-article-list--layout-compact .s-article-preview>*{margin-bottom:0}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.x-truncate--many-lines,[class*=s-article-list--] .s-article-preview p:not(:first-child):not(:last-child){--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-truncate--one-line,[class*=s-article-list--] .s-article-preview h3{overflow:hidden;text-overflow:var(--text-overflow,ellipsis);white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-article-preview p:last-child>a,.x-article-link-stretch{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.s-article-list--layout-gapless .s-article-preview p:last-child>a,.x-article-link-stretch--gapless{left:-15px;width:calc(100% + 30px)}.s-article-preview p:last-child>a:hover,.x-article-link-hover{--outline-offset:1em;outline:1px solid var(--global-color-accent--normal);outline-offset:var(--outline-offset)}.s-article-list--layout-gapless .s-article-preview p:last-child>a:hover,.x-article-link-hover--gapless{--outline-offset:0}.s-article-preview{display:flex;flex-direction:column;position:relative}.s-article-preview p:first-child{margin-bottom:.8rem;order:1;overflow:hidden}.s-article-preview p:first-child>img{left:50%;position:relative;top:50%;transform:translate(-50%,-50%)}.s-article-preview p:first-child>img.img-fluid{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.s-article-list--news .s-article-preview p:first-child{height:180px}.s-article-list--allocations .s-article-preview p:first-child{height:10rem}.s-article-list--events .s-article-preview p:first-child{display:none}.s-article-preview h3{font-size:1.8rem;font-weight:var(--bold);line-height:2.4rem;margin-bottom:.8rem;margin-top:0;order:3}.s-article-list--allocations .s-article-preview h3{color:inherit;font-size:1.6rem;font-weight:var(--bold)}.s-article-list--events .s-article-preview h3{font-size:1.4rem}.s-article-preview p:not(:first-child):not(:last-child){font-size:1.6rem;line-height:2.4rem;margin-bottom:0;order:4}[class*=s-article-list--] .s-article-preview p:not(:first-child):not(:last-child){--lines:3}.s-article-list--allocations .s-article-preview p:not(:first-child):not(:last-child){display:none}.s-article-list--events .s-article-preview p:not(:first-child):not(:last-child){color:var(--global-color-primary--xx-dark);font-size:1.4rem}.s-article-preview ul{display:flex;flex-direction:column;list-style:none;margin-bottom:.8rem;order:2;padding-left:0}.s-article-list--allocations .s-article-preview ul{order:5}.s-article-preview ul>li:first-child{display:flex;flex-direction:row;flex-wrap:wrap;font-weight:var(--medium);order:2}.s-article-list--news .s-article-preview ul>li:first-child{font-size:1rem;margin-bottom:.8rem}.s-article-list--news .s-article-preview ul>li:first-child:before{content:"Published: ";white-space:pre}.s-article-list--events .s-article-preview ul>li:first-child{color:var(--global-color-accent--normal);font-size:1.4rem}.s-article-list--allocations .s-article-preview ul>li:first-child{font-size:1.6rem}.s-article-list--allocations .s-article-preview ul>li:first-child:before{content:"Submission Deadlines: ";white-space:pre}.s-article-preview ul>li:nth-child(2){font-size:1.2rem;font-weight:var(--bold);order:1;text-transform:uppercase}.s-article-list--allocations .s-article-preview ul>li:nth-child(2),.s-article-list--events .s-article-preview ul>li:nth-child(2){display:none}.s-article-preview ul>li:nth-child(3){order:3}.s-article-list--allocations .s-article-preview ul>li:nth-child(3),.s-article-list--events .s-article-preview ul>li:nth-child(3),.s-article-list--news .s-article-preview ul>li:nth-child(3){display:none}.s-article-preview p:last-child{margin-bottom:0}.s-article-preview p:last-child{z-index:1}.s-article-preview p:last-child>a{color:transparent}.s-article-list--layout-compact .s-article-preview>*{margin-bottom:0}

package/dist/trumps/s-blockquote.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-blockquote blockquote{font-style:italic;margin:unset}.s-blockquote blockquote p{margin:0;white-space:pre-wrap}.s-blockquote blockquote p:before{content:"“"}.s-blockquote blockquote p:after{content:"”"}.s-blockquote figcaption{margin-top:.3em}.s-blockquote figcaption:before{content:"— "}.s-blockquote cite{font-style:unset}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-blockquote blockquote{font-style:italic;margin:unset}.s-blockquote blockquote p{margin:0;white-space:pre-wrap}.s-blockquote blockquote p:before{content:"“"}.s-blockquote blockquote p:after{content:"”"}.s-blockquote figcaption{margin-top:.3em}.s-blockquote figcaption:before{content:"— "}.s-blockquote cite{font-style:unset}

package/dist/trumps/s-breadcrumbs.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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-truncate--one-line{overflow:hidden;text-overflow:var(--text-overflow,ellipsis);white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-breadcrumbs-via-ul,.s-breadcrumbs:is(nav){font-size:var(--global-font-size--x-small);margin-bottom:var(--global-space--under-breadcrumbs);padding-top:var(--global-space--above-breadcrumbs)}.s-breadcrumbs-via-ul ul,.s-breadcrumbs:is(nav) ol{font-weight:var(--global-font-weight--medium);list-style:none;margin-bottom:unset;padding-left:unset}.s-breadcrumbs-via-ul ul li,.s-breadcrumbs:is(nav) ol li,.s-breadcrumbs:is(ol) li{display:inline-block}.s-breadcrumbs-via-ul ul li+li:before,.s-breadcrumbs:is(nav) ol li+li:before,.s-breadcrumbs:is(ol) li+li:before{content:" > "}.s-breadcrumbs-via-ul ul li:last-child,.s-breadcrumbs:is(nav) ol li:last-child{font-weight:var(--bold)}
+/*! @tacc/core-styles 2.0.2+ | 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-truncate--one-line{overflow:hidden;text-overflow:var(--text-overflow,ellipsis);white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-breadcrumbs-via-ul,.s-breadcrumbs:is(nav){font-size:var(--global-font-size--x-small);margin-bottom:var(--global-space--under-breadcrumbs);padding-top:var(--global-space--above-breadcrumbs)}.s-breadcrumbs-via-ul ul,.s-breadcrumbs:is(nav) ol{font-weight:var(--global-font-weight--medium);list-style:none;margin-bottom:unset;padding-left:unset}.s-breadcrumbs-via-ul ul li,.s-breadcrumbs:is(nav) ol li,.s-breadcrumbs:is(ol) li{display:inline-block}.s-breadcrumbs-via-ul ul li+li:before,.s-breadcrumbs:is(nav) ol li+li:before,.s-breadcrumbs:is(ol) li+li:before{content:" > "}.s-breadcrumbs-via-ul ul li:last-child,.s-breadcrumbs:is(nav) ol li:last-child{font-weight:var(--bold)}

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

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */ul.s-cms-nav{margin-bottom:0;padding-left:0}.s-cms-nav a:hover{text-decoration:none}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */ul.s-cms-nav{margin-bottom:0;padding-left:0}.s-cms-nav a:hover{text-decoration:none}

package/dist/trumps/s-document.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-document{margin-bottom:var(--global-space--large)}.s-document blockquote{border:var(--global-border--normal);opacity:.75;padding:1em}.s-document blockquote>:last-child{margin-bottom:0}@media only screen and (min-width:768px){blockquote{width:600px}}p+dl.small{padding-left:var(--global-space--list-indent)}.s-document p+details,.s-document p+dl.small,.s-document p+img,.s-document p+ol.small,.s-document p+pre,.s-document p+ul.small{margin-bottom:1rem;margin-top:-.75rem}code,pre>samp{background-color:var(--global-color-primary--x-light);border-color:var(--global-color-primary--light);border-style:solid;border-width:var(--global-border-width--normal)}.s-document img{border:var(--global-border--normal);display:block;max-width:800px;width:100%}.s-document i.icon--as-image{border:var(--global-border--normal);display:inline-block;font-size:2.8em;padding:.25em}.s-document table{max-width:500px;text-align:center;width:100%}.s-document details{--buffer-horz:1em;padding-left:var(--buffer-horz)}.s-document summary{margin-left:calc(var(--buffer-horz)*-1)}.s-document details[open]>summary{margin-bottom:.5em}.s-document summary:after{display:inline-block;margin-left:.2rem;opacity:.75}.s-document details[open]>summary:after{content:"(hide)"}.s-document details:not([open])>summary:after{content:"(show)"}.s-document .row>.col>:last-child{margin-bottom:0}.s-document .row .row{padding:var(--global-space--normal) 0}.s-document .row .row:nth-child(2n){background-color:var(--global-color-primary--x-light)}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-document{margin-bottom:var(--global-space--large)}.s-document blockquote{border:var(--global-border--normal);opacity:.75;padding:1em}.s-document blockquote>:last-child{margin-bottom:0}@media only screen and (min-width:768px){blockquote{width:600px}}p+dl.small{padding-left:var(--global-space--list-indent)}.s-document p+details,.s-document p+dl.small,.s-document p+img,.s-document p+ol.small,.s-document p+pre,.s-document p+ul.small{margin-bottom:1rem;margin-top:-.75rem}code,pre>samp{background-color:var(--global-color-primary--x-light);border-color:var(--global-color-primary--light);border-style:solid;border-width:var(--global-border-width--normal)}.s-document img{border:var(--global-border--normal);display:block;max-width:800px;width:100%}.s-document i.icon--as-image{border:var(--global-border--normal);display:inline-block;font-size:2.8em;padding:.25em}.s-document table{max-width:500px;text-align:center;width:100%}.s-document details{--buffer-horz:1em;padding-left:var(--buffer-horz)}.s-document summary{margin-left:calc(var(--buffer-horz)*-1)}.s-document details[open]>summary{margin-bottom:.5em}.s-document summary:after{display:inline-block;margin-left:.2rem;opacity:.75}.s-document details[open]>summary:after{content:"(hide)"}.s-document details:not([open])>summary:after{content:"(show)"}.s-document .row>.col>:last-child{margin-bottom:0}.s-document .row .row{padding:var(--global-space--normal) 0}.s-document .row .row:nth-child(2n){background-color:var(--global-color-primary--x-light)}

package/dist/trumps/s-footer.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-footer>p:last-of-type{margin:0}.s-footer a{color:var(--global-color-primary--light)}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-footer>p:last-of-type{margin:0}.s-footer a{color:var(--global-color-primary--light)}

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

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-guide-doc table{max-width:500px;text-align:center;width:100%}.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.0.2+ | MIT | github.com/TACC/Core-Styles */.s-guide-doc table{max-width:500px;text-align:center;width:100%}.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.bootstrap.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}

package/dist/trumps/s-header.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}.s-header{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:1px solid var(--global-color-primary--xx-dark);font-family:var(--global-font-family);font-size:16px;line-height:1.4}.s-header .navbar-brand{color:var(--global-color-primary--xx-light);margin-right:16px;min-width:176px;padding:0}@media only screen and (min-width:1201px){.s-header.navbar{height:50px}}.s-header.navbar{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--global-color-primary--xx-dark);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--line-height:24px;--border-width:4px;--border-offset:calc(var(--nav-padding-vert) - var(--border-width));--border-color:var(--global-color-secondary--light);line-height:var(--line-height);position:relative;top:var(--border-offset);white-space:nowrap}.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(--border-color);border-style:solid;border-width:0 0 var(--border-width);margin-bottom:calc(var(--border-width)*-1)}#s-header .nav-link,#s-header .nav-link>a{color:var(--global-color-primary--xx-light)}.s-header[class*=navbar-expand-] .navbar-nav .nav-link{padding:8px 14px}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--global-color-primary--normal);margin-left:12px}.dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.navbar-toggler-icon{filter:none}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}.s-header{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:1px solid var(--global-color-primary--xx-dark);font-family:var(--global-font-family);font-size:16px;line-height:1.4}.s-header .navbar-brand{color:var(--global-color-primary--xx-light);margin-right:16px;min-width:176px;padding:0}@media only screen and (min-width:1201px){.s-header.navbar{height:50px}}.s-header.navbar{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--global-color-primary--xx-dark);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--line-height:24px;--border-width:4px;--border-offset:calc(var(--nav-padding-vert) - var(--border-width));--border-color:var(--global-color-secondary--light);line-height:var(--line-height);position:relative;top:var(--border-offset);white-space:nowrap}.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(--border-color);border-style:solid;border-width:0 0 var(--border-width);margin-bottom:calc(var(--border-width)*-1)}#s-header .nav-link,#s-header .nav-link>a{color:var(--global-color-primary--xx-light)}.s-header[class*=navbar-expand-] .navbar-nav .nav-link{padding:8px 14px}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--global-color-primary--normal);margin-left:12px}.dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.navbar-toggler-icon{filter:none}

package/dist/trumps/s-header.theme-has-dark-logo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}.s-header{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:1px solid var(--global-color-primary--normal);font-family:var(--global-font-family);font-size:16px;line-height:1.4}.s-header .navbar-brand{color:var(--global-color-primary--x-dark);margin-right:16px;min-width:176px;padding:0}@media only screen and (min-width:1201px){.s-header.navbar{height:50px}}.s-header.navbar{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--global-color-primary--x-light);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--line-height:24px;--border-width:4px;--border-offset:calc(var(--nav-padding-vert) - var(--border-width));--border-color:var(--global-color-secondary--light);line-height:var(--line-height);position:relative;top:var(--border-offset);white-space:nowrap}.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(--border-color);border-style:solid;border-width:0 0 var(--border-width);margin-bottom:calc(var(--border-width)*-1)}#s-header .nav-link,#s-header .nav-link>a{color:var(--global-color-primary--x-dark)}.s-header[class*=navbar-expand-] .navbar-nav .nav-link{padding:8px 14px}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--global-color-primary--normal);margin-left:12px}.dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.navbar-toggler-icon{filter:invert(100%)}
+/*! @tacc/core-styles 2.0.2+ | MIT | github.com/TACC/Core-Styles */.s-header .dropdown-item{color:#212529}.s-header .dropdown-item:focus,.s-header .dropdown-item:hover{background-color:#f8f9fa;color:#16181b;text-decoration:none}.s-header .dropdown-item.active,.s-header .dropdown-item:active{background-color:#007bff;color:#fff;text-decoration:none}.s-header input{font-family:inherit}.s-header{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-bottom:1px solid var(--global-color-primary--normal);font-family:var(--global-font-family);font-size:16px;line-height:1.4}.s-header .navbar-brand{color:var(--global-color-primary--x-dark);margin-right:16px;min-width:176px;padding:0}@media only screen and (min-width:1201px){.s-header.navbar{height:50px}}.s-header.navbar{--nav-padding-vert:5px;--nav-padding-horz:36px;background-color:var(--global-color-primary--x-light);padding:var(--nav-padding-vert) var(--nav-padding-horz)}.s-header .nav-link{--line-height:24px;--border-width:4px;--border-offset:calc(var(--nav-padding-vert) - var(--border-width));--border-color:var(--global-color-secondary--light);line-height:var(--line-height);position:relative;top:var(--border-offset);white-space:nowrap}.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(--border-color);border-style:solid;border-width:0 0 var(--border-width);margin-bottom:calc(var(--border-width)*-1)}#s-header .nav-link,#s-header .nav-link>a{color:var(--global-color-primary--x-dark)}.s-header[class*=navbar-expand-] .navbar-nav .nav-link{padding:8px 14px}.s-header .s-search-bar~.s-portal-nav{border-left:1px solid var(--global-color-primary--normal);margin-left:12px}.dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.navbar-toggler-icon{filter:invert(100%)}

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

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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{-webkit-margin-end:.25em;content:":";margin-inline-end:.25em}
+/*! @tacc/core-styles 2.0.2+ | 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{-webkit-margin-end:.25em;content:":";margin-inline-end:.25em}

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

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

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

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

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

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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}
+/*! @tacc/core-styles 2.0.2+ | 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}

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

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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.0.2+ | 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.0.1+ | MIT | github.com/TACC/Core-Styles */.s-system-specs{font-size:var(--global-font-size--small);font-weight:var(--global-font-weight--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:991px){.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:991px){.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.0.2+ | MIT | github.com/TACC/Core-Styles */.s-system-specs{font-size:var(--global-font-size--small);font-weight:var(--global-font-weight--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:991px){.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:991px){.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/tacc-search-bar.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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{font-size:0}: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(--global-color-primary--xx-light);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:#313131;border:var(--global-border-width--normal) solid var(--global-color-primary--dark);border-radius:5px;color:var(--global-color-primary--xx-light);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(--global-color-primary--xx-light);opacity:.5}:host [part=input]::placeholder{color:var(--global-color-primary--xx-light);opacity:.5}
+/*! @tacc/core-styles 2.0.2+ | 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{font-size:0}: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(--global-color-primary--xx-light);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:#313131;border:var(--global-border-width--normal) solid var(--global-color-primary--dark);border-radius:5px;color:var(--global-color-primary--xx-light);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(--global-color-primary--xx-light);opacity:.5}:host [part=input]::placeholder{color:var(--global-color-primary--xx-light);opacity:.5}

package/dist/trumps/tacc-search-bar.theme-has-dark-logo.css

@@ -1 +1 @@
-/*! @tacc/core-styles 2.0.1+ | 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{font-size:0}: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(--global-color-primary--x-dark);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(--global-color-primary--xx-light);border:var(--global-border-width--normal) solid #d8d8d8;border-radius:5px;color:var(--global-color-primary--x-dark);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(--global-color-primary--x-dark);opacity:.5}:host [part=input]::placeholder{color:var(--global-color-primary--x-dark);opacity:.5}
+/*! @tacc/core-styles 2.0.2+ | 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{font-size:0}: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(--global-color-primary--x-dark);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(--global-color-primary--xx-light);border:var(--global-border-width--normal) solid #d8d8d8;border-radius:5px;color:var(--global-color-primary--x-dark);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(--global-color-primary--x-dark);opacity:.5}:host [part=input]::placeholder{color:var(--global-color-primary--x-dark);opacity:.5}

package/dist/trumps/u-empty.css

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

package/dist/trumps/u-hide.css

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

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

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

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tacc/core-styles",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "license": "MIT",
   "author": "TACC ACI WMA <wma-portals@gmail.com>",
   "description": "CSS source and processor for TACC Core-CMS and Core-Portal.",

package/src/lib/_imports/components/admonition/admonition.hbs

@@ -1,39 +1,7 @@
-<div class="admonition tip">
-  <p class="admonition-title">Tip</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-<div class="admonition hint">
-  <p class="admonition-title">Hint</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-<div class="admonition important">
-  <p class="admonition-title">Important</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-
-<div class="admonition attention">
-  <p class="admonition-title">Attention</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-<div class="admonition note">
-  <p class="admonition-title">Note</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-
-<div class="admonition warning">
-  <p class="admonition-title">Warning</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-<div class="admonition caution">
-  <p class="admonition-title">Caution</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-
-<div class="admonition error">
-  <p class="admonition-title">Error</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
-</div>
-<div class="admonition danger">
-  <p class="admonition-title">Danger</p>
-  <p>{{> @text-of-one-paragraph-short }}</p>
+{{#types}}
+<div class="admonition {{name}}">
+  <p class="admonition-title">{{ title }}</p>
+  <p>{{{ content }}}</p>
+  {{#code}}<pre><code>{{ this }}</code></pre>{{/code}}
 </div>
+{{/types}}

package/src/lib/_imports/components/admonition/config.yml

@@ -1,2 +1,23 @@
 context:
   shouldLoadDocs: true
+  types:
+    - name: caution
+      title: Caution
+      content: Use a caution box when following the instructions could result in the loss of data that can be easily restored or replicated. This is good for items such as informing users about the <code>/scratch</code> purge policy. It can also be used to indicate behaviors which could result in account suspension.
+    - name: warning
+      title: Warning
+      content: Use a warning box when following the instructions could result in immediate data loss. Warnings can also be used for extremely important notifications such as the retirement of a machine or a notice of data loss on the machine. These boxes should be used the least.
+    - name: tip
+      title: Tip
+      content: Use a tip box when giving a hint or command that will make things easier for the user or make things more productive. This is good for tips such as how to display the <code>taccinfo</code> box at will in the terminal.
+    - name: note
+      title: Note
+      content: Use a note box when providing contextual information to a user that is peripheral to the task being described. This is good for indicating that node sharing is not enabled and thus all SUs are charged in full node hours.
+    - name: hint
+      title: Hint
+      content: Use a hint box when providing a "good" example to a user. This is good for indicating what code should be run to perform a task.
+      code: module load kittens
+    - name: danger
+      title: Danger
+      content: Use a hint box when providing a "bad" example to a user. This is good for indicating what code should <strong>not</strong> be run to perform a task.
+      code: module load puppies

package/src/lib/_imports/components/admonition.css

@@ -1,35 +1,87 @@
 @import url("../components/c-message.css");
+@import url("../components/c-message--expanded.css");
+@import url("../components/c-message.selectors.css");
+@import url("../tools/selectors.monospace.css");
 
 
 
 .admonition {
-  @extend .c-message;
-  @extend .c-message--scope-section;
+  @extend :--c-message;
+  @extend :--c-message--scope-section;
 }
 .admonition-title {
   font-weight: var(--bold);
   margin-top: unset; /* undo Browser */
   margin-bottom: unset; /* undo `html-elements.cms.css` */
+
+  color: var(--global-color-primary--xx-dark);
+}
+
+.admonition:is(.tip) {
+  @extend :--c-message--type-tip;
+  @extend :--c-message--type-tip:--c-message--scope-section;
+}
+.admonition:is(.hint) {
+  @extend :--c-message--type-success;
+  @extend :--c-message--type-success:--c-message--scope-section;
+}
+.admonition:is(.note, .important, .attention) {
+  @extend :--c-message--type-info;
+  @extend :--c-message--type-info:--c-message--scope-section;
+}
+.admonition:is(.caution) {
+  @extend :--c-message--type-warning;
+  @extend :--c-message--type-warning:--c-message--scope-section;
+}
+.admonition:is(.warning, .error, .danger) {
+  @extend :--c-message--type-error;
+  @extend :--c-message--type-error:--c-message--scope-section;
 }
 
-.admonition.tip,
-.admonition.hint,
-.admonition.important {
-  @extend .c-message--type-success;
-  @extend .c-message--type-success.c-message--scope-section;
+/* To layout icon and content */
+.admonition {
+  display: grid;
+  grid-template-columns: 65px auto;
 }
-.admonition.attention,
-.admonition.note {
-  @extend .c-message--type-info;
-  @extend .c-message--type-info.c-message--scope-section;
+
+/* To move padding so icon can take up left column */
+.admonition {
+  padding-left: 0; /* overwrite c-message */
+  padding-block: 0; /* overwrite c-message */
 }
-.admonition.caution,
-.admonition.warning {
-  @extend .c-message--type-warning;
-  @extend .c-message--type-warning.c-message--scope-section;
+.admonition > * { padding-left: var(--pad-horz); }
+.admonition > *:first-child { padding-top: var(--pad-vert); }
+.admonition > *:last-child { padding-bottom: var(--pad-vert); }
+
+/* To adjust spacing for certain elements */
+.admonition > .admonition-title + p { margin-top: 5px; }
+.admonition > pre:last-child { padding-bottom: 15px; }
+.admonition > p + pre { margin-top: -5px; }
+
+/* To adjust styling for certain elements */
+.admonition :--monospace--block { 
+  border-color: var(--global-color-primary--dark);
 }
-.admonition.error,
-.admonition.danger {
-  @extend .c-message--type-error;
-  @extend .c-message--type-error.c-message--scope-section;
+
+/* To add icon */
+.admonition::before {
+  color: white;
+  font-size: 36px;
+
+  /* To take up left column */
+  grid-row: 1 / span 99; /* 99 is for arbitrary implicit row count */
+
+  /* To center content */
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
+
+/* To use FontAwesome icons */
+/* FAQ: Cortal icon syntax conflicts with docs */
+.admonition:is(.caution)::before { content: "⚠"; }
+.admonition:is(.warning)::before { content: "𝖷"; }
+.admonition:is(.tip)::before { content: "☀"; }
+.admonition:is(.note, .important, .attention)::before { content: "✎"; }
+.admonition:is(.hint)::before { content: "✓"; }
+.admonition:is(.danger)::before { content: "𝗫"; }

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

@@ -1,6 +1,9 @@
+{{#warning}}
 <p class="c-message c-message--scope-global">
-  This component currently depends on CMS stylesheets. When this component is used on the Portal, the font size should not be this small. When this component is proven to work independent of CMS, its demo font will not match CMS and this message will be removed.
+  {{{ this }}}
 </p>
+{{/warning}}
+
 <form action="" method="POST" enctype="multipart/form-data" class="c-form">
 
   <h3 class="c-form__title">Title of Form</h3>

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

@@ -1,3 +1,16 @@
-context:
-  shouldLoadCMS: true 
-  📝 shouldLoadCMS: temporary dependence, until proven to work on Portal
+variants:
+  - name: default
+    status: prototype
+    context:
+      warning: This component looks better with <code>elements/form.cms.css</code>, but that styles is not loaded by default. To understand the problem, see "Portal" variant.
+      supportStyles:
+        - ../../assets/components/c-message.css
+  - name: portal
+    context:
+      shouldLoadPortal: true
+      warning: This component looks better with <code>elements/form.cms.css</code>, but that styles is not loaded for this variant. When this component is used on the Portal, those necessary CMS styles are loaded via <code>LoginComponent.module.css</code> specifically for Login page, but incidentally loaded for entire Portal (and thus depended on). When this component is styled accurately independent of CMS, this message should be removed. <small>The solution is likely to change <code>elements/form.cms.css</code> to be <code>elements/form.css</code>.</small>
+  - name: cms
+    label: CMS
+    status: ready
+    context:
+      shouldLoadCMS: true

package/src/lib/_imports/components/c-form--cms.css

@@ -0,0 +1,23 @@
+@import url("../components/c-message.css");
+@import url("../components/c-message--expanded.css");
+
+
+
+/* Errors */
+
+.c-form > .c-form__errors {
+  @extend :--c-message;
+  @extend :--c-message--type;
+  @extend :--c-message--type-error;
+  @extend :--c-message--scope;
+  @extend :--c-message--scope-section;
+  @extend :--c-message--type-error:--c-message--scope-section;
+}
+.c-form__field .c-form__errors li {
+  @extend :--c-message;
+  @extend :--c-message--type;
+  @extend :--c-message--type-error;
+  @extend :--c-message--scope;
+  @extend :--c-message--scope-inline;
+  @extend :--c-message--type-error:--c-message--scope-inline;
+}

package/src/lib/_imports/components/c-form--portal.css

@@ -0,0 +1,22 @@
+@import url("../components/c-message.css");
+@import url("../components/c-message--compact.css");
+
+
+
+/* Errors */
+
+.c-form > .c-form__errors {
+  @extend :--c-message;
+  @extend :--c-message--type;
+  @extend :--c-message--type-error;
+  @extend :--c-message--scope;
+  @extend :--c-message--scope-section;
+  @extend :--c-message--type-error:--c-message--scope-section;
+}
+.c-form__field .c-form__errors li {
+  @extend :--c-message;
+  @extend :--c-message--type;
+  @extend :--c-message--type-error;
+  @extend :--c-message--scope;
+  @extend :--c-message--scope-inline;
+}

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

@@ -1,6 +1,4 @@
 @import url("../components/c-button.css");
-@import url("../components/c-message.css");
-@import url('../tools/x-link.css');
 
 
 
@@ -126,18 +124,6 @@ ul.c-form__errors {
   padding-inline: 0;
 }
 
-.c-form > .c-form__errors {
-  @extend .c-message;
-  @extend .c-message--type-error;
-  @extend .c-message--scope-section;
-  @extend .c-message--type-error.c-message--scope-section;
-}
-.c-form__field .c-form__errors li {
-  @extend .c-message;
-  @extend .c-message--type-error;
-  @extend .c-message--scope-inline;
-}
-
 
 
 /* Lists */

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

@@ -1 +1 @@
-<!-- SEE: c-message--type(-…), c-message--scope(-…) -->
+<!-- SEE: c-message--type, c-message--scope -->

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

@@ -2,34 +2,50 @@ status: wip
 context:
   types:
     - name: success
-      content: Notify user of a successful event.
+      content: Notify user of a successful event. <a href>Sample link.</a>
     - name: info
-      content: Notify user of any details that are <strong>not</strong> a problem.
+      content: Notify user of any details that are <strong>not</strong> a problem. <a href>Sample link.</a>
     - name: warning
-      content: Notify user of an <strong>un</strong>successful event that <em>could prevent</em> functionality.
+      content: Notify user of an <strong>un</strong>successful event that <em>could prevent</em> functionality. <a href>Sample link.</a>
     - name: error
-      content: Notify user of an <strong>un</strong>successful event that <em>does prevent</em> functionality.
+      content: Notify user of an <strong>un</strong>successful event that <em>does prevent</em> functionality. <a href>Sample link.</a>
   scopes:
     - name: inline
-      content: 	An inline message.
+      content: 	An inline message. <a href>Sample link.</a>
     - name: section
-      content: A wide block message.
+      content: A wide block message. <a href>Sample link.</a>
     # - name: app
-    #   content: A floating block message.
+    #   content: A floating block message. <a href>Sample link.</a>
     - name: global
-      content: A site-wide banner message.
+      content: A site-wide banner message. <a href>Sample link.</a>
 variants:
   - name: default
     hidden: true
   - name: type
+    label: by Type (Shared)
+    status: prototype
   - name: type-portal
-    label: Type (Portal)
+    label: by Type (Portal)
+    status: ready
     view: 'c-message--type.hbs'
     context:
       shouldLoadPortal: true
+  - name: type-cms
+    label: by Type (CMS)
+    view: 'c-message--type.hbs'
+    context:
+      shouldLoadCMS: true
   - name: scope
+    label: by Scope (Shared)
+    status: prototype
   - name: scope-portal
-    label: Scope (Portal)
+    label: by Scope (Portal)
+    status: ready
     view: 'c-message--scope.hbs'
     context:
       shouldLoadPortal: true
+  - name: scope-cms
+    label: by Scope (CMS)
+    view: 'c-message--scope.hbs'
+    context:
+      shouldLoadCMS: true

package/src/lib/_imports/components/c-message--compact.css

@@ -0,0 +1,65 @@
+@import url('../tools/x-link.css');
+
+@import url("./c-message.selectors.css");
+
+
+
+/* Elements */
+
+/* To avoid clash of link color with message color */
+:--c-message a,
+:--c-message .c-button--as-link {
+  color: inherit !important; /* override :hover and :active */
+}
+
+/* To distinguish link from message text */
+:--c-message a,
+:--c-message .c-button--as-link {
+  @extend .x-link--irregular;
+}
+:--c-message a:hover,
+:--c-message .c-button--as-link:hover {
+  @extend .x-link--irregular--hover;
+}
+:--c-message a:active,
+:--c-message .c-button--as-link:active {
+  @extend .x-link--irregular--active;
+}
+
+
+
+/* Modifiers */
+
+/* Structure */
+
+:--c-message--scope-inline,
+:--c-message--scope-section,
+:--c-message--scope-global {
+  font-size: var(--global-font-size--small);
+}
+
+:--c-message--scope-section {
+  --pad-vert: 15px;
+  --pad-horz: 20px;
+
+  border-width: var(--global-border-width--thick);
+  border-style: solid;
+}
+
+/* Skin */
+
+:--c-message--type-info:not(:--c-message--scope-global) {
+  color: var(--global-color-info--dark);
+}
+:--c-message--type-success:not(:--c-message--scope-global) {
+  color: var(--global-color-success--dark);
+}
+:--c-message--type-warning:not(:--c-message--scope-global) {
+  color: var(--global-color-warning--dark);
+}
+:--c-message--type-error:not(:--c-message--scope-global) {
+  color: var(--global-color-danger--dark);
+}
+:--c-message--type-tip:not(:--c-message--scope-global) {
+  color: var(--global-color-extra--dark);
+}