From 983efae815130f77ebdded15c4584e062e1f5eab Mon Sep 17 00:00:00 2001
From: Tyler Hoang <tyler@tylerhoang.xyz>
Date: Thu, 11 Jun 2026 01:07:57 -0700
Subject: fix: align option chain headers

---
 frontend/components/prism/options/OptionsChain.tsx | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

(limited to 'frontend/components/prism')

diff --git a/frontend/components/prism/options/OptionsChain.tsx b/frontend/components/prism/options/OptionsChain.tsx
index be6b518..828ec9c 100644
--- a/frontend/components/prism/options/OptionsChain.tsx
+++ b/frontend/components/prism/options/OptionsChain.tsx
@@ -66,11 +66,19 @@ export function ChainTable({ rows, atmStrike, selectedK, type, onPick, compact =
         <table className="opt-chain">
           <thead>
             <tr>
-              {!compact && <th className="group side-c" colSpan={2} style={{ textAlign: 'center' }}>— calls —</th>}
-              {compact && <th className="group side-c" colSpan={3} style={{ textAlign: 'center' }}>— calls —</th>}
-              <th className="group k" style={{ textAlign: 'center' }}>strike</th>
-              {!compact && <th className="group side-p" colSpan={2} style={{ textAlign: 'center' }}>— puts —</th>}
-              {compact && <th className="group side-p" colSpan={3} style={{ textAlign: 'center' }}>— puts —</th>}
+              {compact ? (
+                <>
+                  <th className="group side-c" colSpan={3}>calls</th>
+                  <th className="group k" colSpan={1}>strike</th>
+                  <th className="group side-p" colSpan={3}>puts</th>
+                </>
+              ) : (
+                <>
+                  <th className="group side-c" colSpan={4}>calls</th>
+                  <th className="group k" colSpan={1}>strike</th>
+                  <th className="group side-p" colSpan={4}>puts</th>
+                </>
+              )}
             </tr>
             {!compact ? (
               <tr>
-- 
cgit v1.3-2-g0d8e