fix: code block copy icon, light theme bg, horizontal scroll

- Use .icon-copy/.icon-check classes on <i> tags so Feather preserves them on generated <svg>; fixes copy button not swapping to checkmark
- Add .chroma to light theme background override so #eff1f5 applies correctly
- Change .chroma overflow: hidden to overflow-x: auto to restore horizontal scrolling for long code lines

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

1 files changed, 12 insertions, 2 deletions

diff --git a/themes/danix-xyz-hacker/assets/css/chroma-custom.css b/themes/danix-xyz-hacker/assets/css/chroma-custom.css
index 11f4a4a..ef43ce2 100644
--- a/themes/danix-xyz-hacker/assets/css/chroma-custom.css
+++ b/themes/danix-xyz-hacker/assets/css/chroma-custom.css
@@ -98,7 +98,8 @@
   overflow-x: auto;
 }
 
-.code-body .highlight {
+.code-body .highlight,
+.code-body .highlight .chroma {
   margin: 0;
   border-radius: 0;
   border: none;
@@ -148,10 +149,18 @@
   background-color: var(--ctp-surface0);
 }
 
+.highlight .lntd:first-child pre {
+  padding: 0.875rem 0;
+}
+
 .highlight .lntd:last-child pre {
   padding: 0.875rem 1rem;
 }
 
+.highlight .chroma {
+  overflow-x: auto;
+}
+
 /* === Syntax token colors (dark theme default) === */
 
 .highlight {
@@ -332,7 +341,8 @@ html.theme-light .code-copy-btn:hover {
   background: rgba(76, 79, 105, 0.08);
 }
 
-html.theme-light .code-body .highlight {
+html.theme-light .code-body .highlight,
+html.theme-light .code-body .highlight .chroma {
   background-color: #eff1f5;
   color: #4c4f69;
 }