feat(app): add minimal RTL support (#40372)
Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com>
This commit is contained in:
opencode-agent[bot]
committed by
GitHub
GitHub
parent
5535f7d6d1
commit
5f29a82190
@@ -700,6 +700,7 @@ function ViewerShell(props: {
|
||||
<div
|
||||
data-component="file"
|
||||
data-mode={props.mode}
|
||||
dir="ltr"
|
||||
style={styleVariables}
|
||||
class="relative outline-none"
|
||||
classList={{
|
||||
|
||||
@@ -98,8 +98,8 @@
|
||||
ol {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 12px;
|
||||
margin-left: 0;
|
||||
padding-left: 32px;
|
||||
margin-inline-start: 0;
|
||||
padding-inline-start: 32px;
|
||||
list-style-position: outside;
|
||||
}
|
||||
|
||||
@@ -109,7 +109,7 @@
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
padding-left: 2.25rem;
|
||||
padding-inline-start: 2.25rem;
|
||||
}
|
||||
|
||||
li {
|
||||
@@ -131,7 +131,7 @@
|
||||
li > p > input[type="checkbox"] {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: -20px;
|
||||
inset-inline-start: -20px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -149,18 +149,18 @@
|
||||
li > ol {
|
||||
margin-top: 0.25rem;
|
||||
margin-bottom: 0.25rem;
|
||||
padding-left: 1rem; /* Minimal indent for nesting only */
|
||||
padding-inline-start: 1rem; /* Minimal indent for nesting only */
|
||||
}
|
||||
|
||||
li > ol {
|
||||
padding-left: 1.75rem;
|
||||
padding-inline-start: 1.75rem;
|
||||
}
|
||||
|
||||
/* Blockquotes */
|
||||
blockquote {
|
||||
border-left: 0.5px solid var(--v2-border-border-base);
|
||||
border-inline-start: 0.5px solid var(--v2-border-border-base);
|
||||
margin: 1rem 0;
|
||||
padding-left: 0.5rem;
|
||||
padding-inline-start: 0.5rem;
|
||||
color: var(--v2-text-text-muted);
|
||||
font-style: normal;
|
||||
}
|
||||
@@ -183,6 +183,8 @@
|
||||
|
||||
[data-component="markdown-code"] {
|
||||
position: relative;
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-component="markdown-code"][data-code-kind="shell"] .shiki {
|
||||
@@ -202,7 +204,7 @@
|
||||
[data-slot="markdown-copy-button"] {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
inset-inline-end: 4px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.15s ease;
|
||||
z-index: 1;
|
||||
@@ -237,6 +239,8 @@
|
||||
}
|
||||
|
||||
:not(pre) > code {
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
font-family: var(--font-family-mono);
|
||||
font-feature-settings: var(--font-family-mono--font-feature-settings);
|
||||
color: var(--v2-text-text-base);
|
||||
@@ -278,7 +282,7 @@
|
||||
/* Minimal borders for structure, matching TUI "lines" roughly but keeping it web-clean */
|
||||
border-bottom: 0.5px solid var(--v2-border-border-muted);
|
||||
padding: 12px;
|
||||
text-align: left;
|
||||
text-align: start;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
@@ -298,6 +302,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
[data-component="markdown"] > * {
|
||||
unicode-bidi: plaintext;
|
||||
}
|
||||
|
||||
body[data-new-layout] [data-component="markdown"] {
|
||||
[data-slot="markdown-copy-button"]::after {
|
||||
box-sizing: border-box;
|
||||
@@ -345,7 +353,7 @@ body:not([data-new-layout]) [data-component="markdown"] {
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid var(--border-weak-base);
|
||||
border-inline-start: 2px solid var(--border-weak-base);
|
||||
color: var(--text-weak);
|
||||
}
|
||||
|
||||
|
||||
@@ -542,6 +542,7 @@ export function Markdown(
|
||||
return (
|
||||
<div
|
||||
data-component="markdown"
|
||||
dir="auto"
|
||||
classList={{
|
||||
...local.classList,
|
||||
[local.class ?? ""]: !!local.class,
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
gap: 8px;
|
||||
width: fit-content;
|
||||
max-width: min(82%, 64ch);
|
||||
margin-left: auto;
|
||||
margin-inline-start: auto;
|
||||
}
|
||||
|
||||
[data-slot="user-message-attachment"] {
|
||||
@@ -127,7 +127,7 @@
|
||||
[data-slot="user-message-body"] {
|
||||
width: fit-content;
|
||||
max-width: min(82%, 64ch);
|
||||
margin-left: auto;
|
||||
margin-inline-start: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
@@ -138,6 +138,7 @@
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
overflow: hidden;
|
||||
unicode-bidi: plaintext;
|
||||
background: var(--v2-background-bg-layer-02);
|
||||
border: none;
|
||||
padding: 8px 12px;
|
||||
@@ -145,10 +146,14 @@
|
||||
|
||||
[data-highlight="file"] {
|
||||
color: var(--syntax-property);
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-highlight="agent"] {
|
||||
color: var(--syntax-type);
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
max-width: 100%;
|
||||
@@ -175,7 +180,7 @@
|
||||
|
||||
[data-slot="user-message-meta"] {
|
||||
user-select: none;
|
||||
text-align: right;
|
||||
text-align: end;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
@@ -197,7 +202,7 @@
|
||||
user-select: none;
|
||||
flex: 0 0 auto;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
text-align: end;
|
||||
}
|
||||
|
||||
&:hover [data-slot="user-message-copy-wrapper"],
|
||||
@@ -364,6 +369,8 @@
|
||||
}
|
||||
|
||||
[data-component="bash-output"] {
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
width: 100%;
|
||||
border: 0.5px solid var(--v2-border-border-base);
|
||||
border-radius: 6px;
|
||||
@@ -473,6 +480,8 @@
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-weight: var(--font-weight-regular);
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-slot="message-part-path"] {
|
||||
@@ -480,6 +489,8 @@
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
font-weight: var(--font-weight-regular);
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-slot="message-part-directory"] {
|
||||
@@ -1240,6 +1251,8 @@
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-slot="apply-patch-directory"] {
|
||||
|
||||
@@ -107,7 +107,7 @@ function ShellSubmessage(props: { text: string; animate?: boolean }) {
|
||||
})
|
||||
|
||||
return (
|
||||
<span data-component="shell-submessage">
|
||||
<span data-component="shell-submessage" dir="ltr">
|
||||
<span ref={widthRef} data-slot="shell-submessage-width" style={{ width: props.animate ? "0px" : undefined }}>
|
||||
<span data-slot="basic-tool-tool-subtitle">
|
||||
<span
|
||||
@@ -1331,7 +1331,11 @@ export function UserMessageDisplay(props: {
|
||||
}
|
||||
>
|
||||
<div data-slot="user-message-body">
|
||||
<div data-slot="user-message-text" data-comments={messageComments().length > 0 ? "true" : undefined}>
|
||||
<div
|
||||
data-slot="user-message-text"
|
||||
dir="auto"
|
||||
data-comments={messageComments().length > 0 ? "true" : undefined}
|
||||
>
|
||||
<HighlightedText text={text()} references={inlineFiles()} agents={agents()} />
|
||||
<Show when={messageComments().length > 0}>
|
||||
<UserMessageComments comments={messageComments()} bounded />
|
||||
@@ -2122,7 +2126,7 @@ ToolRegistry.register({
|
||||
</div>
|
||||
)}
|
||||
>
|
||||
<div data-component="bash-output">
|
||||
<div data-component="bash-output" dir="ltr">
|
||||
<div data-slot="bash-copy">
|
||||
<TooltipV2 value={copied() ? i18n.t("ui.message.copied") : i18n.t("ui.message.copy")} placement="top">
|
||||
<IconButtonV2
|
||||
|
||||
@@ -112,6 +112,8 @@
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-slot="session-review-directory"] {
|
||||
|
||||
@@ -169,6 +169,8 @@
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
|
||||
font-family: var(--font-family-sans);
|
||||
font-size: var(--font-size-small);
|
||||
|
||||
@@ -324,6 +324,8 @@
|
||||
gap: 6px;
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
[data-component="session-review-v2"] [data-slot="session-review-v2-file-diff"] {
|
||||
|
||||
Reference in New Issue
Block a user