Update Hebrew RTL and translation patches
- translate-he.js: Add tab button translations (Sub-Goals, Projects, Issues etc. with counts), fix whitespace normalization for matching, add translateButtonLabels() for React tab buttons - rtl-override.css: Properties panel RTL fixes (row-reverse, text-align), timeline reverse order (newest first + comment box at top), truncation and panel width adjustments Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -739,3 +739,325 @@ html[dir="rtl"] [class*="arrow-left"] svg,
|
||||
html[dir="rtl"] [class*="arrow-right"] svg {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
COMMENT HEADER — agent name + date row RTL alignment
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] .flex.items-center.justify-between.mb-1 {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [href*="/agents/"] {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
ACTIVITY LOG — RTL alignment
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [id^="activity-"] {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id^="activity-"] .flex-1 {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id^="activity-"] .flex.items-start.gap-2\.5 {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
TABLES inside comments — RTL alignment
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] .paperclip-markdown table {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] .paperclip-markdown table th,
|
||||
html[dir="rtl"] .paperclip-markdown table td {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] .paperclip-markdown {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
GLOBAL RTL — all flex rows with gap should be RTL
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [id^="run-"],
|
||||
html[dir="rtl"] [id^="activity-"],
|
||||
html[dir="rtl"] [id^="comment-"] {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id^="run-"] .flex,
|
||||
html[dir="rtl"] [id^="activity-"] .flex,
|
||||
html[dir="rtl"] [id^="comment-"] .flex {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id^="run-"] .flex.items-center {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id^="run-"] .flex.items-center.gap-2\.5 {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
html[dir="rtl"] .min-w-0.flex-1 {
|
||||
text-align: right;
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* Inner flex rows inside run/activity items — text flows RTL */
|
||||
html[dir="rtl"] .min-w-0.flex-1 > .flex {
|
||||
direction: rtl;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
/* The outer row: avatar on right, content on left */
|
||||
html[dir="rtl"] .flex.items-center.gap-2\.5.py-1\.5 {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* Same for items-start variant (activity log) */
|
||||
html[dir="rtl"] .flex.items-start.gap-2\.5.py-1\.5 {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
ACTIVITY TAB — global RTL for all activity content
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [id*="-content-activity"] {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id*="-content-activity"] .flex {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id*="-content-activity"] .flex.items-center,
|
||||
html[dir="rtl"] [id*="-content-activity"] .flex.items-start {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [id*="-content-activity"] .min-w-0 {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
PROPERTIES PANEL — global RTL
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [data-slot="sheet-content"],
|
||||
html[dir="rtl"] [role="dialog"] {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="sheet-content"] .flex,
|
||||
html[dir="rtl"] [role="dialog"] .flex {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="sheet-content"] label,
|
||||
html[dir="rtl"] [role="dialog"] label {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
GLOBAL CATCH-ALL — any remaining LTR flex containers in main content
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] main {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] main .flex.items-center {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] main .flex.items-start {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] main .min-w-0 {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] main .space-y-1\.5,
|
||||
html[dir="rtl"] main .space-y-2,
|
||||
html[dir="rtl"] main .space-y-3,
|
||||
html[dir="rtl"] main .space-y-4 {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
PROPERTIES SIDEBAR — the p-4 container with property rows
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] .p-4 .space-y-4,
|
||||
html[dir="rtl"] .p-4 .space-y-1 {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Property row: label (w-20) on right, value on left */
|
||||
html[dir="rtl"] .p-4 .flex.items-center.gap-3.py-1\.5 {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* The label span */
|
||||
html[dir="rtl"] .p-4 .shrink-0.w-20 {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
BREADCRUMB — RTL direction + flip chevron separator
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [data-slot="breadcrumb"] {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="breadcrumb-list"] {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="breadcrumb-separator"] svg {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* Top header bar */
|
||||
html[dir="rtl"] .border-b.border-border .flex.items-center {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
FILTER BAR — the "For [assignee] in [project]" row
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] .overflow-x-auto .inline-flex.items-center.gap-2 {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
PLUGIN PAGE + CARDS — RTL for all card content
|
||||
-------------------------------------------------------------------------- */
|
||||
html[dir="rtl"] [data-slot="tabs"][dir="ltr"] {
|
||||
direction: rtl !important;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="card"],
|
||||
html[dir="rtl"] [data-slot="card-header"],
|
||||
html[dir="rtl"] [data-slot="card-content"],
|
||||
html[dir="rtl"] [data-slot="card-title"] {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="card-content"] .flex.justify-between {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="card-content"] .flex.items-center.justify-between {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="card-content"] .grid {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
html[dir="rtl"] [data-slot="card-description"] {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Status change row: reverse order so old→new reads RTL */
|
||||
html[dir="rtl"] .flex.flex-wrap.items-center.gap-2.text-sm {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
/* Flip the arrow in status change rows */
|
||||
html[dir="rtl"] .flex.flex-wrap.items-center.gap-2.text-sm .lucide-arrow-right {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
PROPERTIES PANEL (aside) - RTL fixes
|
||||
-------------------------------------------------------------------------- */
|
||||
|
||||
/* Fix truncation direction: show start of text, not end */
|
||||
html[dir="rtl"] aside .truncate {
|
||||
direction: rtl;
|
||||
text-align: right;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* Widen properties panel to fill the gap */
|
||||
html[dir="rtl"] aside.hidden.md\:flex {
|
||||
width: 460px !important;
|
||||
}
|
||||
html[dir="rtl"] aside .w-80 {
|
||||
width: 460px;
|
||||
min-width: 460px;
|
||||
}
|
||||
|
||||
/* Ensure property labels don't shrink too much */
|
||||
html[dir="rtl"] aside .shrink-0.w-20 {
|
||||
width: 5.5rem;
|
||||
}
|
||||
|
||||
/* Properties panel rows: reverse flex so label is on the right */
|
||||
html[dir="rtl"] aside .flex.items-center.gap-3.py-1\.5 {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* Property value containers: align right */
|
||||
html[dir="rtl"] aside .flex.items-center.gap-1\.5.min-w-0.flex-1 {
|
||||
flex-direction: row-reverse;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
/* Property buttons inside panel: reverse icon+text order */
|
||||
html[dir="rtl"] aside .flex.items-center.gap-1\.5.min-w-0.flex-1 button {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* Panel header */
|
||||
html[dir="rtl"] aside .flex.items-center.justify-between {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* Panel text alignment */
|
||||
html[dir="rtl"] aside .text-sm {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html[dir="rtl"] aside .text-xs.text-muted-foreground.shrink-0 {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
TIMELINE + COMMENT BOX - comment box at top, newest first
|
||||
-------------------------------------------------------------------------- */
|
||||
|
||||
/* The tab content container that holds timeline + comment box: reverse order */
|
||||
html[dir="rtl"] [role="tabpanel"][id*="content-comments"] > .space-y-4 {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
/* Also target the parent of timeline + comment box */
|
||||
html[dir="rtl"] main .space-y-6 > .space-y-4:last-child {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
/* Reverse timeline items so newest appears first */
|
||||
html[dir="rtl"] main .space-y-4 > .space-y-4 {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user