diff --git a/src/components/asset-panel/asset-panel.css b/src/components/asset-panel/asset-panel.css index 9a999057b57a29f12b8e288365605a814b5864f1..bfd578909fdf2a8efd826bba4899fd7e8240a4bd 100644 --- a/src/components/asset-panel/asset-panel.css +++ b/src/components/asset-panel/asset-panel.css @@ -5,16 +5,32 @@ display: flex; flex-grow: 1; border: 1px solid $ui-black-transparent; - border-top-right-radius: $space; background: white; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.85rem; } +[dir="ltr"] .wrapper { + border-top-right-radius: $space; + border-bottom-right-radius: $space; +} + +[dir="rtl"] .wrapper { + border-top-left-radius: $space; + border-bottom-left-radius: $space; +} + .detail-area { display: flex; flex-grow: 1; flex-shrink: 1; - border-left: 1px solid $ui-black-transparent; overflow-y: auto; } + +[dir="ltr"] .detail-area { + border-left: 1px solid $ui-black-transparent; +} + +[dir="rtl"] .detail-area { + border-right: 1px solid $ui-black-transparent; +} diff --git a/src/components/backpack/backpack.css b/src/components/backpack/backpack.css index 9143844d0973b35b457092b66132ed6135256d07..33585ca90de66225f89228aa5aa9a35f6798adca 100644 --- a/src/components/backpack/backpack.css +++ b/src/components/backpack/backpack.css @@ -9,7 +9,6 @@ .backpack-header { margin-top: 0.5rem; border: 1px solid $ui-black-transparent; - border-top-right-radius: $space; background: $ui-white; padding: 0.25rem; text-align: center; @@ -20,6 +19,14 @@ user-select: none; } +[dir="ltr"] .backpack-header { + border-top-right-radius: $space; +} + +[dir="rtl"] .backpack-header { + border-top-left-radius: $space; +} + .backpack-list { position: relative; display: flex; diff --git a/src/components/blocks/blocks.css b/src/components/blocks/blocks.css index e02486ce0fe376d091090b4355d2a0febc3c8331..3d87405893c9268041744d1d5d2aecfa4bd4afc6 100644 --- a/src/components/blocks/blocks.css +++ b/src/components/blocks/blocks.css @@ -12,6 +12,13 @@ border-bottom-right-radius: $space; } +[dir="rtl"] .blocks :global(.injectionDiv) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-top-left-radius: $space; + border-bottom-left-radius: $space; +} + .blocks :global(.blocklyMainBackground) { stroke: none; } @@ -31,6 +38,11 @@ -ms-overflow-style: none; } +[dir="rtl"] .blocks :global(.blocklyToolboxDiv) { + border-right: none; + border-left: 1px solid $ui-black-transparent; +} + .blocks :global(.blocklyToolboxDiv::-webkit-scrollbar) { display: none; } @@ -40,6 +52,12 @@ box-sizing: content-box; } +[dir="rtl"] .blocks :global(.blocklyFlyout) { + border-right: none; + border-left: 1px solid $ui-black-transparent; +} + + .blocks :global(.blocklyBlockDragSurface) { /* Fix an issue where the drag surface was preventing hover events for sharing blocks. diff --git a/src/components/gui/gui.css b/src/components/gui/gui.css index 46cf41d2b79baf011980c08bef45b07eac1e9611..757653e9ac32d18507cf2f8d2d433a2ecf8562e8 100644 --- a/src/components/gui/gui.css +++ b/src/components/gui/gui.css @@ -130,6 +130,10 @@ [dir="rtl"] .tab img { margin-left: 0.125rem; +} + +/* only mirror blocks tab icon */ +[dir="rtl"] .tab:nth-of-type(1) img { transform: scaleX(-1); } diff --git a/src/components/library-item/library-item.css b/src/components/library-item/library-item.css index 3258b4a7bd16162f239d73990a26df77894f2ea0..fd7217c6744937c184d5e2115a4dcdc284b0a7a9 100644 --- a/src/components/library-item/library-item.css +++ b/src/components/library-item/library-item.css @@ -99,7 +99,6 @@ .coming-soon-text { position: absolute; - transform: translate(calc(2 * $space), calc(2 * $space)); background-color: $data-primary; border-radius: 1rem; box-shadow: 0 0 .5rem hsla(0, 0%, 0%, .25); @@ -108,3 +107,11 @@ font-weight: bold; color: $ui-white; } + +[dir="ltr"] .coming-soon-text { + transform: translate(calc(2 * $space), calc(2 * $space)); +} + +[dir="rtl"] .coming-soon-text { + transform: translate(calc(-2 * $space), calc(2 * $space)); +} diff --git a/src/components/prompt/prompt.css b/src/components/prompt/prompt.css index ae523e188013ad9c79433ed908f4623665551a50..911271f1997f4d2e37b5a12f8a5b18eda0fea582 100644 --- a/src/components/prompt/prompt.css +++ b/src/components/prompt/prompt.css @@ -88,8 +88,15 @@ .more-options-icon { width: .75rem; height: .75rem; - margin-left: .5rem; vertical-align: middle; padding-bottom: .2rem; opacity: .5; } + +[dir="ltr"] .more-options-icon { + margin-left: .5rem; +} + +[dir="rtl"] .more-options-icon { + margin-right: .5rem; +} diff --git a/src/components/stage-header/stage-header.css b/src/components/stage-header/stage-header.css index dd2dc2c65ca642338358d681f572a1b04796fd14..3e6f59c75ac245d74441f709acfdbb1689017ca2 100644 --- a/src/components/stage-header/stage-header.css +++ b/src/components/stage-header/stage-header.css @@ -59,6 +59,10 @@ height: 100%; } +[dir="rtl"] .stage-button-icon { + transform: scaleX(-1); +} + [dir="ltr"] .stage-button-first { border-top-right-radius: 0; border-bottom-right-radius: 0; diff --git a/src/components/target-pane/target-pane.css b/src/components/target-pane/target-pane.css index 404283d19fd8c77bafc1e9f0b307628168d1cfc4..07b07cb161a62ebd9f61f1a158115a80076a3471 100644 --- a/src/components/target-pane/target-pane.css +++ b/src/components/target-pane/target-pane.css @@ -11,5 +11,12 @@ display: flex; flex-basis: 72px; flex-shrink: 0; +} + +[dir="ltr"] .stage-selector-wrapper { margin-left: calc($space / 2); } + +[dir="rtl"] .stage-selector-wrapper { + margin-right: calc($space / 2); +}