nildarar
(Nildarar)
10 سبتمبر 2020، 5:39ص
1
The list opened in Select-Kit is not displayed correctly in RTL.
Current layout:
+--------+
| target |
+-------------+
| |
| popper |
| |
+-------------+
Expected layout:
+--------+
| target |
+-------------+
| |
| popper |
| |
+-------------+
I checked the code and saw that the settings are only for LTR.
icon: null,
icons: null,
maximum: null,
maximumLabel: null,
minimum: null,
minimumLabel: null,
autoInsertNoneItem: true,
clearOnClick: false,
closeOnChange: true,
limitMatches: null,
placement: "bottom-start",
placementStrategy: null,
filterComponent: "select-kit/select-kit-filter",
selectedNameComponent: "selected-name",
castInteger: false,
preventsClickPropagation: false,
focusAfterOnChange: true,
triggerOnChangeOnTab: true,
},
autoFilterable: computed("content.[]", "selectKit.filter", function () {
And used here:
if (!placementStrategy) {
placementStrategy = inModal ? "fixed" : "absolute";
}
const verticalOffset = this.multiSelect ? 0 : 3;
/* global Popper:true */
this.popper = Popper.createPopper(anchor, popper, {
eventsEnabled: false,
strategy: placementStrategy,
placement: this.selectKit.options.placement,
modifiers: [
{
name: "offset",
options: {
offset: [0, verticalOffset],
},
},
{
name: "applySmallScreenOffset",
enabled: window.innerWidth <= 450,
I tried to solve the problem by adding some CSS codes, but unfortunately, this causes more problems. I think if we use placement: "bottom-end" when the page is RTL, the problem will be solved.
Also, this has caused the opened poppers to be displayed off-screen on some mobile phones. If you need, I can send you some screenshots of the problem in a pm.
إعجاب واحد (1)
nildarar
(Nildarar)
22 أكتوبر 2020، 8:30ص
3
Can we apply this change to our community or must the change be applied by the Discourse team?
j.jaffeux
(Joffrey Jaffeux)
22 أكتوبر 2020، 8:31ص
4
Yes you need to wait for a change, sorry, will try to have a look soon, should be trivial to fix.
إعجاب واحد (1)
nildarar
(Nildarar)
22 أكتوبر 2020، 8:37ص
5
Thank you for your response
Do you think it is possible to change such a thing through JavaScript? As we inject this change through a theme component to temporarily solve the problem.
j.jaffeux
(Joffrey Jaffeux)
22 أكتوبر 2020، 8:42ص
6
Everything is possible but I wouldn’t recommend it, I will have a look shortly.
إعجاب واحد (1)
nildarar
(Nildarar)
22 أكتوبر 2020، 8:46ص
7
On desktops larger than 1711px, this problem is easily seen in the notification settings at the end of the topic page.
إعجاب واحد (1)
j.jaffeux
(Joffrey Jaffeux)
22 أكتوبر 2020، 8:32م
8
I pushed a fix on master for this, let me know if it improves the situation for you. If not please make sure you take a screenshot.
5 إعجابات
nildarar
(Nildarar)
31 أكتوبر 2020، 6:38ص
9
Due to the deletion of the gif profile pictures, we had to update with a slight delay. As it turns out, this problem is completely solved.
Thanks @j.jaffeux
إعجابَين (2)