Product Selector: Fix overflowing title (#415)

lamATnginx · web-flow · commit 8a9b7fb500c7 · 2025-10-01T12:22:35.000-07:00
diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
@@ -802,6 +802,9 @@ ol li:last-child {
 
         .product-selector__toggle-text {
           font-weight: 500;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
         }
 
         .product-selector__chevron {
diff --git a/layouts/partials/sidebar-v2.html b/layouts/partials/sidebar-v2.html
@@ -40,7 +40,7 @@
             <details class="product-selector__section">
                 <summary class="product-selector__toggle">
 
-                    <span class="product-selector__toggle-text">
+                    <span class="product-selector__toggle-text" title="{{ if $currentProductTitle }}{{ $currentProductTitle }}{{else}}Product Documentation{{end}}">
                         {{ if $currentProductTitle }}
                             {{ $currentProductTitle }}
                         {{ else }}

Original file line number	Diff line number	Diff line change
`@@ -802,6 +802,9 @@ ol li:last-child {`
`802`	`802`
`803`	`803`	`.product-selector__toggle-text {`
`804`	`804`	`font-weight: 500;`
	`805`	`+ overflow: hidden;`
	`806`	`+ text-overflow: ellipsis;`
	`807`	`+ white-space: nowrap;`
`805`	`808`	`}`
`806`	`809`
`807`	`810`	`.product-selector__chevron {`