mirror of
https://github.com/discourse/discourse.git
synced 2024-12-01 13:09:33 -06:00
0b9f035eac
We currently have some CSS rules in `common/base/rtl.scss` that were added to workaround shortcomings of the R2 gem that we used to use to generate versions of our CSS that are suitable for RTL layouts. Those workarounds are mostly duplicates of existing rules with the only difference being that they're flipped to suit RTL layouts (e.g. `padding-left` is changed to `padding-right` and vice versa).
However, we've recently replaced R2 with `rtlcss` which doesn't have those shortcomings of R2 (see f94951147e) which means those workarounds/duplicate rules need to be removed because they're getting flipped by `rltcss`, essentially reverting them to their original LTR version and causing issues with RTL layouts.
This commit removes those workarounds that are no longer needed, and cleans up the the file that contains our RTL-specific CSS.
Meta topic: https://meta.discourse.org/t/avatar-in-rtl-website-in-wrong-place/264676?u=osama.
84 lines
1.8 KiB
SCSS
84 lines
1.8 KiB
SCSS
// Right to left styles.
|
|
|
|
.rtl {
|
|
.d-icon-align-right,
|
|
.d-icon-angle-double-right,
|
|
.d-icon-angle-right,
|
|
.d-icon-arrow-right,
|
|
.d-icon-caret-right,
|
|
.d-icon-chevron-right,
|
|
.d-icon-hand-point-right,
|
|
.d-icon-quote-right {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.d-icon-align-left,
|
|
.d-icon-angle-double-left,
|
|
.d-icon-angle-left,
|
|
.d-icon-arrow-left,
|
|
.d-icon-caret-left,
|
|
.d-icon-chevron-left,
|
|
.d-icon-hand-point-left,
|
|
.d-icon-quote-left {
|
|
transform: rotate(180deg);
|
|
}
|
|
}
|
|
|
|
.rtl .admin-customize .current-style .toggle-mobile {
|
|
position: static !important;
|
|
float: left !important;
|
|
}
|
|
.rtl .admin-customize .current-style .toggle-maximize {
|
|
position: static !important;
|
|
float: left !important;
|
|
}
|
|
|
|
// For the support_mixed_text_direction setting
|
|
html:not(.rtl) .cooked ul[dir="rtl"],
|
|
html:not(.rtl) .d-editor-preview ul[dir="rtl"],
|
|
.rtl .cooked ul[dir="ltr"],
|
|
.rtl .d-editor-preview ul[dir="ltr"] {
|
|
padding-left: 0;
|
|
padding-right: 1.25em;
|
|
margin-right: 1.25em;
|
|
}
|
|
|
|
.rtl {
|
|
$mobile-breakpoint: 700px;
|
|
|
|
.admin-detail.mobile-open {
|
|
@media (max-width: $mobile-breakpoint) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(-250px));
|
|
}
|
|
@media (max-width: 500px) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(-50%));
|
|
}
|
|
}
|
|
|
|
.admin-detail.mobile-closed {
|
|
@media (max-width: $mobile-breakpoint) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(0));
|
|
margin-left: -10px !important;
|
|
padding-left: 10px !important;
|
|
}
|
|
}
|
|
|
|
.admin-nav {
|
|
.nav-stacked {
|
|
margin: 0 -10px 0 10px !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rtl .ace_placeholder {
|
|
direction: rtl !important;
|
|
text-align: right !important;
|
|
|
|
[dir="ltr"] {
|
|
text-align: left !important;
|
|
}
|
|
}
|