-
Bug
-
Resolution: Fixed
-
Minor
-
3.3.4, 3.4, 3.5, 3.6.4, 3.7.1
-
MOODLE_33_STABLE, MOODLE_34_STABLE, MOODLE_35_STABLE, MOODLE_36_STABLE, MOODLE_37_STABLE
-
MOODLE_36_STABLE, MOODLE_37_STABLE
-
MDL-61319-master -
Hi,
I've encountered the following issue:
In MDL-58808, there was a change to the blocks.css code and there the Font Awesome styles are extended:
https://github.com/moodle/moodle/blob/master/theme/boost/scss/moodle/blocks.scss#L229
https://github.com/moodle/moodle/blob/master/theme/boost/scss/moodle/blocks.scss#L238
However if you use the class fa-pull-left / -right for a Font Awesome icon this leads to*not adding a margin* to the icon because the resulting CSS code is somehow corrupted:
.fa.fa-pull-left, .block_settings .block_tree [aria-expanded="true"]:before.fa-pull-left,
|
.block_navigation .block_tree [aria-expanded="true"]:before.fa-pull-left,
|
.block_settings .block_tree [aria-expanded="false"]:before.fa-pull-left,
|
.block_navigation .block_tree [aria-expanded="false"]:before.fa-pull-left {
|
margin-right: .3em
|
}
|
|
|
.fa.fa-pull-right, .block_settings .block_tree [aria-expanded="true"]:before.fa-pull-right,
|
.block_navigation .block_tree [aria-expanded="true"]:before.fa-pull-right,
|
.block_settings .block_tree [aria-expanded="false"]:before.fa-pull-right,
|
.block_navigation .block_tree [aria-expanded="false"]:before.fa-pull-right {
|
margin-left: .3em
|
}
|
If I delete those
@extend .fa
|
.fa.fa-pull-left {
|
margin-right: .3em
|
}
|
|
|
.fa.fa-pull-right {
|
margin-left: .3em
|
}
|
|
|
.block_settings .block_tree [aria-expanded="true"], .block_settings .block_tree [aria-expanded="true"].emptybranch,
|
.block_settings .block_tree [aria-expanded="false"], .block_navigation .block_tree [aria-expanded="true"],
|
.block_navigation .block_tree [aria-expanded="true"].emptybranch,
|
.block_navigation .block_tree [aria-expanded="false"] {
|
background-image: none
|
}
|
|
|
.block_settings .block_tree [aria-expanded="true"]:before, .block_navigation .block_tree [aria-expanded="true"]:before {
|
content: "";
|
margin-right: 0;
|
font-size: 16px;
|
width: 16px
|
}
|
|
|
.block_settings .block_tree [aria-expanded="false"]:before, .block_navigation .block_tree [aria-expanded="false"]:before {
|
content: "";
|
font-size: 16px;
|
margin-right: 0;
|
width: 16px
|
}
|
|
|
.dir-rtl .block_settings .block_tree [aria-expanded="false"]:before,
|
.dir-rtl .block_navigation .block_tree [aria-expanded="false"]:before {
|
content: ""
|
}
|
|
|
.block_navigation .block_tree p.hasicon, .block_settings .block_tree p.hasicon {
|
text-indent: -3px
|
}
|
|
|
.block_navigation .block_tree p.hasicon .icon, .block_settings .block_tree p.hasicon .icon {
|
margin-right: 2px
|
}
|
I really don't have a clue why the extend command messes something up in that case because usually it should only add the rules from .fa, but maybe there goes something wrong with other rules or the compiler messes something up?
Best, Kathrin
- will be (partly) resolved by
-
MDL-58930 in sass @extend .btn generates a lot of CSS
-
- Closed
-
