docs: share fix diff bugs

packages/web/src/components/share/content-diff.module.css

@@ -23,6 +23,20 @@
     grid-template-columns: 1fr 1fr;
     align-items: stretch;
 
+    &:first-child {
+      [data-slot="before"],
+      [data-slot="after"] {
+        padding-top: 0.25rem;
+      }
+    }
+
+    &:last-child {
+      [data-slot="before"],
+      [data-slot="after"] {
+        padding-bottom: 0.25rem;
+      }
+    }
+
     [data-slot="before"],
     [data-slot="after"] {
       position: relative;
@@ -75,46 +89,16 @@
     }
   }
 
-  /* .diff > .row:first-child [data-section="cell"]:first-child { */
-  /*   padding-top: 0.5rem; */
-  /* } */
-  /**/
-  /* .diff > .row:last-child [data-section="cell"]:last-child { */
-  /*   padding-bottom: 0.5rem; */
-  /* } */
-  /**/
-  /* [data-section="cell"] { */
-  /*   position: relative; */
-  /*   flex: 1; */
-  /*   display: flex; */
-  /*   flex-direction: column; */
-  /**/
-  /*   width: 100%; */
-  /*   padding: 0.1875rem 0.5rem 0.1875rem 2.2ch; */
-  /*   margin: 0; */
-  /**/
-  /*   &[data-display-mobile="true"] { */
-  /*     display: none; */
-  /*   } */
-  /**/
-  /*   pre { */
-  /*     --shiki-dark-bg: var(--sl-color-bg-surface) !important; */
-  /*     background-color: var(--sl-color-bg-surface) !important; */
-  /**/
-  /*     white-space: pre-wrap; */
-  /*     word-break: break-word; */
-  /**/
-  /*     code > span:empty::before { */
-  /*       content: "\00a0"; */
-  /*       white-space: pre; */
-  /*       display: inline-block; */
-  /*       width: 0; */
-  /*     } */
-  /*   } */
-  /* } */
-
   [data-component="mobile"] {
 
+    & > [data-component="diff-block"]:first-child > div {
+      padding-top: 0.25rem;
+    }
+
+    & > [data-component="diff-block"]:last-child > div {
+      padding-bottom: 0.25rem;
+    }
+
     & > [data-component="diff-block"] > div {
       padding: 0 1rem 0 2.2ch;
 

packages/web/src/components/share/content-diff.tsx

@@ -1,5 +1,5 @@
-import { type Component, createMemo } from "solid-js"
 import { parsePatch } from "diff"
+import { createMemo } from "solid-js"
 import { ContentCode } from "./content-code"
 import styles from "./content-diff.module.css"
 
@@ -90,8 +90,8 @@ export function ContentDiff(props: Props) {
               i++
             } else if (prefix === " ") {
               diffRows.push({
-                left: content,
-                right: content,
+                left: content === "" ? " " : content,
+                right: content === "" ? " " : content,
                 type: "unchanged",
               })
               i++

packages/web/src/components/share/part.module.css

@@ -245,13 +245,15 @@
     &[data-tool="edit"] {
       [data-component="tool-result"] {
         max-width: var(--lg-tool-width);
+        align-items: stretch;
+        width: 100%;
       }
     }
     &[data-tool="task"] {
       [data-component="tool-input"] {
         font-size: 0.75rem;
         line-height: 1.5;
-        max-width: var(--sm-tool-width);
+        max-width: var(--md-tool-width);
         display: -webkit-box;
         -webkit-line-clamp: 3;
         -webkit-box-orient: vertical;