diff --git a/theme/boost/scss/moodle/tool_usertours.scss b/theme/boost/scss/moodle/tool_usertours.scss index 79dee6c54fc..d7e67f3404d 100644 --- a/theme/boost/scss/moodle/tool_usertours.scss +++ b/theme/boost/scss/moodle/tool_usertours.scss @@ -103,6 +103,26 @@ span[data-flexitour="container"] { } } } + + // RTL specific styles. + .dir-rtl & { + &[x-placement^="right"] { + margin-left: $popover-arrow-width; + div[data-role="arrow"] { + transform: rotate(180deg); + left: -$popover-arrow-width; + right: auto; + } + } + &[x-placement^="left"] { + margin-right: $popover-arrow-width; + div[data-role="arrow"] { + transform: rotate(180deg); + left: auto; + right: -$popover-arrow-width; + } + } + } } // Hack the bone! Hack the bone! diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index 8dad6689223..94a514b7ca2 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -35984,6 +35984,22 @@ span[data-flexitour=container][x-placement=right] div[data-role=arrow]:after, sp border-left-width: 0; border-right-color: #fff; } +.dir-rtl span[data-flexitour=container][x-placement^=right] { + margin-left: 1rem; +} +.dir-rtl span[data-flexitour=container][x-placement^=right] div[data-role=arrow] { + transform: rotate(180deg); + left: -1rem; + right: auto; +} +.dir-rtl span[data-flexitour=container][x-placement^=left] { + margin-right: 1rem; +} +.dir-rtl span[data-flexitour=container][x-placement^=left] div[data-role=arrow] { + transform: rotate(180deg); + left: auto; + right: -1rem; +} [data-region=drawer] [data-flexitour=container] { /*rtl:ignore*/ diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index 833b51c4eca..45745a7adf2 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -35918,6 +35918,22 @@ span[data-flexitour=container][x-placement=right] div[data-role=arrow]:after, sp border-left-width: 0; border-right-color: #fff; } +.dir-rtl span[data-flexitour=container][x-placement^=right] { + margin-left: 1rem; +} +.dir-rtl span[data-flexitour=container][x-placement^=right] div[data-role=arrow] { + transform: rotate(180deg); + left: -1rem; + right: auto; +} +.dir-rtl span[data-flexitour=container][x-placement^=left] { + margin-right: 1rem; +} +.dir-rtl span[data-flexitour=container][x-placement^=left] div[data-role=arrow] { + transform: rotate(180deg); + left: auto; + right: -1rem; +} [data-region=drawer] [data-flexitour=container] { /*rtl:ignore*/