Merge branch 'main' into chore/do-not-inherit-blog-category-order

apps/tup-cms/src/taccsite_cms/templates/snippets/css-banner-tacc.html

@@ -1,3 +1,6 @@
+<template id="css-banner-tacc--notes">
+<!-- TO DYNAMICALL REDUCE HEIGHT OF BANNER: NO NEED to edit this stylesheet. Edit banner "Picture / Image" on CMS. Set `style="height: 60vh; max-height: 550px; min-height: 230px;"`. To use static height, set `style="height: 550px"` instead. -->
+</template>
 <style id="css-banner-tacc">
 /* To limit width of title on wide screens */
 @media (width >= 992px) {
@@ -23,7 +26,7 @@
     left: 0; top: 0; bottom: 0; right: 0;
     background-color: var(--global-color-primary--x-light);
 }
-.banner-cell--major a:hover .u-highlight {
+.banner-cell--major a:hover :is(.u-highlight, .highlight) {
     background-color: var(--global-color-accent--normal);
 }
 

apps/tup-cms/src/taccsite_cms/templates/snippets/css-global-a11y.html

@@ -0,0 +1,19 @@
+<style id="css-global-a11y">
+/* 1. To make mobile menu button stand out */
+.navbar-dark .navbar-toggler {
+    border-color: var(--global-color-primary--normal);
+}
+
+/* 2. To make keyboard focus stand out on header */
+/*
+.nav-link:focus-visible,
+#header-logo:focus-visible,
+.navbar-dark .navbar-toggler:focus-visible {
+*/
+#s-header :focus,
+#header-branding a:focus,
+.s-search-bar::part(input):focus,
+.s-search-bar::part(button):focus {
+    outline-color: var(--global-color-primary--xx-light);
+}
+</style>

apps/tup-cms/src/taccsite_cms/templates/snippets/js-prevent-ugly-urls.html

@@ -0,0 +1,23 @@
+<script type="module" id="js-prevent-ugly-urls-tup-715">
+    const links = document.querySelectorAll('body > :is(header, main, footer) a[target="_blank"]');
+
+    /* HACK: To revert URL of links that Google changes on hover */
+    /* FAQ: Google Analytics settings interpret subdomain links as URLs to adjust so it can track navigation */
+    [ ...links ].forEach( function restoreLinkHrefChangedOnHover(link) {
+        const isTACC = link.host.includes('tacc.utexas.edu');
+
+        if ( isTACC ) {
+            let currentHrefVal = link.getAttribute('href');
+
+            link.setAttribute('data-original-href', currentHrefVal );
+            link.addEventListener('click', () => {
+                const originalHrefVal = link.getAttribute('data-original-href');
+
+                currentHrefVal = link.getAttribute('href');
+                if ( currentHrefVal !== originalHrefVal ) {
+                    link.setAttribute('href', originalHrefVal );
+                }
+            });
+        }
+    });
+</script>