FIX: rtl topic progress wrapper position (#7070)
* Set left/right topic-progress-wrapper CSS from text-direction * Remove unnecessary CSS rule
This commit is contained in:
parent
d6875a77fb
commit
c742d42031
|
@ -155,14 +155,16 @@ export default Ember.Component.extend({
|
|||
const $wrapper = this.$();
|
||||
if (!$wrapper || $wrapper.length === 0) return;
|
||||
|
||||
const offset = window.pageYOffset || $("html").scrollTop(),
|
||||
const $html = $("html"),
|
||||
offset = window.pageYOffset || $html.scrollTop(),
|
||||
progressHeight = this.site.mobileView ? 0 : $("#topic-progress").height(),
|
||||
maximumOffset = $("#topic-bottom").offset().top + progressHeight,
|
||||
windowHeight = $(window).height(),
|
||||
bodyHeight = $("body").height(),
|
||||
composerHeight = $("#reply-control").height() || 0,
|
||||
isDocked = offset >= maximumOffset - windowHeight + composerHeight,
|
||||
bottom = bodyHeight - maximumOffset;
|
||||
bottom = bodyHeight - maximumOffset,
|
||||
wrapperDir = $html.hasClass("rtl") ? "left" : "right";
|
||||
|
||||
if (composerHeight > 0) {
|
||||
$wrapper.css("bottom", isDocked ? bottom : composerHeight);
|
||||
|
@ -174,9 +176,9 @@ export default Ember.Component.extend({
|
|||
|
||||
const $replyArea = $("#reply-control .reply-area");
|
||||
if ($replyArea && $replyArea.length > 0) {
|
||||
$wrapper.css("right", `${$replyArea.offset().left}px`);
|
||||
$wrapper.css(wrapperDir, `${$replyArea.offset().left}px`);
|
||||
} else {
|
||||
$wrapper.css("right", "1em");
|
||||
$wrapper.css(wrapperDir, "1em");
|
||||
}
|
||||
|
||||
// switch mobile scroll logo at the very bottom of topics
|
||||
|
|
|
@ -2,11 +2,6 @@
|
|||
// *** These styles are all going to be flipped by the r2 gem ***
|
||||
// Adding the !important declaration to a rule prevents it from being flipped.
|
||||
|
||||
.rtl #topic-progress-wrapper .topic-admin-popup-menu.right-side,
|
||||
.rtl #topic-progress-wrapper.docked .topic-admin-popup-menu.right-side {
|
||||
right: 80px;
|
||||
}
|
||||
|
||||
// This is used to flip the .d-icon-caret-right
|
||||
@mixin rotate($degrees) {
|
||||
-webkit-transform: rotate(#{$degrees}deg);
|
||||
|
|
Loading…
Reference in New Issue