@tacc/core-styles 2.12.0 → 2.14.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/branding_logos.css +1 -1
- package/dist/components/README.css +1 -1
- package/dist/components/admonition/demo.css +1 -1
- package/dist/components/admonition.css +1 -1
- package/dist/components/align/demo.css +1 -1
- package/dist/components/align.css +1 -1
- package/dist/components/bootstrap/bootstrap--form.demo.css +1 -1
- package/dist/components/bootstrap/bootstrap--modal.demo.css +1 -1
- package/dist/components/bootstrap/demo.css +1 -1
- package/dist/components/bootstrap.col.css +1 -1
- package/dist/components/bootstrap.container.css +1 -1
- package/dist/components/bootstrap.css +1 -1
- package/dist/components/bootstrap.figure.css +1 -1
- package/dist/components/bootstrap.form.css +1 -1
- package/dist/components/bootstrap.modal--cms.css +1 -1
- package/dist/components/bootstrap.modal--portal.css +1 -1
- package/dist/components/bootstrap.modal.css +1 -1
- package/dist/components/bootstrap.nav-tabs.css +1 -1
- package/dist/components/bootstrap.pagination.css +1 -1
- package/dist/components/bootstrap.row.css +1 -1
- package/dist/components/c-button/demo.css +1 -1
- package/dist/components/c-button.css +1 -1
- package/dist/components/c-button.selectors.css +1 -1
- package/dist/components/c-callout.css +1 -1
- package/dist/components/c-card/c-card--frontera.demo.css +1 -1
- package/dist/components/c-card/c-card.demo.css +1 -1
- package/dist/components/c-card--docs.css +1 -1
- package/dist/components/c-card--from-tup-cms.css +1 -1
- package/dist/components/c-card--frontera-about-page.css +1 -1
- package/dist/components/c-card.css +1 -1
- package/dist/components/c-card.selectors.css +1 -1
- package/dist/components/c-data-list.css +1 -1
- package/dist/components/c-footer.css +1 -1
- package/dist/components/c-form--cms.css +1 -1
- package/dist/components/c-form--portal.css +1 -1
- package/dist/components/c-form.css +1 -1
- package/dist/components/c-image-map.css +1 -1
- package/dist/components/c-image-map.skin.css +1 -1
- package/dist/components/c-image-map.structure.css +1 -1
- package/dist/components/c-island/demo.css +1 -1
- package/dist/components/c-island.css +1 -1
- package/dist/components/c-message/demo.css +1 -1
- package/dist/components/c-message--compact.css +1 -1
- package/dist/components/c-message--expanded.css +1 -1
- package/dist/components/c-message.css +1 -1
- package/dist/components/c-message.selectors.css +1 -1
- package/dist/components/c-nav/demo.css +1 -1
- package/dist/components/c-nav.css +1 -1
- package/dist/components/c-page.css +1 -1
- package/dist/components/c-recognition.css +1 -1
- package/dist/components/c-see-all-link.css +1 -1
- package/dist/components/c-show-more.css +1 -1
- package/dist/components/c-tag/demo.css +1 -1
- package/dist/components/c-tag.css +1 -1
- package/dist/components/c-tag.selectors.css +1 -1
- package/dist/components/cortal.icon.css +1 -1
- package/dist/components/cortal.icon.font.css +1 -1
- package/dist/components/demo.css +1 -1
- package/dist/components/django-cms-forms--errors-via-c-message.css +1 -1
- package/dist/components/django-cms-forms.css +1 -1
- package/dist/components/django-cms-forms.hacks.css +1 -1
- package/dist/components/mui.tabs.css +1 -1
- package/dist/components/pymdownx--tabbed.css +1 -1
- package/dist/components/pymdownx.css +1 -1
- package/dist/components/tacc-docs.css +1 -1
- package/dist/core-styles.base.css +2 -2
- package/dist/core-styles.cms.css +2 -2
- package/dist/core-styles.demo.css +1 -1
- package/dist/core-styles.docs.css +1 -1
- package/dist/core-styles.header.css +1 -1
- package/dist/core-styles.portal.css +1 -1
- package/dist/core-styles.settings.css +1 -1
- package/dist/core-styles.theme.default.css +1 -1
- package/dist/core-styles.theme.has-dark-logo.css +1 -1
- package/dist/core-styles.wysiwyg.css +1 -1
- package/dist/elements/README.css +1 -1
- package/dist/elements/bootstrap.css +1 -1
- package/dist/elements/demo.css +1 -1
- package/dist/elements/form.cms.css +1 -1
- package/dist/elements/headings/demo.css +1 -1
- package/dist/elements/headings--cms.css +1 -1
- package/dist/elements/headings--docs.css +1 -1
- package/dist/elements/html-elements/demo.css +1 -1
- package/dist/elements/html-elements.cms.css +1 -1
- package/dist/elements/html-elements.css +1 -1
- package/dist/elements/html-elements.docs.css +1 -1
- package/dist/elements/links.css +1 -1
- package/dist/elements/monospace.css +1 -1
- package/dist/elements/root--cms.css +1 -1
- package/dist/elements/root--demo.css +1 -1
- package/dist/elements/root--docs.css +1 -1
- package/dist/elements/root--portal.css +1 -1
- package/dist/elements/root.css +1 -1
- package/dist/elements/sticky-footer.css +1 -1
- package/dist/elements/table--basic.css +1 -1
- package/dist/elements/table--nested.css +1 -1
- package/dist/elements/table.cms.css +1 -1
- package/dist/elements/table.css +1 -1
- package/dist/elements/table.docs.css +1 -1
- package/dist/elements/table.selectors.css +1 -1
- package/dist/elements/tacc-search-bar.css +1 -1
- package/dist/fractal.server.refresh.css +1 -1
- package/dist/generics/README.css +1 -1
- package/dist/generics/fonts.css +1 -1
- package/dist/generics/pseudo-elements.css +1 -1
- package/dist/objects/README.css +1 -1
- package/dist/objects/o-fixed-header-table/demo.css +1 -1
- package/dist/objects/o-fixed-header-table.css +1 -1
- package/dist/objects/o-flex-item-table-wrap/demo.css +1 -1
- package/dist/objects/o-flex-item-table-wrap.css +1 -1
- package/dist/objects/o-float-content.css +1 -1
- package/dist/objects/o-grid.css +1 -1
- package/dist/objects/o-offset-content.css +1 -1
- package/dist/objects/o-section/demo.css +1 -1
- package/dist/objects/o-section--docs.css +1 -1
- package/dist/objects/o-section.css +1 -1
- package/dist/objects/o-section.selectors.css +1 -1
- package/dist/objects/o-site.css +1 -1
- package/dist/objects/o-table-wrap/demo.basic.css +1 -1
- package/dist/objects/o-table-wrap/demo.extra.css +1 -1
- package/dist/objects/o-table-wrap/example.flexible-horz.css +1 -1
- package/dist/objects/o-table-wrap/example.overflow-hidden.css +1 -1
- package/dist/objects/o-table-wrap/example.overflow-scroll.css +1 -1
- package/dist/objects/o-table-wrap/o-table-wrap--flexible-horz.css +1 -1
- package/dist/objects/o-table-wrap/o-table-wrap--flexible-vert.css +1 -1
- package/dist/objects/o-table-wrap/o-table-wrap--overflow-hidden.css +1 -1
- package/dist/objects/o-table-wrap/o-table-wrap--overflow-scroll-extra.css +1 -1
- package/dist/objects/o-table-wrap/o-table-wrap--overflow-scroll.css +1 -1
- package/dist/objects/o-table-wrap.css +1 -1
- package/dist/settings/README.css +1 -1
- package/dist/settings/border.css +1 -1
- package/dist/settings/color/demo.css +1 -1
- package/dist/settings/color--cms.css +1 -1
- package/dist/settings/color--demo.css +1 -1
- package/dist/settings/color--docs.css +1 -1
- package/dist/settings/color--portal.css +1 -1
- package/dist/settings/color.accent--blue.css +1 -1
- package/dist/settings/color.accent--purple.css +1 -1
- package/dist/settings/color.css +1 -1
- package/dist/settings/demo.css +1 -1
- package/dist/settings/font/demo-family.css +1 -1
- package/dist/settings/font/demo-size.css +1 -1
- package/dist/settings/font/demo-style.css +1 -1
- package/dist/settings/font/demo-weight.css +1 -1
- package/dist/settings/font--cms.css +1 -1
- package/dist/settings/font--docs.css +1 -1
- package/dist/settings/font--portal.css +1 -1
- package/dist/settings/font.css +1 -1
- package/dist/settings/max-width.css +1 -1
- package/dist/settings/space.css +1 -1
- package/dist/tools/README.css +1 -1
- package/dist/tools/media-queries.css +1 -1
- package/dist/tools/selectors.common.css +1 -1
- package/dist/tools/selectors.css +1 -1
- package/dist/tools/selectors.monospace.css +1 -1
- package/dist/tools/x-article-link.css +1 -1
- package/dist/tools/x-blockquote.css +1 -1
- package/dist/tools/x-center.css +1 -1
- package/dist/tools/x-fake-border.css +1 -1
- package/dist/tools/x-figure.css +1 -1
- package/dist/tools/x-grid.css +1 -1
- package/dist/tools/x-layout.css +1 -1
- package/dist/tools/x-link.css +1 -1
- package/dist/tools/x-mailto-text-replace.css +1 -1
- package/dist/tools/x-overlay.css +1 -1
- package/dist/tools/x-tabs/demo.css +1 -1
- package/dist/tools/x-tabs.css +1 -1
- package/dist/tools/x-tabs.skin.css +1 -1
- package/dist/tools/x-tabs.structure.css +1 -1
- package/dist/tools/x-truncate.css +1 -1
- package/dist/trumps/README.css +1 -1
- package/dist/trumps/demo.css +1 -1
- package/dist/trumps/s-affixed-input-wrapper/demo.css +1 -0
- package/dist/trumps/s-affixed-input-wrapper.css +1 -1
- package/dist/trumps/s-article-list.css +1 -1
- package/dist/trumps/s-article-preview.css +1 -1
- package/dist/trumps/s-blockquote.css +1 -1
- package/dist/trumps/s-breadcrumbs.css +1 -1
- package/dist/trumps/s-cms-nav.css +1 -1
- package/dist/trumps/s-document.css +1 -1
- package/dist/trumps/s-footer.css +1 -1
- package/dist/trumps/s-guide-doc.css +1 -1
- package/dist/trumps/s-header.bootstrap.css +1 -1
- package/dist/trumps/s-header.css +1 -1
- package/dist/trumps/s-image-grid.css +1 -1
- package/dist/trumps/s-inline-dl.css +1 -1
- package/dist/trumps/s-irregular-links.css +1 -1
- package/dist/trumps/s-paragraph-table.css +1 -1
- package/dist/trumps/s-portal-nav.css +1 -1
- package/dist/trumps/s-style-guide.css +1 -1
- package/dist/trumps/s-system-specs.css +1 -1
- package/dist/trumps/tacc-search-bar.css +1 -1
- package/dist/trumps/u-empty.css +1 -1
- package/dist/trumps/u-hide.css +1 -1
- package/dist/trumps/u-mailto-text-replace.css +1 -1
- package/dist/trumps/u-nested-text-content.css +1 -1
- package/docs/contributing.md +3 -2
- package/fractal.config.js +9 -0
- package/package.json +2 -1
- package/src/lib/_imports/_partials/button-list.hbs +9 -0
- package/src/lib/_imports/components/c-nav/c-nav--is-list.hbs +16 -0
- package/src/lib/_imports/components/c-nav/c-nav--no-list.hbs +10 -0
- package/src/lib/_imports/components/c-nav/config.yml +4 -0
- package/src/lib/_imports/components/c-nav/demo.css +5 -0
- package/src/lib/_imports/components/c-nav.css +26 -2
- package/src/lib/_imports/core-styles.base.css +1 -0
- package/src/lib/_imports/core-styles.cms.css +0 -1
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/README.md +4 -2
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/_s-affixed-input-wrapper--affix.hbs +15 -0
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/_s-affixed-input-wrapper--end.hbs +13 -0
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/config.yml +9 -1
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/demo.css +5 -0
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/s-affixed-input-wrapper--prefix-and-suffix.hbs +32 -0
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/s-affixed-input-wrapper--prepend-and-append.hbs +43 -0
- package/src/lib/_imports/trumps/s-affixed-input-wrapper/s-affixed-input-wrapper.hbs +1 -32
- package/src/lib/_imports/trumps/s-affixed-input-wrapper.css +106 -47
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */.s-affixed-input-wrapper:where(:not(.checkboxinput,.has-type-check .radio,.has-type-radio .select,.has-type-select .checkboxselectmultiple,.has-select .textarea,.has-textarea)){display:grid}.s-affixed-input-wrapper label{grid-area:label}.s-affixed-input-wrapper input{grid-area:input}.s-affixed-input-wrapper .c-form__help,.s-affixed-input-wrapper .help-text{grid-area:help}.s-affixed-input-wrapper .c-form__errors,.s-affixed-input-wrapper .field-errors{grid-area:error}.s-affixed-input-wrapper__append,.s-affixed-input-wrapper__prefix,.s-affixed-input-wrapper__prepend,.s-affixed-input-wrapper__suffix{position:relative}.s-affixed-input-wrapper--append,.s-affixed-input-wrapper--prepend{grid-template-areas:"label label label" var(--input-area) "help help help" "error error error"}.s-affixed-input-wrapper__prepend{grid-area:prepend}.s-affixed-input-wrapper__append{grid-area:append}.s-affixed-input-wrapper--append{--input-area:"input append _____"}.s-affixed-input-wrapper--prepend{--input-area:"prepend input _____"}.s-affixed-input-wrapper--prepend:where(:not([class*="--full-width"])){grid-template-columns:auto auto 1fr}.s-affixed-input-wrapper--append:where(:not([class*="--full-width"])){grid-template-columns:auto auto 1fr}.s-affixed-input-wrapper--prepend.s-affixed-input-wrapper--full-width{grid-template-columns:auto 1fr auto}.s-affixed-input-wrapper--append.s-affixed-input-wrapper--full-width{grid-template-columns:1fr auto auto}.s-affixed-input-wrapper--prefix,.s-affixed-input-wrapper--suffix{grid-template-areas:"label label" "input _____" "help help" "error error"}.s-affixed-input-wrapper__prefix,.s-affixed-input-wrapper__suffix{grid-area:input}.s-affixed-input-wrapper--prefix:where(:not([class*="--full-width"])),.s-affixed-input-wrapper--suffix:where(:not([class*="--full-width"])){grid-template-columns:auto 1fr}.s-affixed-input-wrapper--prefix.s-affixed-input-wrapper--full-width,.s-affixed-input-wrapper--suffix.s-affixed-input-wrapper--full-width{grid-template-columns:1fr auto}.s-affixed-input-wrapper__prefix{justify-self:start}.s-affixed-input-wrapper__suffix{justify-self:end}.s-affixed-input-wrapper__append,.s-affixed-input-wrapper__prepend{position:relative}.s-affixed-input-wrapper__prepend{margin-right:calc(var(--global-border-width--normal)*-1)}.s-affixed-input-wrapper__append{margin-left:calc(var(--global-border-width--normal)*-1)}.s-affixed-input-wrapper--prefix,.s-affixed-input-wrapper--suffix{--width:1em;--padding-vert:5px;--padding-horz:10px}.s-affixed-input-wrapper__prefix,.s-affixed-input-wrapper__suffix{box-sizing:content-box;display:inline-block;font-family:var(--global-font-family--sans--portal);padding:var(--padding-vert) var(--padding-horz);pointer-events:none;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:var(--width)}.s-affixed-input-wrapper__prefix+input{text-indent:calc(var(--width) + var(--padding-horz))}.s-affixed-input-wrapper--prefix:where(:not([class*="--full-width"])) input,.s-affixed-input-wrapper--suffix:where(:not([class*="--full-width"])) input{width:-moz-fit-content;width:fit-content}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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-truncate--one-line,[class*=s-article-list--]>h2,[class*=s-article-list--]>p:last-child a{overflow:hidden;text-overflow:var(--text-overflow,ellipsis);white-space:nowrap}.x-untruncate--one-line{overflow:visible;white-space:normal}.s-article-list--layout-a,.s-article-list--layout-b,.s-article-list--layout-c,.s-article-list--layout-d,.x-layout--a,.x-layout--b,.x-layout--c,.x-layout--d{display:grid}@media (max-width:991px){.s-article-list--layout-a,.x-layout--a{grid-template-columns:repeat(1,minmax(0,1fr))}}@media (min-width:992px){.s-article-list--layout-a,.x-layout--a{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:991px){.s-article-list--layout-b,.x-layout--b{grid-template-columns:minmax(0,1fr)}}@media (min-width:992px){.s-article-list--layout-b,.x-layout--b{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}}@media (max-width:991px){.s-article-list--layout-c,.x-layout--c{grid-template-columns:minmax(0,1fr)}}@media (min-width:992px){.s-article-list--layout-c,.x-layout--c{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}}@media (max-width:575px){.s-article-list--layout-d,.x-layout--d{grid-template-columns:repeat(1,minmax(0,1fr))}}@media (min-width:576px) and (max-width:767px),(min-width:768px) and (max-width:991px){.s-article-list--layout-d,.x-layout--d{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:992px){.s-article-list--layout-d,.x-layout--d{grid-template-columns:repeat(3,minmax(0,1fr))}}.s-article-list--layout-e,.x-layout--e{display:flex;flex-direction:column}.s-article-list--links p:not(:last-child) a:before,.x-article-link-stretch{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.s-article-list--layout-gapless.s-article-list--links p:not(:last-child) a:before,.x-article-link-stretch--gapless{left:-15px;width:calc(100% + 30px)}.s-article-list--links p:not(:last-child) a:hover:before,.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-list--links p:not(:last-child) a:hover:before,.x-article-link-hover--gapless{--outline-offset:0}.s-article-list--layout-e>:not(h2):not(p:last-child){flex-grow:1}.s-article-list--layout-a>h2,.s-article-list--layout-b>h2,.s-article-list--layout-c>h2,.s-article-list--layout-d>h2{grid-column-end:-1;grid-column-start:1}[class*=s-article-list--]>h2{color:var(--global-color-accent--normal);font-size:1.6rem;font-weight:var(--bold);margin-bottom:3rem;margin-top:0;text-transform:uppercase}[class*=s-article-list--]>h2{padding-top:1em;position:relative}[class*=s-article-list--]>h2:before{background-color:var(--global-color-accent--normal);content:"";display:block;height:.5em;position:absolute;top:0;width:2.5em}.s-article-list--layout-a>p:last-child,.s-article-list--layout-b>p:last-child,.s-article-list--layout-c>p:last-child,.s-article-list--layout-d>p:last-child{grid-column-end:-1;grid-column-start:1}[class*=s-article-list--]>p:last-child{border-top-style:solid;border-top-width:var(--global-border-width--thick);font-size:1.2rem;font-weight:var(--bold);margin-bottom:-1rem;margin-top:3rem}[class*=s-article-list--]>p:last-child a{display:inline-block;max-width:100%;padding-bottom:1rem;padding-right:1rem;padding-top:1rem}.o-section--style-dark [class*=s-article-list--]>p:last-child,.o-section--style-dark[class*=s-article-list--]>p:last-child{border-color:var(--global-color-primary--xx-light)}.o-section--style-dark [class*=s-article-list--]>p:last-child a,.o-section--style-dark[class*=s-article-list--]>p:last-child a{color:var(--global-color-primary--xx-light)}.o-section--style-light [class*=s-article-list--]>p:last-child,.o-section--style-light[class*=s-article-list--]>p:last-child{border-color:var(--global-color-primary--xx-dark)}.o-section--style-light [class*=s-article-list--]>p:last-child a,.o-section--style-light[class*=s-article-list--]>p:last-child a{color:var(--global-color-primary--xx-dark)}[class*=s-article-list--]>p:last-child a:before{content:"\f35a";display:inline-block;font-family:Font Awesome\ 5 Free;font-size:1.4rem;margin-right:10px;vertical-align:middle}.s-article-list--links{color:var(--global-color-primary--xx-dark);font-size:1.4rem}.s-article-list--links p:not(:last-child){margin:0}.s-article-list--links p:not(:last-child) a{color:var(--global-color-primary--xx-dark);font-weight:var(--bold)}.s-article-list--links p:not(:last-child){position:relative}.s-article-list--links p:not(:last-child) a:before{content:""}.s-article-list--layout-a,.s-article-list--layout-b,.s-article-list--layout-c,.s-article-list--layout-d{-moz-column-gap:3rem;column-gap:3rem}.s-article-list--layout-gapless{gap:0}.s-article-list--layout-compact>p:last-child{margin-top:0}.s-article-list--layout-divided>:not(h2):not(p:last-child){border-style:solid;border-width:var(--global-border-width--normal) 0 0;padding-top:.8rem}.o-section--style-dark .s-article-list--layout-divided>:not(h2):not(p:last-child),.o-section--style-dark.s-article-list--layout-divided>:not(h2):not(p:last-child){border-color:var(--global-color-primary--light)}.o-section--style-light .s-article-list--layout-divided>:not(h2):not(p:last-child),.o-section--style-light.s-article-list--layout-divided>:not(h2):not(p:last-child){border-color:var(--global-color-primary--dark)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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-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)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */ul.s-cms-nav{margin-bottom:0;padding-left:0}.s-cms-nav a:hover{text-decoration:none}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */.s-footer>p:last-of-type{margin:0}.s-footer a{color:var(--global-color-primary--light)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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(--header-major-border-color);font-family:var(--global-font-family);font-size:16px;line-height:1.4}.s-header .navbar-brand{color:var(--header-text-color);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(--header-bkgd-color);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(--header-text-color)}.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(--header-minor-border-color);margin-left:12px}.dropdown-menu{font-size:16px}.s-header [class*=fa-]{text-align:center;width:27px}.navbar-toggler-icon{filter:var(--menu-toggle-icon)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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{-webkit-padding-start:unset;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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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{-webkit-margin-end:.25em;content:":";margin-inline-end:.25em}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */.s-irregular-links [class*=button--as-link],.s-irregular-links a,.x-link,.x-link--irregular{color:var(--global-color-accent--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 [class*=button--as-link]:hover,.s-irregular-links a:hover,.x-link--hover,.x-link--irregular--hover{color:var(--global-color-accent--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.s-irregular-links [class*=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 [class*=button--as-link],.s-irregular-links a,.x-link--irregular{text-decoration-line:underline}.s-irregular-links [class*=button--as-link]:hover,.s-irregular-links a:hover,.x-link--irregular--hover{text-decoration-style:dashed}.s-irregular-links [class*=button--as-link]:active,.s-irregular-links a:active,.x-link--irregular--active{text-decoration-style:dotted}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.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{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(--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
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */
|
package/dist/trumps/u-hide.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | 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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! @tacc/core-styles 2.
|
|
1
|
+
/*! @tacc/core-styles 2.14.0+ | MIT | github.com/TACC/Core-Styles */.u-nested-text-content{padding-left:var(--global-space--list-indent)}
|
package/docs/contributing.md
CHANGED
|
@@ -40,8 +40,9 @@ Only appointed team members may release versions.
|
|
|
40
40
|
`npm version N.N.N`
|
|
41
41
|
1. Commit, push, PR, review.\
|
|
42
42
|
<sup>Do **not** merge yet.</sup>
|
|
43
|
-
1. Publish to NPM via
|
|
44
|
-
|
|
43
|
+
1. Publish to NPM via:\
|
|
44
|
+
`npm publish --access public`\
|
|
45
|
+
<sup>Project build will automatically occur before publish.</sup>
|
|
45
46
|
1. Commit NPM build output.
|
|
46
47
|
1. Merge pull request.
|
|
47
48
|
1. Create release and tag on GitHub.
|
package/fractal.config.js
CHANGED
|
@@ -90,5 +90,14 @@ fractal.web.set('builder.dest', __dirname + '/demo');
|
|
|
90
90
|
// Customize theme
|
|
91
91
|
fractal.web.theme(theme);
|
|
92
92
|
|
|
93
|
+
// Add template helpers
|
|
94
|
+
const engine = fractal.components.engine();
|
|
95
|
+
engine.handlebars.registerHelper('eq', function(a, b) {
|
|
96
|
+
return a == b;
|
|
97
|
+
});
|
|
98
|
+
engine.handlebars.registerHelper('has', function(array, item) {
|
|
99
|
+
return array.includes(item);
|
|
100
|
+
});
|
|
101
|
+
|
|
93
102
|
// Export
|
|
94
103
|
module.exports = fractal;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tacc/core-styles",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.14.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "TACC ACI WMA <wma-portals@gmail.com>",
|
|
6
6
|
"description": "CSS source and processor for TACC Core-CMS and Core-Portal.",
|
|
@@ -64,6 +64,7 @@
|
|
|
64
64
|
},
|
|
65
65
|
"devDependencies": {
|
|
66
66
|
"@frctl/fractal": "^1.5.13",
|
|
67
|
+
"@frctl/handlebars": "^1.2.15",
|
|
67
68
|
"@frctl/mandelbrot": "^1.10.1",
|
|
68
69
|
"minimist": "^1.2.7",
|
|
69
70
|
"npm-watch": "^0.11.0"
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
{{#each buttons as | button |}}{{#if ../is-list}}<li>{{/if}}{{!
|
|
2
|
+
|
|
3
|
+
}}<button
|
|
4
|
+
{{#if ../as-links}}class="c-button c-button--as-link"{{/if}}
|
|
5
|
+
{{#if button.id}}id="{{button.id}}"{{/if}}>{{!
|
|
6
|
+
}}{{button.name}}{{!
|
|
7
|
+
}}</button>{{!
|
|
8
|
+
|
|
9
|
+
}}{{#if ../is-list}}</li>{{/if}}{{/each}}
|
|
@@ -10,6 +10,14 @@
|
|
|
10
10
|
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
11
11
|
<ul>{{> @link-list links=../links is-list=true }}</ul>
|
|
12
12
|
</nav>
|
|
13
|
+
{{#if ../show_buttons }}
|
|
14
|
+
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
15
|
+
<ul>{{> @button-list buttons=../links is-list=true }}</ul>
|
|
16
|
+
</nav>
|
|
17
|
+
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
18
|
+
<ul>{{> @button-list buttons=../links is-list=true as-links=true }}</ul>
|
|
19
|
+
</nav>
|
|
20
|
+
{{/if}}
|
|
13
21
|
</dt>
|
|
14
22
|
{{/each}}
|
|
15
23
|
</dl>
|
|
@@ -25,6 +33,14 @@
|
|
|
25
33
|
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
26
34
|
<ol>{{> @link-list links=../links is-list=true }}</ol>
|
|
27
35
|
</nav>
|
|
36
|
+
{{#if ../show_buttons }}
|
|
37
|
+
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
38
|
+
<ol>{{> @button-list buttons=../links is-list=true }}</ol>
|
|
39
|
+
</nav>
|
|
40
|
+
<nav class="c-nav{{#each this}} c-nav--{{.}}{{/each}}">
|
|
41
|
+
<ol>{{> @button-list buttons=../links is-list=true as-links=true }}</ol>
|
|
42
|
+
</nav>
|
|
43
|
+
{{/if}}
|
|
28
44
|
</dt>
|
|
29
45
|
{{/each}}
|
|
30
46
|
</dl>
|
|
@@ -12,6 +12,16 @@
|
|
|
12
12
|
<nav class="c-nav c-nav--no-list{{#each this}} c-nav--{{.}}{{/each}}">
|
|
13
13
|
{{> @link-list links=../links }}
|
|
14
14
|
</nav>
|
|
15
|
+
{{#if ../show_buttons }}
|
|
16
|
+
{{#unless (has this "boxed")}}
|
|
17
|
+
<nav class="c-nav c-nav--no-list{{#each this}} c-nav--{{.}}{{/each}}">
|
|
18
|
+
{{> @button-list buttons=../links }}
|
|
19
|
+
</nav>
|
|
20
|
+
<nav class="c-nav c-nav--no-list{{#each this}} c-nav--{{.}}{{/each}}">
|
|
21
|
+
{{> @button-list buttons=../links as-links=true }}
|
|
22
|
+
</nav>
|
|
23
|
+
{{/unless}}
|
|
24
|
+
{{/if}}
|
|
15
25
|
</dd>
|
|
16
26
|
{{/each}}
|
|
17
27
|
</dl>
|
|
@@ -13,11 +13,15 @@ variants:
|
|
|
13
13
|
context:
|
|
14
14
|
modifiers:
|
|
15
15
|
- [piped]
|
|
16
|
+
- [piped, boxed]
|
|
16
17
|
- [piped, piped--before]
|
|
18
|
+
- [piped, boxed, piped--before]
|
|
17
19
|
- [piped, piped--after]
|
|
20
|
+
- [piped, boxed, piped--after]
|
|
18
21
|
status: wip
|
|
19
22
|
- name: no-list
|
|
20
23
|
context:
|
|
24
|
+
show_buttons: true
|
|
21
25
|
modifiers:
|
|
22
26
|
- []
|
|
23
27
|
- [boxed]
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
@import url("../tools/media-queries.css");
|
|
2
2
|
|
|
3
|
+
@import url("./c-button.selectors.css");
|
|
3
4
|
|
|
4
5
|
|
|
5
6
|
|
|
@@ -89,6 +90,12 @@ nav.c-nav--piped {
|
|
|
89
90
|
--pipe-style: var(--global-border--normal);
|
|
90
91
|
}
|
|
91
92
|
|
|
93
|
+
/* To ensure pipe is visible */
|
|
94
|
+
/* CAVEAT: Truncation will NOT work */
|
|
95
|
+
nav[class*="c-nav--piped"] button:--c-button--as-link {
|
|
96
|
+
overflow: visible;
|
|
97
|
+
}
|
|
98
|
+
|
|
92
99
|
|
|
93
100
|
/* Modifiers: Pipes: Methods */
|
|
94
101
|
|
|
@@ -123,12 +130,24 @@ nav.c-nav--piped {
|
|
|
123
130
|
border-right: var(--pipe-style);
|
|
124
131
|
right: calc( -0.5 * var(--link-padding));
|
|
125
132
|
}
|
|
133
|
+
.c-nav--piped--after button:--c-button--as-link:not(:last-child)::after {
|
|
134
|
+
margin-right: calc( -1 * var(--global-border-width--normal));
|
|
135
|
+
}
|
|
136
|
+
.c-nav--piped--after button:not(:--c-button--as-link):not(:last-child)::after {
|
|
137
|
+
margin-right: calc( -2 * var(--global-border-width--normal));
|
|
138
|
+
}
|
|
126
139
|
/* via "before" pseduo-element */
|
|
127
140
|
.c-nav--piped--before :--child-no-list:not(:first-child)::before,
|
|
128
141
|
.c-nav--piped--before :--child-of-list:not(:first-child)::before {
|
|
129
142
|
border-left: var(--pipe-style);
|
|
130
143
|
left: calc( -0.5 * var(--link-padding));
|
|
131
144
|
}
|
|
145
|
+
.c-nav--piped--before button:--c-button--as-link:not(:first-child)::before {
|
|
146
|
+
margin-left: calc( -2 * var(--global-border-width--normal));
|
|
147
|
+
}
|
|
148
|
+
.c-nav--piped--before button:not(:--c-button--as-link):not(:first-child)::before {
|
|
149
|
+
margin-left: calc( -2 * var(--global-border-width--normal));
|
|
150
|
+
}
|
|
132
151
|
/* default */
|
|
133
152
|
nav.c-nav--piped:not([class*="c-nav--piped--"]) {
|
|
134
153
|
@extend .c-nav--piped--after;
|
|
@@ -153,7 +172,7 @@ nav.c-nav {
|
|
|
153
172
|
/* NOTE: Client is expected to overwrite these */
|
|
154
173
|
--space-between-inline-items: 0.5em;
|
|
155
174
|
}
|
|
156
|
-
nav.c-nav a {
|
|
175
|
+
nav.c-nav :is(a, :--c-button--as-link) {
|
|
157
176
|
display: inline-block; /* to let line-height define clickable area */
|
|
158
177
|
padding-inline: var(--link-padding);
|
|
159
178
|
}
|
|
@@ -162,8 +181,12 @@ nav.c-nav a {
|
|
|
162
181
|
nav.c-nav--no-list {
|
|
163
182
|
display: flex; /* to remove whitespace between items */
|
|
164
183
|
flex-wrap: wrap;
|
|
184
|
+
align-items: center; /* for diff-height items e.g. links with buttons */
|
|
185
|
+
}
|
|
186
|
+
nav.c-nav--no-list:has(button) {
|
|
187
|
+
row-gap: var(--space-between-inline-items);
|
|
165
188
|
}
|
|
166
|
-
nav.c-nav--no-list > a {
|
|
189
|
+
nav.c-nav--no-list > :is(a, button) {
|
|
167
190
|
/* To space items via margin (use `-right` to not increase left indent) */
|
|
168
191
|
margin-right: var(--space-between-inline-items);
|
|
169
192
|
}
|
|
@@ -182,6 +205,7 @@ nav.c-nav--no-list > a {
|
|
|
182
205
|
nav.c-nav :is(ul,ol) {
|
|
183
206
|
display: flex;
|
|
184
207
|
flex-wrap: wrap;
|
|
208
|
+
align-items: center; /* for diff-height items e.g. links with buttons */
|
|
185
209
|
|
|
186
210
|
/* To prevent overlap of any lists' decorators (when items are inline) */
|
|
187
211
|
list-style-position: inside;
|
|
@@ -43,7 +43,6 @@
|
|
|
43
43
|
@import url("./components/c-card--frontera-about-page.css");
|
|
44
44
|
|
|
45
45
|
/* TRUMPS */
|
|
46
|
-
@import url("./trumps/s-affixed-input-wrapper.css");
|
|
47
46
|
/* To explain the in-limbo Core-CMS doc page styles */
|
|
48
47
|
/* FAQ: Commented out because Core-CMS doc pages load these directly */
|
|
49
48
|
/* IMPORTANT: If CMS docs are moved to TACC-Docs, then kill these stylesheets */
|
|
@@ -5,11 +5,13 @@ _This is an isolated feature from [Bootstrap Input Group](https://getbootstrap.c
|
|
|
5
5
|
**Use Cases**
|
|
6
6
|
|
|
7
7
|
- [APCD](https://apcd-qa.tacc.utexas.edu/register/request-to-submit) "Total Claims Value"
|
|
8
|
+
- [Core Portal](https://github.com/TACC/Core-Portal) to replace [Bootstrap `.input-group`](https://getbootstrap.com/docs/4.0/components/input-group/)*
|
|
9
|
+
|
|
10
|
+
<small>* Bootstrap `.input-group` requires extra markup, which can make it cumbersome to combine React JSX components without the components having "external knowledge".</small>
|
|
8
11
|
|
|
9
12
|
**Known Bugs**
|
|
10
13
|
|
|
11
|
-
1.
|
|
12
|
-
2. A `s-affixed-input-wrapper__suffix` overlaps with browser controls e.g.
|
|
14
|
+
1. A `s-affixed-input-wrapper__suffix` overlaps with browser controls e.g.
|
|
13
15
|
- `<input type="number">` arrows
|
|
14
16
|
- `<input type="date">` calendar
|
|
15
17
|
- `<input type="time">` clock
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
<div class="
|
|
2
|
+
s-affixed-input-wrapper s-affixed-input-wrapper--{{modifier}}
|
|
3
|
+
{{#if is-full-width}}s-affixed-input-wrapper--full-width{{/if}}
|
|
4
|
+
">
|
|
5
|
+
<label for="field-dollars">How many dollars do you have?</label>
|
|
6
|
+
<span class="s-affixed-input-wrapper__{{modifier}}">$</span>
|
|
7
|
+
<input
|
|
8
|
+
type="number"
|
|
9
|
+
name="dollars"
|
|
10
|
+
id="field-dollars"
|
|
11
|
+
inputmode="numeric"
|
|
12
|
+
step="0.01"
|
|
13
|
+
min="0.01"
|
|
14
|
+
/>
|
|
15
|
+
</div>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<div class="
|
|
2
|
+
s-affixed-input-wrapper s-affixed-input-wrapper--{{modifier}}
|
|
3
|
+
{{#if is-full-width}}s-affixed-input-wrapper--full-width{{/if}}
|
|
4
|
+
">
|
|
5
|
+
<label for="text-to-copy-{{modifier}}">Text to Copy</label>
|
|
6
|
+
<button
|
|
7
|
+
class="s-affixed-input-wrapper__{{modifier}} c-button c-button--size-small"
|
|
8
|
+
data-copy-target="text-to-copy-{{modifier}}"
|
|
9
|
+
>
|
|
10
|
+
Copy
|
|
11
|
+
</button>
|
|
12
|
+
<input id="text-to-copy-{{modifier}}" name="text-{{modifier}}" />
|
|
13
|
+
</div>
|
|
@@ -1,4 +1,12 @@
|
|
|
1
|
-
label: (CMS) S Affixed Input Wrapper
|
|
2
1
|
context:
|
|
3
2
|
shouldLoadCMS: true
|
|
4
3
|
📝 shouldLoadBootstrap: temporary dependence, until proven to work on Portal
|
|
4
|
+
variants:
|
|
5
|
+
- name: default
|
|
6
|
+
hidden: true
|
|
7
|
+
- name: prefix-and-suffix
|
|
8
|
+
label: Prefix & Suffix
|
|
9
|
+
status: wip
|
|
10
|
+
- name: prepend-and-append
|
|
11
|
+
label: Prepend & Append
|
|
12
|
+
status: prototype
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
<dl>
|
|
2
|
+
<dt>Prefix</dt>
|
|
3
|
+
<dl>
|
|
4
|
+
<dt>Auto-Width Input</dt>
|
|
5
|
+
<dd>
|
|
6
|
+
{{> @s-affixed-input-wrapper--affix modifier="prefix" }}
|
|
7
|
+
</dd>
|
|
8
|
+
<dt>Static-Width Input</dt>
|
|
9
|
+
<dd class="demo-static-width">
|
|
10
|
+
{{> @s-affixed-input-wrapper--affix modifier="prefix" }}
|
|
11
|
+
</dd>
|
|
12
|
+
<dt>Full-Width Input</dt>
|
|
13
|
+
<dd>
|
|
14
|
+
{{> @s-affixed-input-wrapper--affix modifier="prefix" is-full-width=true }}
|
|
15
|
+
</dd>
|
|
16
|
+
</dl>
|
|
17
|
+
<dt>Suffix</dt>
|
|
18
|
+
<dl>
|
|
19
|
+
<dt>Auto-Width Input</dt>
|
|
20
|
+
<dd>
|
|
21
|
+
{{> @s-affixed-input-wrapper--affix modifier="suffix" }}
|
|
22
|
+
</dd>
|
|
23
|
+
<dt>Static-Width Input</dt>
|
|
24
|
+
<dd class="demo-static-width">
|
|
25
|
+
{{> @s-affixed-input-wrapper--affix modifier="suffix" }}
|
|
26
|
+
</dd>
|
|
27
|
+
<dt>Full-Width Input</dt>
|
|
28
|
+
<dd>
|
|
29
|
+
{{> @s-affixed-input-wrapper--affix modifier="suffix" is-full-width=true }}
|
|
30
|
+
</dd>
|
|
31
|
+
</dl>
|
|
32
|
+
</dl>
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
<dl>
|
|
2
|
+
<dt>Prepend</dt>
|
|
3
|
+
<dl>
|
|
4
|
+
<dt>Auto-Width Input</dt>
|
|
5
|
+
<dd>
|
|
6
|
+
{{> @s-affixed-input-wrapper--end modifier="prepend" }}
|
|
7
|
+
</dd>
|
|
8
|
+
<dt>Static-Width Input</dt>
|
|
9
|
+
<dd class="demo-static-width">
|
|
10
|
+
{{> @s-affixed-input-wrapper--end modifier="prepend" }}
|
|
11
|
+
</dd>
|
|
12
|
+
<dt>Full-Width Input</dt>
|
|
13
|
+
<dd>
|
|
14
|
+
{{> @s-affixed-input-wrapper--end modifier="prepend" is-full-width=true }}
|
|
15
|
+
</dd>
|
|
16
|
+
</dl>
|
|
17
|
+
<dt>Append</dt>
|
|
18
|
+
<dl>
|
|
19
|
+
<dt>Auto-Width Input</dt>
|
|
20
|
+
<dd>
|
|
21
|
+
{{> @s-affixed-input-wrapper--end modifier="append" }}
|
|
22
|
+
</dd>
|
|
23
|
+
<dt>Static-Width Input</dt>
|
|
24
|
+
<dd class="demo-static-width">
|
|
25
|
+
{{> @s-affixed-input-wrapper--end modifier="append" }}
|
|
26
|
+
</dd>
|
|
27
|
+
<dt>Full-Width Input</dt>
|
|
28
|
+
<dd>
|
|
29
|
+
{{> @s-affixed-input-wrapper--end modifier="append" is-full-width=true }}
|
|
30
|
+
</dd>
|
|
31
|
+
</dl>
|
|
32
|
+
</dl>
|
|
33
|
+
<script>
|
|
34
|
+
const copyButtons = document.querySelectorAll('[data-copy-target]');
|
|
35
|
+
|
|
36
|
+
[ ...copyButtons ].forEach( button => button.addEventListener('click', event => {
|
|
37
|
+
const textFieldId = event.srcElement.dataset.copyTarget
|
|
38
|
+
const textField = document.getElementById( textFieldId );
|
|
39
|
+
const text = textField.value;
|
|
40
|
+
|
|
41
|
+
navigator.clipboard.writeText( text );
|
|
42
|
+
}));
|
|
43
|
+
</script>
|
|
@@ -1,32 +1 @@
|
|
|
1
|
-
|
|
2
|
-
<dt>Prefix</dt>
|
|
3
|
-
<dd>
|
|
4
|
-
<div class="s-affixed-input-wrapper s-affixed-input-wrapper--prefix">
|
|
5
|
-
<label for="field-dollars">How many dollars to you have?</label>
|
|
6
|
-
<span class="s-affixed-input-wrapper__prefix">$</span>
|
|
7
|
-
<input
|
|
8
|
-
type="number"
|
|
9
|
-
name="dollars"
|
|
10
|
-
id="field-dollars"
|
|
11
|
-
inputmode="numeric"
|
|
12
|
-
step="0.01"
|
|
13
|
-
min="0.01"
|
|
14
|
-
/>
|
|
15
|
-
</div>
|
|
16
|
-
</dd>
|
|
17
|
-
<dt>Suffix</dt>
|
|
18
|
-
<dd>
|
|
19
|
-
<div class="s-affixed-input-wrapper s-affixed-input-wrapper--suffix">
|
|
20
|
-
<label for="field-usd">How many US Dollars to you have?</label>
|
|
21
|
-
<input
|
|
22
|
-
type="number"
|
|
23
|
-
name="usd"
|
|
24
|
-
id="field-usd"
|
|
25
|
-
inputmode="numeric"
|
|
26
|
-
step="0.01"
|
|
27
|
-
min="0.01"
|
|
28
|
-
/>
|
|
29
|
-
<span class="s-affixed-input-wrapper__suffix">$</span>
|
|
30
|
-
</div>
|
|
31
|
-
</dd>
|
|
32
|
-
</dl>
|
|
1
|
+
<!-- SEE: s-affixed-input-wrapper--… -->
|