first commit

wp-content/themes/storefront/assets/js/woocommerce/extensions/brands.js

@@ -0,0 +1,46 @@
+/**
+ * brands.js
+ *
+ * Adds sticky functionality to the brands index.
+ */
+( function () {
+	// eslint-disable-next-line @wordpress/no-global-event-listener
+	document.addEventListener( 'DOMContentLoaded', function () {
+		const brandsAZ = document.getElementsByClassName( 'brands_index' );
+
+		if ( ! brandsAZ.length ) {
+			return;
+		}
+
+		const adminBar = document.body.classList.contains( 'admin-bar' )
+				? 32
+				: 0,
+			brandsContainerHeight = document.getElementById( 'brands_a_z' )
+				.scrollHeight,
+			brandsAZHeight = brandsAZ[ 0 ].scrollHeight + 40;
+
+		const stickyBrandsAZ = function () {
+			if (
+				window.innerWidth > 768 &&
+				brandsAZ[ 0 ].getBoundingClientRect().top < 0
+			) {
+				brandsAZ[ 0 ].style.paddingTop =
+					Math.min(
+						Math.abs( brandsAZ[ 0 ].getBoundingClientRect().top ) +
+							20 +
+							adminBar,
+						brandsContainerHeight - brandsAZHeight
+					) + 'px';
+			} else {
+				brandsAZ[ 0 ].style.paddingTop = 0;
+			}
+		};
+
+		stickyBrandsAZ();
+
+		// eslint-disable-next-line @wordpress/no-global-event-listener
+		window.addEventListener( 'scroll', function () {
+			stickyBrandsAZ();
+		} );
+	} );
+} )();

wp-content/themes/storefront/assets/js/woocommerce/extensions/brands.min.js

@@ -0,0 +1 @@
+document.addEventListener("DOMContentLoaded",function(){const n=document.getElementsByClassName("brands_index");if(n.length){const t=document.body.classList.contains("admin-bar")?32:0,e=document.getElementById("brands_a_z").scrollHeight,d=n[0].scrollHeight+40,o=function(){768<window.innerWidth&&n[0].getBoundingClientRect().top<0?n[0].style.paddingTop=Math.min(Math.abs(n[0].getBoundingClientRect().top)+20+t,e-d)+"px":n[0].style.paddingTop=0};o(),window.addEventListener("scroll",function(){o()})}});

wp-content/themes/storefront/assets/js/woocommerce/header-cart.js

@@ -0,0 +1,33 @@
+/**
+ * Makes the header cart content scrollable if the height of the dropdown exceeds the window height.
+ * Mouseover is used as items can be added to the cart via ajax and we'll need to recheck.
+ */
+( function () {
+	if (
+		document.body.classList.contains( 'woocommerce-cart' ) ||
+		document.body.classList.contains( 'woocommerce-checkout' ) ||
+		window.innerWidth < 768 ||
+		! document.getElementById( 'site-header-cart' )
+	) {
+		return;
+	}
+
+	// eslint-disable-next-line @wordpress/no-global-event-listener
+	window.addEventListener( 'load', function () {
+		const cart = document.querySelector( '.site-header-cart' );
+
+		cart.addEventListener( 'mouseover', function () {
+			const windowHeight = window.outerHeight,
+				cartBottomPos =
+					this.querySelector(
+						'.widget_shopping_cart_content'
+					).getBoundingClientRect().bottom + this.offsetHeight,
+				cartList = this.querySelector( '.cart_list' );
+
+			if ( cartBottomPos > windowHeight ) {
+				cartList.style.maxHeight = '15em';
+				cartList.style.overflowY = 'auto';
+			}
+		} );
+	} );
+} )();

wp-content/themes/storefront/assets/js/woocommerce/header-cart.min.js

@@ -0,0 +1 @@
+document.body.classList.contains("woocommerce-cart")||document.body.classList.contains("woocommerce-checkout")||window.innerWidth<768||!document.getElementById("site-header-cart")||window.addEventListener("load",function(){const e=document.querySelector(".site-header-cart");e.addEventListener("mouseover",function(){const e=window.outerHeight,t=this.querySelector(".widget_shopping_cart_content").getBoundingClientRect().bottom+this.offsetHeight,o=this.querySelector(".cart_list");e<t&&(o.style.maxHeight="15em",o.style.overflowY="auto")})});