@haklex/rich-compose 0.51.0 → 0.52.0

package/dist/litexml-html-preview-client.css

@@ -1554,13 +1554,13 @@
   color: var(--rc-text);
 }
 .qy3solb {
-  counter-reset: shiki-line 0;
+  counter-reset: code-line 0;
 }
 .qy3solb .line {
-  counter-increment: shiki-line 1;
+  counter-increment: code-line 1;
 }
 .qy3solb .line::before {
-  content: counter(shiki-line);
+  content: counter(code-line);
   color: transparent;
   text-align: right;
   box-sizing: content-box;
@@ -1569,9 +1569,19 @@
   position: sticky;
   left: 0;
 }
+.qy3solc code {
+  min-width: 100%;
+  width: max-content;
+}
+.qy3sol0 .qy3solc .line {
+  padding-left: 0;
+}
 .qy3solc .line::before {
   color: var(--rc-text-quaternary);
+  padding-left: 16px;
   padding-right: 16px;
+  background-color: var(--rc-code-bg);
+  z-index: 1;
 }
 .qy3sol0 pre {
   margin: 0 !important;
@@ -1586,15 +1596,12 @@
   font-family: var(--rc-font-mono) !important;
   line-height: inherit;
 }
-.qy3sol0 .shiki, .qy3sol0 code, .qy3sol0 pre {
+.qy3sol0 .highlights, .qy3sol0 code, .qy3sol0 pre {
   background: transparent !important;
   line-height: inherit;
 }
-[data-theme='dark'] .qy3sol0 .shiki-themes, [data-theme='dark'] .qy3sol0 .shiki-themes span {
-  color: var(--shiki-dark) !important;
-  font-style: var(--shiki-dark-font-style) !important;
-  font-weight: var(--shiki-dark-font-weight) !important;
-  text-decoration: var(--shiki-dark-text-decoration) !important;
+[data-theme='dark'] .qy3sol0 .highlights-themes, [data-theme='dark'] .qy3sol0 .highlights-themes span {
+  color: var(--hls-dark) !important;
 }
 .qy3sol0 .line {
   display: block;
@@ -5879,11 +5886,8 @@ figure.rich-image[data-display="fixed-height"] img {
 ._1v9rg4be code {
   font-family: inherit;
 }
-[data-theme='dark'] ._1v9rg4be .shiki-themes, [data-theme='dark'] ._1v9rg4be .shiki-themes span {
-  color: var(--shiki-dark) !important;
-  font-style: var(--shiki-dark-font-style) !important;
-  font-weight: var(--shiki-dark-font-weight) !important;
-  text-decoration: var(--shiki-dark-text-decoration) !important;
+[data-theme='dark'] ._1v9rg4be .highlights-themes, [data-theme='dark'] ._1v9rg4be .highlights-themes span {
+  color: var(--hls-dark) !important;
 }
 ._1v9rg4bf {
   display: inline-flex;
@@ -6316,7 +6320,7 @@ figure.rich-image[data-display="fixed-height"] img {
 }
 .pa8uv2b .cm-gutters {
   border-right: none;
-  background-color: transparent;
+  background-color: var(--rc-code-bg);
   padding-left: 16px;
 }
 .pa8uv2b .cm-lineNumbers .cm-gutterElement {
@@ -6325,13 +6329,6 @@ figure.rich-image[data-display="fixed-height"] img {
   text-align: right;
   color: var(--rc-text-quaternary) !important;
 }
-.pa8uv2b > .shikicode.output {
-  position: static !important;
-  inset: auto !important;
-}
-.pa8uv2c > textarea.shikicode {
-  display: none;
-}
 .pa8uv2d {
   position: absolute;
   left: 0;
@@ -6360,13 +6357,6 @@ figure.rich-image[data-display="fixed-height"] img {
 .pa8uv2e:hover {
   color: var(--rc-text);
 }
-.pa8uv20 .shikicode.input, .pa8uv20 .shikicode.output, .pa8uv20 .shikicode.output code, .pa8uv20 .shikicode.output .line, .pa8uv20 .shikicode.output .line span {
-  font-variant-ligatures: none;
-  font-kerning: none;
-}
-.pa8uv20 .shikicode.input, .pa8uv20 .shikicode.output {
-  font-family: var(--rc-font-mono) !important;
-}
 .pa8uv2b pre, .pa8uv2b code, .pa8uv2b .line, .pa8uv2b .line span {
   font-family: var(--rc-font-mono) !important;
 }
@@ -6386,34 +6376,16 @@ figure.rich-image[data-display="fixed-height"] img {
   flex-direction: column;
   font-family: var(--rc-font-mono) !important;
 }
-.pa8uv20 .shiki, .pa8uv20 code, .pa8uv20 pre {
+.pa8uv20 .highlights, .pa8uv20 code, .pa8uv20 pre {
   background: transparent !important;
 }
-[data-theme='dark'] .pa8uv20 .shiki-themes, [data-theme='dark'] .pa8uv20 .shiki-themes span {
-  color: var(--shiki-dark) !important;
-  font-style: var(--shiki-dark-font-style) !important;
-  font-weight: var(--shiki-dark-font-weight) !important;
-  text-decoration: var(--shiki-dark-text-decoration) !important;
-}
-.pa8uv2b:has(.shikicode.input.line-numbers) .shikicode.output .line::before {
-  background-color: transparent !important;
-  color: var(--rc-text-quaternary) !important;
-  min-width: calc(var(--rc-ln-digits, 2) * 1ch);
-  padding-right: 16px;
-}
-.pa8uv2b:not(:has(.shikicode.input.line-numbers)) .shikicode.output .line::before {
-  display: none;
+[data-theme='dark'] .pa8uv20 .highlights-themes, [data-theme='dark'] .pa8uv20 .highlights-themes span {
+  color: var(--hls-dark) !important;
 }
 .pa8uv20 .line {
   display: block;
   padding: 0 16px;
 }
-.pa8uv20 .shikicode.input.line-numbers {
-  padding-left: calc(2ch + 32px);
-}
-.pa8uv20 .shikicode.input:not(.line-numbers) {
-  padding-left: 16px;
-}
 .pa8uv20 .line > span:last-child {
   margin-right: 16px;
 }
@@ -6463,13 +6435,13 @@ figure.rich-image[data-display="fixed-height"] img {
   color: #ef4444;
 }
 .pa8uv2f {
-  counter-reset: shiki-line 0;
+  counter-reset: code-line 0;
 }
 .pa8uv2f .line {
-  counter-increment: shiki-line 1;
+  counter-increment: code-line 1;
 }
 .pa8uv2f .line::before {
-  content: counter(shiki-line);
+  content: counter(code-line);
   color: transparent;
   text-align: right;
   box-sizing: content-box;
@@ -6478,10 +6450,20 @@ figure.rich-image[data-display="fixed-height"] img {
   position: sticky;
   left: 0;
 }
+.pa8uv2g code {
+  min-width: 100%;
+  width: max-content;
+}
+.pa8uv20 .pa8uv2g .line {
+  padding-left: 0;
+}
 .pa8uv2g .line::before {
   color: var(--rc-text-quaternary);
   min-width: calc(var(--rc-ln-digits, 2) * 1ch);
+  padding-left: 16px;
   padding-right: 16px;
+  background-color: var(--rc-code-bg);
+  z-index: 1;
 }
 .pa8uv29 pre::-webkit-scrollbar-track {
   margin-left: 1rem;
@@ -6903,7 +6885,7 @@ pre.rich-code-block, code.rich-code-block {
   user-select: none;
 }
 ._1kngc4rc {
-  counter-reset: shiki-line var(--start-line, 0);
+  counter-reset: code-line var(--start-line, 0);
 }
 ._1kngc4rc pre {
   margin: 0;
@@ -6924,8 +6906,8 @@ pre.rich-code-block, code.rich-code-block {
   line-height: 1.5;
 }
 ._1kngc4rc .line::before {
-  content: counter(shiki-line);
-  counter-increment: shiki-line;
+  content: counter(code-line);
+  counter-increment: code-line;
   flex-shrink: 0;
   width: 4ch;
   text-align: right;