fix(theme): avoid selection gaps at line ends in code block

[KazariEX]

Summary

before	after

Related Issue

no response

Checklist

• Tests updated (or not required).
• Documentation updated (or not required).

[Copilot]

Pull request overview

Adjusts Shiki code block styling to eliminate text-selection “gaps” at the end of lines by moving horizontal padding off per-line spans and onto the container.

Changes:

• Removed horizontal padding from .shiki span.line (per-line span elements).
• Added padding to the pre inside CodeBlock and adjusted code sizing rules accordingly.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File	Description
packages/core/src/theme/styles/shiki.scss	Removes per-line padding on Shiki line spans (affects all .shiki usages).
packages/core/src/theme/components/CodeBlock/index.scss	Moves padding onto pre within the CodeBlock container and updates code layout rules.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[SoonIter]

pending by two issues, it seems a breaking change for all the transformers

1. twoslash

2. transformerNotationDiff

Before

.highlighted {
   background-color: rgba(59, 130, 246, 0.1);
    box-shadow: inset 2px 0 0 0 rgb(59, 130, 246);
 }

after

This makes the definition of the transformer's CSS more complicated, and almost all related transformers will become more complicated than before. I'm not sure if it's worth it, but it's the behavior in vitepress by the Shiki....

.highlighted {
    width: calc(100% + 2.5rem);
    margin: 0 -1.25rem;
    padding: 0 1.25rem;
	background-color: rgba(59, 130, 246, 0.1);
    box-shadow: inset 2px 0 0 0 rgb(59, 130, 246);
 }

[SoonIter]

pending

[KazariEX]

We can add this selector to elements that occupy an entire row:

:where(.highlighted, ...) {
    width: calc(100% + 2.5rem);
    margin: 0 -1.25rem;
    padding: 0 1.25rem;
}