mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-13 20:42:22 +02:00
Code Issues Projects Releases Wiki Activity

MDL-76457 theme_boost: Fix bootstrap popovers in RTL

Browse Source 
- Fix the arrow placement for bootstrap popovers in RTL mode.
- Remove unneded css parser workaround for popover arrows.
  After MDL-67386 was integrated those changes were not needed anymore.
This commit is contained in:
Mikel Martín 2023-11-10 11:52:26 +01:00
parent 8ad9114050
commit 559db765b3
4 changed files with 53 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
theme/boost/scss/moodle/bootstrap-rtl.scss vendored
View File

@ -40,4 +40,25 @@
right: auto;
}
}
.popover {
&.bs-popover-right,
&.bs-popover-auto[x-placement^="right"] {
margin-right: 0;
margin-left: $popover-arrow-height;
.arrow {
transform: rotate(180deg);
left: subtract(-$popover-arrow-height, $popover-border-width);
}
}
&.bs-popover-left,
&.bs-popover-auto[x-placement^="left"] {
margin-right: $popover-arrow-height;
margin-left: 0;
.arrow {
transform: rotate(180deg);
right: subtract(-$popover-arrow-height, $popover-border-width);
}
}
}
}

23
theme/boost/scss/moodle/undo.scss
View File

@ -139,29 +139,6 @@ body:not(.jsenabled) .langmenu:hover > .dropdown-menu,
}
}
}
/* Force positioning of popover arrows.
*
* The Css prefixer used in Moodle does not support complex calc statements used
* in Bootstrap 4 CSS. For example:
* calc((0.5rem + 1px) * -1); is stripped out by lib/php-css-parser/Parser.php.
* See MDL-61879. For now the arrow positions of popovers are fixed until this is resolved.
*/
.bs-popover-right .arrow,
.bs-popover-auto[x-placement^="right"] .arrow {
left: -9px;
}
.bs-popover-left .arrow,
.bs-popover-auto[x-placement^="left"] .arrow {
right: -9px;
}
.bs-popover-top .arrow,
.bs-popover-auto[x-placement^="top"] .arrow {
bottom: -9px;
}
.bs-popover-bottom .arrow,
.bs-popover-auto[x-placement^="bottom"] .arrow {
top: -9px;
}
// Fixes an issue on Safari when the .custom-select is inside a .card class.
.custom-select {

43
theme/boost/style/moodle.css
View File

@ -12727,6 +12727,22 @@ a.text-dark:hover, a.text-dark:focus {
left: 0;
right: auto;
}
.dir-rtl .popover.bs-popover-right, .dir-rtl .popover.bs-popover-auto[x-placement^=right] {
margin-right: 0;
margin-left: 0.5rem;
}
.dir-rtl .popover.bs-popover-right .arrow, .dir-rtl .popover.bs-popover-auto[x-placement^=right] .arrow {
transform: rotate(180deg);
left: calc(-0.5rem - 1px);
}
.dir-rtl .popover.bs-popover-left, .dir-rtl .popover.bs-popover-auto[x-placement^=left] {
margin-right: 0.5rem;
margin-left: 0;
}
.dir-rtl .popover.bs-popover-left .arrow, .dir-rtl .popover.bs-popover-auto[x-placement^=left] .arrow {
transform: rotate(180deg);
right: calc(-0.5rem - 1px);
}
/**
* Moodle variables
@ -24947,33 +24963,6 @@ body:not(.jsenabled) .langmenu:hover > .dropdown-menu,
z-index: inherit;
}
/* Force positioning of popover arrows.
*
* The Css prefixer used in Moodle does not support complex calc statements used
* in Bootstrap 4 CSS. For example:
* calc((0.5rem + 1px) * -1); is stripped out by lib/php-css-parser/Parser.php.
* See MDL-61879. For now the arrow positions of popovers are fixed until this is resolved.
*/
.bs-popover-right .arrow,
.bs-popover-auto[x-placement^=right] .arrow {
left: -9px;
}
.bs-popover-left .arrow,
.bs-popover-auto[x-placement^=left] .arrow {
right: -9px;
}
.bs-popover-top .arrow,
.bs-popover-auto[x-placement^=top] .arrow {
bottom: -9px;
}
.bs-popover-bottom .arrow,
.bs-popover-auto[x-placement^=bottom] .arrow {
top: -9px;
}
.custom-select {
word-wrap: normal;
}

43
theme/classic/style/moodle.css
View File

@ -12727,6 +12727,22 @@ a.text-dark:hover, a.text-dark:focus {
left: 0;
right: auto;
}
.dir-rtl .popover.bs-popover-right, .dir-rtl .popover.bs-popover-auto[x-placement^=right] {
margin-right: 0;
margin-left: 0.5rem;
}
.dir-rtl .popover.bs-popover-right .arrow, .dir-rtl .popover.bs-popover-auto[x-placement^=right] .arrow {
transform: rotate(180deg);
left: calc(-0.5rem - 1px);
}
.dir-rtl .popover.bs-popover-left, .dir-rtl .popover.bs-popover-auto[x-placement^=left] {
margin-right: 0.5rem;
margin-left: 0;
}
.dir-rtl .popover.bs-popover-left .arrow, .dir-rtl .popover.bs-popover-auto[x-placement^=left] .arrow {
transform: rotate(180deg);
right: calc(-0.5rem - 1px);
}
/**
* Moodle variables
@ -24947,33 +24963,6 @@ body:not(.jsenabled) .langmenu:hover > .dropdown-menu,
z-index: inherit;
}
/* Force positioning of popover arrows.
*
* The Css prefixer used in Moodle does not support complex calc statements used
* in Bootstrap 4 CSS. For example:
* calc((0.5rem + 1px) * -1); is stripped out by lib/php-css-parser/Parser.php.
* See MDL-61879. For now the arrow positions of popovers are fixed until this is resolved.
*/
.bs-popover-right .arrow,
.bs-popover-auto[x-placement^=right] .arrow {
left: -9px;
}
.bs-popover-left .arrow,
.bs-popover-auto[x-placement^=left] .arrow {
right: -9px;
}
.bs-popover-top .arrow,
.bs-popover-auto[x-placement^=top] .arrow {
bottom: -9px;
}
.bs-popover-bottom .arrow,
.bs-popover-auto[x-placement^=bottom] .arrow {
top: -9px;
}
.custom-select {
word-wrap: normal;
}