diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs index d5170a8b5..570b25faf 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs @@ -616,9 +616,10 @@ [:div {:class (stl/css :name-wrapper)} [:div {:class (stl/css :component-name)} - (if multi - (tr "settings.multiple") - (cfh/last-path shape-name))] + [:span {:class (stl/css :component-name-inside)} + (if multi + (tr "settings.multiple") + (cfh/last-path shape-name))]] (when (and can-swap? (not multi)) [:div {:class (stl/css :component-parent-name)} diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss index c36756069..d024187a7 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss @@ -56,7 +56,6 @@ padding-right: 0.5rem; .component-name-wrapper { width: 100%; - border-radius: $br-8; } } @@ -93,6 +92,7 @@ min-height: $s-32; padding: $s-8 0 $s-8 $s-2; border-radius: $br-8 0 0 $br-8; + overflow: hidden; } .component-name { @@ -103,6 +103,11 @@ min-height: $s-16; } +.component-name-inside { + direction: ltr; + unicode-bidi: bidi-override; +} + .component-parent-name { @include bodySmallTypography; @include textEllipsis;