diff --git a/apps/tup-cms/src/taccsite_cms/settings_custom.py b/apps/tup-cms/src/taccsite_cms/settings_custom.py index 0acd05f07..a0206b15a 100644 --- a/apps/tup-cms/src/taccsite_cms/settings_custom.py +++ b/apps/tup-cms/src/taccsite_cms/settings_custom.py @@ -93,8 +93,8 @@ ######################## PORTAL_LOGO = { - "img_file_src": "tup_cms/img/org_logos/tacc-logo-white-25years--cropped.svg", - "is_remote": False, + "img_file_src": "https://cdn.jsdelivr.net/gh/TACC/Core-CMS-Custom@v1/tup/img/logo-white-25years--cropped.svg", + "is_remote": True, "img_class": "", "link_href": "/", "link_name": "TACC Homepage", diff --git a/apps/tup-cms/src/taccsite_cms/templates/assets_custom.html b/apps/tup-cms/src/taccsite_cms/templates/assets_custom.html index 0b30c4aaf..1721d83e3 100644 --- a/apps/tup-cms/src/taccsite_cms/templates/assets_custom.html +++ b/apps/tup-cms/src/taccsite_cms/templates/assets_custom.html @@ -18,9 +18,9 @@ {# NEW CODE #} - - +{# NOTE: 2nd-breadcrumb de-linking no longer needs a dedicated script — #} +{# Core-CMS's nav_cms_breadcrumbs.html already handles it #} - + diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/agenda-table.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/agenda-table.css deleted file mode 100644 index 05d64729a..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/agenda-table.css +++ /dev/null @@ -1,40 +0,0 @@ -/* FAQ: Used on https://www.tacc.utexas.edu/events/institutues/sample/ */ - -/* FAQ: To support as Black */ -/* TODO: If this is needed, add each to Core Styles as appropriate */ -/* SEE: src/lib/_imports/settings/font.css Roboto @import */ -@import url('https://fonts.googleapis.com/css?family=Roboto:900&display=swap'); -.agenda-table { --black: 900; } - -/* TODO: Implement in core-styles.cms.css as s-agenda-table aka agenda-table */ -.agenda-table time { - font-family: var(--global-font-family--mono); - display: block; /* so text-align is effectual */ - text-align: right; -} -.agenda-table p:not(:last-child) { - margin-bottom: 0.25em; -} -.agenda-table :is(td, th):first-child { - border-right: var(--global-border-width--normal) solid var(--global-color-primary--dark); -} -.agenda-table :is(td, th):nth-child(2) { - text-align: center; -} - -.agenda-table :is(td, th):not([class*="agenda-table__"]) { - background: transparent; -} -.agenda-table__neutral -/* FAQ: Phasing out "primary" misnomer by not propogating it */ { - background: var(--global-color-primary--x-light); -} -.agenda-table__accent { - background: var(--global-color-accent--xxx-light); -} -[class*="agenda-table__secondary"] { - background: var(--global-color-secondary--xx-light); -} -.agenda-table__tertiary { - background: var(--global-color-tertiary--xx-light); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner.css deleted file mode 100644 index 31f1cb6ef..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner.css +++ /dev/null @@ -1,190 +0,0 @@ -/* TODO: Support .c-banner-cell */ - - - - -/* Banner Cell */ - -[class*="banner-cell--"] { - --tag-padding: 0.5rem; /* manually copied from .c-tag styles */ -} - -/* Elements */ - -[class*="banner-cell--"] :where(h1, h2, h3, h4) { - margin-bottom: 0; -} - -/* So image caption heights are equal (not an issue on narrow screen) */ -@media (width >= 576px) { - [class*="banner-cell--"] > a { - height: 100%; - display: block; - } -} - -/* FAQ: Using after so outline is on top of mix-blend-mode (see .o-colorize) */ -[class*="banner-cell--"] > a { position: relative; } -[class*="banner-cell--"] > a:hover::after { - --border-width: var(--global-border-width--thick); - - /* FAQ: Using `border` shrinks content while `outline` does not */ - outline-width: var(--border-width); - outline-style: solid; - outline-color: var(--global-color-primary--xxx-dark); - outline-offset: calc( -1 * var(--border-width) ); - - /* So ::after stretches to fill parent */ - content: ''; - display: block; - position: absolute; - left: 0; top: 0; bottom: 0; right: 0; -} -[class*="banner-cell--"] > a:active { - --border-width: var(--global-border-width--normal); -} - -[class*="banner-cell--"] figure { - margin-bottom: unset; /* undo core-cms.css and Bootstrap */ -} - -[class*="banner-cell--"] figcaption { - padding-inline: 3.0rem; -} - -/* To remove standard link text docoration */ -[class*="banner-cell--"] > a { - text-decoration: none; -} - -/* To cover a re-sized image box with the full-size image (like a bkgd image) */ -/* FAQ: If user sets dimension via style, we assume they want this feature */ -[class*="banner-cell--"] figure:where([style*="height"], [style*="width"]) img { - object-fit: cover; - height: 100%; - width: 100%; -} - -/* Components */ - -[class*="banner-cell--"] .c-tag, -[class*="banner-cell--"] [class*="tag--"] { - display: block; - margin-bottom: 2.0rem; -} - -[class*="banner-cell--"] .u-highlight { - padding-inline: var(--tag-padding); - - color: var(--global-color-primary--xx-light); - background-color: var(--global-color-primary--xxx-dark); - - line-height: 1; -} - - -/* Banner Cell (Major) */ - -/* To allow image to be underneath text */ -.banner-cell--major figure { - display: grid; - - /* To force % image height to match its container (i.e.
) */ - /* https://stackoverflow.com/a/52137966/11817077 */ - grid-template-rows: minmax( 0, 1fr ); -} - -.banner-cell--major h2 { - font-size: var(--global-font-size--xxx-large); - font-weight: var(--bold); - - text-transform: uppercase; -} - -/* To move text atop image */ -.banner-cell--major img, -.banner-cell--major figcaption { - grid-row: 1; - grid-column: 1; -} -.banner-cell--major figcaption { - align-self: end; /* to align text to bottom */ -} - -/* To showcase image more on mobile and not let tag be flush against header */ -@media (width < 576px) { - .banner-cell--major figcaption { - margin-top: 6rem; - margin-bottom: 8rem; - } -} -@media (width >= 576px) { - .banner-cell--major figcaption { - margin-top: 3.5rem; - margin-bottom: 5rem; - } -} - - - -/* Banner Cell (Minor) */ - -/* To space out cells */ -@media (width < 576px) { - .banner-cell--minor { - margin-top: calc( var(--global-space--bootstrap-gap) / 2 ); - } - .banner-cell--minor:last-child { - margin-bottom: calc( var(--global-space--bootstrap-gap) / 2 ); - } -} -@media (width >= 576px) { - .banner-cell--minor { - margin-block: var(--global-space--bootstrap-gap); - } -} - -/* To allow image to be underneath text */ -.banner-cell--minor figure { - display: grid; - - /* To make image and caption fill, but also fit within, grid */ - grid-template-rows: auto 1fr; - grid-template-columns: minmax( 0, 1fr ); -} - -/* To add space under caption text within container */ -.banner-cell--minor figcaption { - padding-bottom: 3.0rem; -} - -.banner-cell--minor h2 { - color: var(--global-color-primary--xxx-dark); /* undo core-styles.cms */ - font-weight: revert; -} - -/* To move text atop image */ -.banner-cell--minor figcaption { - /* To move by half the height of the .c-tag */ - /* FAQ: Not using `translateY(-50%)` because h2 must move same amount */ - --offset: calc( var(--tag-padding) + ( var(--global-font-size--small) / 2 ) ); - - /* FAQ: Using variable so styles that extend this can use the value */ - margin-top: calc( -1 * var(--offset) ); -} - - - - - -/* Conflicts with Core-CMS */ - -/* Overwrite Core-CMS core-cms.css */ -/* HELP: How can all CMS sites avoid this? */ -[class*="banner-cell--"] figcaption { - border-bottom: unset; - color: unset; - font-size: unset; - font-style: normal; - line-height: inherit; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/banner.hbs b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/banner.hbs deleted file mode 100644 index 85b223530..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/banner.hbs +++ /dev/null @@ -1,56 +0,0 @@ - - \ No newline at end of file diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/readme.md b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/readme.md deleted file mode 100644 index 92e7e10b0..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/banner/readme.md +++ /dev/null @@ -1,3 +0,0 @@ -A list of article previews. - -> **⚠️ Warning**: Styles are heavily dependent on the tags in the sample markup. diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-data-list.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-data-list.css deleted file mode 100644 index d5926536d..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-data-list.css +++ /dev/null @@ -1,15 +0,0 @@ -/* SEE: https://dev.tup.tacc.utexas.edu/systems/frontera/ */ - -table[class*="data-list--"] { - /* TODO: Consider this for all tables */ - margin-bottom: 40px; -} -table[class*="data-list--"] :is(th, td) { - background: unset; -} -table[class*="data-list--"] th { - font-weight: var(--black); /* undo core-styles.base table */ -} -table[class*="data-list--"] td { - color: unset; /* undo core-styles.base table */ -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-footer.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-footer.css deleted file mode 100644 index 9fc3fd84d..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-footer.css +++ /dev/null @@ -1,244 +0,0 @@ -/* BUTTONS */ - -/* To style buttons differently than in body */ -.c-footer .c-button, -.c-footer [class*="button--"] { - & small { - font-size: var(--global-font-size--x-small); - } -} - - - - - -/* LOGOS */ - -/* To set baseline styles for footer logos */ -/* TODO: Evaluate for tup-ui or core-cms CSS */ -.c-footer svg { - fill: var(--global-color-primary--xx-light); -} -.c-footer [class*="logos--"] { - display: grid; - gap: var(--gap, 0); - grid-auto-flow: column; - justify-content: center; -} -.c-footer .logos--branding { - --gap: 2rem; - - /* NOTE: Test any changes on all browsers and screen sizes */ - grid-template-columns: repeat( 3, minmax(0, 1fr) ); -} -.c-footer .logos--branding a { - min-height: 60px; - max-height: 120px; -} - -.c-footer [class*="logos--"] a { - display: inline-flex; - align-items: center; - justify-content: center; /* horz align when image narrower than grid cell */ -} - -/* For independent logo sizes */ -.c-footer .logos--branding svg { - height: 55%; -} -.c-footer .logos__tacc svg { - /* To vertically align center as if small text was not present */ - transform: translateY(5%); -} -.c-footer .logos__ut svg { - /* To vertically align center as if small text was not present */ - transform: translateY(5%); -} - -/* To create fake border between logos */ -.c-footer [class*="logos--"] a { position: relative } -.c-footer .logos--branding a:not(:first-child)::before { - height: 75%; - - position: absolute; - left: calc( -1 * var(--gap)/2 ); - - content: ''; - display: block; - background-color: var(--global-color-primary--xx-light); - background-clip: content-box; - width: var(--global-border-width--normal); - box-sizing: content-box; - - cursor: default; -} - -/* To skin logo links */ -.c-footer [class*="logos--"] a { - &:hover { - color: inherit; - } - &:hover svg { - color: currentColor; - outline: var(--global-border-width--normal) solid currentColor; - outline-offset: 5px; - border-radius: var(--global-border-width--normal); - } - &:active svg { - outline-style: dotted; - } -} -.c-footer .logos--social a { - padding: 0.5em; -} -.c-footer .logos--social svg { - font-size: 2.5rem; -} - - -/* HACK: To undo tricky Instagram hover color */ -.c-footer .logos--social a.logos__instagram:hover { - mask: unset; - background: unset; -} -.c-footer .logos--social a.logos__instagram:hover svg { - visibility: visible; -} - - - - - -/* LAYOUT */ - - - -/* LAYOUT - All Screens */ - -.c-footer { - --pad-vert: 36px; - --pad-horz: 36px; -} - - -/* LAYOUT - Narrow Screen */ - -/* Move all panes to one column */ -@media (width < 380px) { - #cms-footer .col { - /* FAQ: I copied Bootstrap .col-6 styles and changed 50% to 100% */ - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - max-width: 100%; - } -} - - - - -/* LAYOUT - Wide Screen */ - -/* To draw a line between "Quick Links" and regular links */ -@media (width > 380px) { - #cms-footer .c-pane--aside { - border-left: var(--global-border-width--normal) solid var(--global-color-primary--xx-light); - } -} - -/* To draw a box behind common footer content */ -/* FAQ: The box stretches to cover the height and right side of the footer */ -@media (width >= 992px) { - #cms-footer .c-pane--common { - /* To move c-footer vertical padding into this pane */ - margin-block: calc( -1 * var(--pad-vert) ); - padding-block: var(--pad-vert); - - background-color: var(--global-color-primary--x-dark); - } - html:not(#page-portal) .c-footer { - padding-right: revert; /* undo core-styles.cms.css */ - } - #cms-footer .c-pane--common { - padding-inline: var(--pad-horz); - } - #cms-footer.row:not(.no-gutters) { - margin-right: 0; - } -} - - - - - -/* PER CLIENT */ - - -/* PER CLIENT - HIDE/SHOW */ - -/* To hide/show CMS/Portal footer */ -html#page-portal #cms-footer, /* new id */ -html:not(#page-portal) #portal-footer /* trans id */ { - display: none; -} - -/* PER CLIENT - PORTAL */ - -html:not(#page-portal) .c-footer { - /* To add a full-width border above CMS footer */ - /* TODO: Evaluate for tup-ui or Core-CMS CSS */ - border-width: var(--global-border-width--thick) 0 0 0; - border-style: solid; - border-color: var(--global-color-secondary--light); - - /* To remove padding-block on CMS footer */ - padding-block: unset; -} - -/* To reduce size of Portal footer */ -html#page-portal .c-footer { - --pad-vert: 0; - --pad-horz: 15px; /* WARNING: any less causes unexplained scrollbar */ -} -html#page-portal .c-footer p { - margin-bottom: revert; /* undo Bootstrap */ -} - -/* To vertically center text */ -#portal-footer p { - margin-block: revert; /* undo Bootstrap */ -} - - - -/* PER CLIENT - CMS */ - -/* To move footer padding into CMS footer */ -#cms-footer { - padding-block: var(--pad-vert); -} - -/* To tweak minor styles */ -#cms-footer { - color: var(--global-color-primary--light); -} - -/* Add vertical space between panes, except for aside when it is below others */ -/* FAQ: Bootstrap 4 grid does not have a way to do so */ -#cms-footer .col.c-pane--nav { - margin-bottom: 2rem; -} - -/* To make text color match on regular text and hyperlinks */ -#cms-footer .c-pane--common, -#cms-footer .c-pane--common a { - color: var(--global-color-primary--xx-light); -} -#cms-footer .c-pane--common a { - text-decoration-line: underline; - text-decoration-color: var(--global-color-primary--dark); - - &:hover { - text-decoration-color: inherit; - } -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-news.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-news.css deleted file mode 100644 index 7a3a3cb3d..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-news.css +++ /dev/null @@ -1,14 +0,0 @@ -/* To adjust display of metadata (given what .c-update shows) */ -.c-news--read article.has-update .c-news__data { - display: none; -} -.c-news--read article.has-update .c-news__title { - /* Overwrites c-news--read.css */ - border-bottom: unset; - margin-bottom: 6.5rem; -} - -/* To hide byline on User Updates */ -.c-news__byline:not(.app-blog *) { - display: none; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-tag.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-tag.css deleted file mode 100644 index 70a2b3e45..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-tag.css +++ /dev/null @@ -1,63 +0,0 @@ -.c-tag, -[class*="tag--"] { - display: block; - margin-bottom: 2.0rem; - - color: var(--global-color-primary--xx-light); - - font-size: var(--global-font-size--small); -} - -/* Press Release */ -[class*="tag--pr"], -/* To overwrite core-cms django.cms.blog.app.css */ -.app-blog .categories a:is( - .blog-category-press-release -) { - background: #723B0C; -} - -/* Q&A, Human Interest */ -[class*="tag--qa"], -/* To overwrite core-cms django.cms.blog.app.css */ -.app-blog .categories a:is( - .blog-category-qa, - .blog-category-welcome-profile, - .blog-category-staff-highlight -) { - background: var(--global-color-accent--light); -} - -/* Has Video, Audio, or other media beyond statc image */ -[class*="tag--media"], -/* To overwrite core-cms django.cms.blog.app.css */ -.app-blog .categories a:is( - .blog-category-podcast, - .blog-category-multimedia -) { - background: var(--global-color-primary--dark); -} - -/* System Status Update */ -[class*="tag--system"] { - background: var(--global-color-tertiary--normal); -} - -/* Feature Story (different than a "featured" article) */ -[class*="tag--feature"], -/* To overwrite core-cms django.cms.blog.app.css */ -.app-blog .categories a:is( - .blog-category-feature-story -) { - background: var(--global-color-accent--normal); -} - -/* External Article */ -[class*="tag--external"] { - background: var(--global-color-secondary--normal); -} - -/* Event */ -[class*="tag--event"] { - background: var(--global-color-tertiary--dark); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css deleted file mode 100644 index 1bded9437..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css +++ /dev/null @@ -1,21 +0,0 @@ -/* To style "Update" pill in title */ -.c-update__title .c-pill { - vertical-align: middle; - transform: translateY(-0.125em); -} -.c-update__title .c-pill:not([class*="c-pill--"]) { - background-color: var(--global-color-primary--light); -} - -/* To reduce space between "Original Update" and its content */ -.c-update__header + .c-news__content { - margin-top: unset; /* ovewrite c-news--read.css */ -} - -/* To tweak hr appearance and layout */ -.c-update + hr { - border-top-color: var(--global-color-priamry--dark); - - /* To make line between updates darker and have equal space above and below */ - margin-top: var(--global-space--hr-buffer-below); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-widget.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-widget.css deleted file mode 100644 index 5016037fb..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-widget.css +++ /dev/null @@ -1,20 +0,0 @@ -/* FAQ: Used on homepage to mimic `c-feed` style (User Updates) heading */ -/* SEE: https://dev.tup.tacc.utexas.edu/ */ - -/* TODO: Consider 1 pattern for styles shared between c-feed-list & c-widget */ - -/* !!!: Clones corresponding .c-feed-list syle */ -.c-widget > :is(h1, h2, h3, h4, h5, h6) { - margin-top: 0; - margin-bottom: 10px; - - /* TODO: When migrated to core-styles, use @extend instead */ - /* @extend .x-truncate--one-line; */ - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; -} - -.c-widget > div { - border-top: var(--global-border-width--normal) solid var(--global-color-primary--dark); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/content-block.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/content-block.css deleted file mode 100644 index 2e0ace370..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/content-block.css +++ /dev/null @@ -1,9 +0,0 @@ -/* SEE https://dev.tup.tacc.utexas.edu/use-tacc/stem-evaluation-services/ */ -/* FAQ: This is specific to TACC, not for Core */ - -/* To remove some space between content blocks */ -/* FAQ: Short-term solution to excess space */ -/* FAQ: Long-term solution is redo spacing for Rows, Cols, Blocks, and Cards */ -:is(.c-content-block, .content-block) + :is(.c-content-block, .content-block) { - margin-top: calc( -1 * var(--global-space--bootstrap-gap) ); /* usurp `:is(.c-content-block, .content-block)` */ -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django-cms-forms.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django-cms-forms.css deleted file mode 100644 index 1a3b1856b..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django-cms-forms.css +++ /dev/null @@ -1,11 +0,0 @@ -/* Used on a TACC CMS form that is in a card */ -/* SEE: https://dev.tup.tacc.utexas.edu/about/security-and-compliance/protected-data-service/ */ - -/* Add extra space to bottom of a form in a card */ -/* NOTE: We need this only cuz/if padding is removed from card bottom… */ -/* TODO: Review selector (does a form in ANY card need this?) */ -/* TODO: Review whether to support this edge case for `.c-form` also */ -/* TODO: After review of the selector, add to core-styles.cms.css */ -:is(.card, .c-card, [class*="card--"]) .forms { - margin-bottom: 20px; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django.cms.blog.app.page.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django.cms.blog.app.page.css deleted file mode 100644 index 90475b5ba..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/django.cms.blog.app.page.css +++ /dev/null @@ -1,28 +0,0 @@ -/* To add space beneath image whose

trapped inside it the text beneath */ -/* NOTE: W.B. does NOT know how the text gets trapped with image in one

*/ -/* HELP: Do not integrate into Core unless the use case is real and clarified */ -article.post-detail .blog-content > p:first-child > img:not(:only-child) { - margin-bottom: 2rem; /* mimic core-styles.cms

margin-bottom */ -} - -/* On article page, to hide automatic main image */ -/* TODO: Consider CMS setting to hide `.blog-visual` */ -article.post-detail .blog-visual { - display: none; -} -@media (width < 576px) { - /* To continue hiding news article image on mobile */ - /* TODO: Determine how best to hide on TUP, but not every site */ - /* FAQ: Core-CMS (in dev/tup-cms) sets .blog-visual to `display: grid` */ - /* SEE: https://github.com/TACC/Core-CMS/blob/v3.12.0-alpha.9/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.page.css#L86-L93 */ - /* SEE: https://github.com/TACC/tup-ui/pull/218#issuecomment-1669960294 */ - article.post-detail .blog-visual { - display: none !important; /* HACK: heavy-handed override of core-cms */ - } -} - -/* On article page, to hide "RELATED POSTS:" */ -/* TODO: Style "RELATED POSTS:" output */ -article.post-detail .post-detail-list { - display: none; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--fix-raw-image-size.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--fix-raw-image-size.css deleted file mode 100644 index 480cbee6d..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--fix-raw-image-size.css +++ /dev/null @@ -1,27 +0,0 @@ -/* FIX RAW IMAGE SIZE */ -/* FAQ: This is specific to TACC, not for Core */ - -/* All images are uploaded at @2x */ -/* HELP: How can we use @2x and @4x to support retina displays */ -:is(.layered-image, [class*="layered-image--"]) -> :is(.align-left, .align-left--oversized, .align-right, .align-center) { - /* transform: scale(50%); *//* To fix image size */ - transform: scale(40%); /* To fix then tweak image size */ -} -/* FAQ: Some images are off by a different size than the others... */ -:is(.layered-image, [class*="layered-image--"]) > img[src*="/paperclip"], -:is(.layered-image, [class*="layered-image--"]) > img[src*="/spiral"] { - transform: scale(75%); -} -@media (min-width: 768px) and (max-width: 991px) { - :is(.layered-image, [class*="layered-image--"]) - > :is(.align-left, .align-left--oversized, .align-right, .align-center) { - transform: scale(31.25%); - } -} -@media (min-width: 992px) and (max-width: 1199px) { - :is(.layered-image, [class*="layered-image--"]) - > :is(.align-left, .align-left--oversized, .align-right, .align-center) { - transform: scale(37.5%); - } -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--header-and-section-tweaks.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--header-and-section-tweaks.css deleted file mode 100644 index 0e094a587..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image--header-and-section-tweaks.css +++ /dev/null @@ -1,23 +0,0 @@ -/* HEADER & SECTION TWEAKS */ - -/* TODO: Integrate into Core-CMS */ - -/* So

content (e.g. `.c-layered-image`) does not appear atop header */ -/* So `nav.breadcrumbs` do not appear atop header CMS nav */ -body > header { - position: relative; - z-index: 2; -} - -/* So background image does NOT appear over ANY other section - (e.g. an `.align-center` "background image" of a layered image) */ -:is(.o-section, .section, [class*="section--"]) -/* FAQ: Only styled sections can use `position: relative` solution */ -+ [class*="section--"] { - position: relative; /* so previous section is z-index below next section */ -} -:is(.o-section, .section, [class*="section--"]) -/* FAQ: All sections can use `overflow-y` solution */ -+ :is(.o-section, .section, [class*="section--"]) { - overflow-y: clip; /* so successive section can not bleed into any section */ -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image.css deleted file mode 100644 index 44af7555b..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/layered-image.css +++ /dev/null @@ -1,200 +0,0 @@ -@import url("./layered-image--header-and-section-tweaks.css"); -@import url("./layered-image--fix-raw-image-size.css"); - -/* TODO: Integrate into Core-CMS */ -/* TODO: Pull component to right LIKE DESIGN (or use o-offset-content) */ -/* CAVEAT: Does NOT yet support the offset of main image as shown in design */ -/* https://xd.adobe.com/view/dabaec5a-cc31-4c5c-876e-56d6d8cc359e-8fe9/screen/c0898d6b-2fd9-472a-bcd7-1ae9d4f9a015/specs/ */ - - - - -/* BASE */ - -/* So top of `.align-left` decal image aligns with top of

*/ -/* FAQ: To limit style to specific context, consider: `.col`, `:only-child` */ -.layered-image, [class*="layered-image--"] { - --h1-offset: 0; - - margin-top: var(--h1-offset); -} - -/* So child images can be positioned */ -.layered-image, [class*="layered-image--"] { - /* So children can `position: absolute` */ - position: relative; - - /* So background image is centered without `transform: translate(…)` */ - /* FAQ: The `transform` prop is already used to scale images (see @media) */ - /* FAQ: To combine conditional `transform` values with `var()` is complex */ - /* FAQ: To use `scale` prop would work... except on Samsung Internet */ - display: grid; - justify-items: center; -} - - - -/* ELEMENTS */ - -/* So images can be positioned */ -:is(.layered-image, [class*="layered-image--"]) -> :is(.align-left, .align-left--oversized, .align-right, .align-center) { - position: absolute; -} -:is(.layered-image, [class*="layered-image--"]) -> :is(.align-left, .align-right) { - float: unset; /* undo core-cms.css */ - max-width: unset; /* undo core-cms.css */ -} - -/* To position images at standard anchor points */ -:is(.layered-image, [class*="layered-image--"]) > .align-left, -:is(.layered-image, [class*="layered-image--"]) > .align-left--oversized { - left: calc(var(--global-space--grid-gap) / 2); -} -:is(.layered-image, [class*="layered-image--"]) > .align-right { - right: calc(var(--global-space--grid-gap) / 2); -} -:is(.layered-image, [class*="layered-image--"]) > .align-left--oversized { - top: -12%; - left: -7%; -} -:is(.layered-image, [class*="layered-image--"]) > .align-center { - /* User must set top inline, because designs are few and inconsistent */ - /* https://xd.adobe.com/view/dabaec5a-cc31-4c5c-876e-56d6d8cc359e-8fe9/screen/032918ef-38c1-4cd2-bd3b-c38a5af710da/specs/ */ - /* https://xd.adobe.com/view/dabaec5a-cc31-4c5c-876e-56d6d8cc359e-8fe9/screen/3f3faa5d-3bca-41ed-9c13-0f94a4caae93/specs/ */ - top: 0; -} -@media (max-width: 575px) /* ✅ 2023-01-27 16:00 */ { - /* To position images at standard anchor points */ - :is(.layered-image, [class*="layered-image--"]) > .align-left, - :is(.layered-image, [class*="layered-image--"]) > .align-left--oversized { - top: -8.8%; - left: calc(var(--global-space--grid-gap) / 2); - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -9.25%; - right: calc(var(--global-space--grid-gap) / 2); - } -} -@media (min-width: 576px) and (max-width: 991px) /* ✅ 2023-01-27 16:00 */ { - :is(.layered-image, [class*="layered-image--"]) > .align-left { - top: -8.8%; - left: -3.4%; - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -9.25%; - right: -5%; - } -} -@media (min-width: 992px) and (max-width: 1199px) /* ✅ 2023-01-27 16:00 */ { - :is(.layered-image, [class*="layered-image--"]) > .align-left { - top: -7.5%; - left: -3%; - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -7.75%; - right: -4.35%; - } -} -@media (min-width: 1200px) and (max-width: 1679px) /* ✅ 2023-01-27 16:00 */ { - :is(.layered-image, [class*="layered-image--"]) > .align-left { - top: -8.8%; - left: -3.4%; - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -9.25%; - right: -5%; - } -} -@media (min-width: 1680px) and (max-width: 1919px) /* ✅ 2023-01-27 16:00 */ { - :is(.layered-image, [class*="layered-image--"]) > .align-left { - top: -7.5%; - left: -3%; - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -7.75%; - right: -4.35%; - } -} -@media (min-width: 1920px) /* ✅ 2023-01-27 16:00 */ { - :is(.layered-image, [class*="layered-image--"]) > .align-left { - top: -6.5%; - left: -3.6%; - } - :is(.layered-image, [class*="layered-image--"]) > .align-right { - bottom: -6.5%; - right: -4.9%; - } -} - -/* To reverse z-index of stacked images (so CMS user can layer intuitively) */ -/* CAVEAT: This works by accident, but designer loves it, so maintain this */ -:is(.layered-image, [class*="layered-image--"]) -> :not([class*="align-"], :only-child) { - position: relative; -} -:is(.layered-image, [class*="layered-image--"]) -> :is(.align-left, .align-left--oversized, .align-right, :not([class*="align-"], :only-child)) { - z-index: 1; -} -:is(.layered-image, [class*="layered-image--"]) -> :is(.align-left--oversized, .align-center) { - z-index: 0; -} - -/* Undo specific `core-styles.cms.css` .align-… margin */ -:is(.layered-image, [class*="layered-image--"]) > .align-left { - margin-right: unset; - margin-bottom: unset; -} -:is(.layered-image, [class*="layered-image--"]) > .align-right { - margin-left: unset; - margin-bottom: unset; -} -:is(.layered-image, [class*="layered-image--"]) > .align-center { - margin-inline: unset; -} - -/* To set origin for scaling decal and background images */ -:is(.layered-image, [class*="layered-image--"]) > .align-left { - transform-origin: top left; -} -:is(.layered-image, [class*="layered-image--"]) > .align-left--oversized { - transform-origin: top left; -} -:is(.layered-image, [class*="layered-image--"]) > .align-right { - transform-origin: bottom right; -} -:is(.layered-image, [class*="layered-image--"]) > .align-center { - transform-origin: top; -} - -/* TODO: Once in Core-CMS, use existing @custom-media */ -/* https://xd.adobe.com/view/dabaec5a-cc31-4c5c-876e-56d6d8cc359e-8fe9/screen/4906fef4-4665-473a-8ad3-459a4fab23c8/specs/ */ -@media (max-width: 575px) { - /* To pull pattern to edge of container when container has no max-width */ - :has(> .layered-image), .has-layered-image { - overflow-x: clip; - } - .layered-image, [class*="layered-image--"] { - margin-inline: calc( -1 * var(--global-space--bootstrap-gap) ); - } -} -@media (max-width: 767px) { - /* To hide background images when pattern flows vertical with content */ - :is(.layered-image, [class*="layered-image--"]) > .align-center { - display: none; - } -} - - - -/* EDGE CASES */ - -/* For a no-modifier, layered image with a single, un-aligned image */ -.layered-image :not([class*="align-"]):only-child { - /* To negate .layered-image`'s alignment with

via `margin-top` */ - /* FAQ: Can NOT just undo parent because Firefox does not support `:has` */ - margin-top: calc( -1 * var(--h1-offset) ); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/elements/headings--cms.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/elements/headings--cms.css deleted file mode 100644 index 9933dd992..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/elements/headings--cms.css +++ /dev/null @@ -1,5 +0,0 @@ -/* Structure */ - -table + :is(h1, h2, h3, h4, h5, h6) { - margin-top: 2em; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/o-section.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/o-section.css deleted file mode 100644 index 4efba411c..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/o-section.css +++ /dev/null @@ -1,10 +0,0 @@ -/* So any section touching breadcrumbs has reduced top space */ -/* TODO: Consider for Core-CMS, not Core-Styles */ -nav.s-breadcrumbs + :is(.o-section, .section):not([class*="o-section--style-"], [class*="section--"]), -nav.s-breadcrumbs + .container > :is(.o-section, .section):not([class*="o-section--style-"], [class*="section--"]):first-child { - margin-top: var(--global-space--under-breadcrumbs); -} -nav.s-breadcrumbs + :is([class*="o-section--style-"], [class*="section--"]), -nav.s-breadcrumbs + .container > :is([class*="o-section--style-"], [class*="section--"]):first-child { - padding-top: var(--global-space--under-breadcrumbs); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/people-grid.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/people-grid.css deleted file mode 100644 index f0191ff94..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/objects/people-grid.css +++ /dev/null @@ -1,10 +0,0 @@ -/* An automatric grid layout intended for people headshots */ -/* FAQ: This pattern was nitially similar to `.o-grid--col-min-width` */ -/* TODO: Consider this pattern for Core-Styles */ -.people-grid { - --width: 192px; - - display: grid; - gap: var(--global-space--grid-gap); - grid-template-columns: repeat( auto-fill, minmax( var(--width), 1fr ) ); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-abbr-list.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-abbr-list.css deleted file mode 100644 index 1fd3fe119..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-abbr-list.css +++ /dev/null @@ -1,19 +0,0 @@ -/* ???: Where is this used?! */ - -.s-abbr-list ul, -.abbr-list ul { - padding-left: 0; /* overwrite browser */ - list-style-type: none; - font-weight: var(--medium); -} -.s-abbr-list li, -.abbr-list li { - margin-bottom: 2rem; -} -.s-abbr-list abbr, -.s-abbr-list span.abbr, -.abbr-list abbr, -.abbr-list span.abbr { - color: var(--global-color-secondary--normal); - font-weight: var(--bold); -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-breadcrumbs.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-breadcrumbs.css deleted file mode 100644 index cb9b12d64..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/trumps/s-breadcrumbs.css +++ /dev/null @@ -1,9 +0,0 @@ -/* To overwrite core-styles.base.css href-less link styles */ -/* TODO: Integrate into Core-CMS (not Core-Styles): - - …/css/src/imports/trumps/s-breadcrumbs.css - - …/js/modules/breadcrumbs.js -*/ -.s-breadcrumbs:is(nav) a:not([href]) { - opacity: 1; - color: unset; -} diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/tup-cms.for-tup-cms.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/tup-cms.for-tup-cms.css deleted file mode 100644 index 0c7eff986..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/tup-cms.for-tup-cms.css +++ /dev/null @@ -1,33 +0,0 @@ -/* Organize via ITCSS */ -/* SEE: https://confluence.tacc.utexas.edu/x/IAA9Cw */ - -/* SETTINGS */ -/* ... */ - -/* GENERICS */ -/* ... */ - -/* ELEMENTS */ -@import url("./for-tup-cms/elements/headings--cms.css") layer(project); - -/* OBJECTS */ -@import url("./for-tup-cms/objects/o-section.css") layer(project); -@import url("./for-tup-cms/objects/people-grid.css") layer(project); - -/* COMPONENTS */ -@import url("./for-tup-cms/components/agenda-table.css") layer(project); -@import url("./for-tup-cms/components/banner.css") layer(project); -@import url("./for-tup-cms/components/c-data-list.css") layer(project); -@import url("./for-tup-cms/components/c-footer.css") layer(project); -@import url("./for-tup-cms/components/c-news.css") layer(project); -@import url("./for-tup-cms/components/c-tag.css") layer(project); -@import url("./for-tup-cms/components/c-update.css") layer(project); -@import url("./for-tup-cms/components/c-widget.css") layer(project); -@import url("./for-tup-cms/components/content-block.css") layer(project); -@import url("./for-tup-cms/components/django-cms-forms.css") layer(project); -@import url("./for-tup-cms/components/django.cms.blog.app.page.css") layer(project); -@import url("./for-tup-cms/components/layered-image.css") layer(project); - -/* TRUMPS */ -@import url("./for-tup-cms/trumps/s-abbr-list.css") layer(project); -@import url("./for-tup-cms/trumps/s-breadcrumbs.css") layer(project); diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-color.svg b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-color.svg deleted file mode 100644 index 702ceceed..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-color.svg +++ /dev/null @@ -1,86 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years--cropped.svg b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years--cropped.svg deleted file mode 100644 index 7ef885704..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years--cropped.svg +++ /dev/null @@ -1,774 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years.svg b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years.svg deleted file mode 100644 index 4ae88eae6..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white-25years.svg +++ /dev/null @@ -1,263 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white.svg b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white.svg deleted file mode 100644 index ee96ecc56..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/img/org_logos/tacc-logo-white.svg +++ /dev/null @@ -1,17 +0,0 @@ - - - - - - - - - - - - - - - - - diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/js/modules/breadcrumbs.js b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/js/modules/breadcrumbs.js deleted file mode 100644 index aff1aadab..000000000 --- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/js/modules/breadcrumbs.js +++ /dev/null @@ -1,17 +0,0 @@ -/* TODO: Try to programmatically only perform if link is a redirect */ -/* TODO: Integrate into Core-CMS (not Core-Styles): - - …/css/src/imports/trumps/s-breadcrumbs.css - - …/js/modules/breadcrumbs.js -*/ -/** - * To "disable" top-level CMS menu nav links in breadcrumbs - * (because they all are always set to redirect to a child) - */ -const link = document.querySelector( - '.s-breadcrumbs:is(nav) li:nth-of-type(2) a' -); -const isAppropriatePage = window.location.pathname.search('/systems/') == -1; - -if (link && isAppropriatePage) { - link.removeAttribute('href'); -}