From 50e27b992fd05d4994f2661b956437d6c60ca424 Mon Sep 17 00:00:00 2001
From: Vinta Chen <vinta.chen@gmail.com>
Date: Sun, 22 Mar 2026 16:14:11 +0800
Subject: [PATCH] perf(css): add CSS containment to results section and detail
 panel

Apply contain: layout style to .results-section and
contain: layout style paint to the detail panel element to reduce
browser layout recalculation scope during search interactions.

Co-Authored-By: Claude <noreply@anthropic.com>
---
 website/static/style.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/website/static/style.css b/website/static/style.css
index 17cd5fc6..0e477515 100644
--- a/website/static/style.css
+++ b/website/static/style.css
@@ -413,6 +413,7 @@ kbd {
 
 .results-section {
   padding-block: clamp(2.5rem, 6vw, 4.5rem) 0;
+  contain: layout style;
 }
 
 .results-intro {
@@ -746,6 +747,7 @@ th[data-sort].sort-asc::after {
   text-wrap: pretty;
   overflow-wrap: break-word;
   word-break: break-word;
+  contain: layout style paint;
   animation: expand-in 220ms cubic-bezier(0.22, 1, 0.36, 1);
 }