To be more precise:
It is not always blue, but in "fruity" it is the color of the selected theme vatiation
The selected colors were
low: #8A2BE2 = BlueViolet
middle: #A52A2A = Brown
high: #BDB76B = DarkKhaki

Here "sea green"
 
"sunset orange"
 

But in "vanilla" you see all three selected colors
 

Also it is possible to move upper marker to the left from lower marker.

What do you mean? Some kind of reverse scale?

Joffm
 

Also it is possible to move upper marker to the left from lower marker. I'm not sure if this is a bug or feature.

This is the expected behaviour. Check your data.

Joffm wrote:

But in "vanilla" you see all three selected colors

Ah, OK. So I guess there is some workaround having the magic string !important for Fuity theme?

Joffm wrote:

To be more precise:
It is not always blue, but in "fruity" it is the color of the selected theme vatiation...

I cannot reproduce the problem. Here is what I see with different themes/variations in version 5.4.4.

Vanilla:
 

Fruity Sea Green:
 

Fruity Sunset Orange:
 

Hm, strange.
I use 5.4.2. and the date of the last update is 28/6/2021 (config.xml)
"purple tentacle" and "black pearl"




Do we miss something?

Joffm

Can you please attach that sample survey?

Of course,
here it is.
 

Is it possible that this is because in the [variation].css like "seagreen.css" the slider-selection is defined as
.fruity .slider-selection{background-image:linear-gradient(to bottom, #84b39a 0%, #39993f 100%)}
but in the rangeslider.js there is only the "background-color"
$('.slider-selection', thisQuestion).css('background-color', opts.sliderColorM );

You see - with my very limited knowledge - I removed the "background-image" part from the "seagreen.css".
And now it looks as expected.

Normal:
 
With removed "background-image"
 

Might this cause this effect?

Best regards
Joffm

Ah, that explains! But then I tried adding

.mytest .slider-selection { background-image: none !important; }

to custom.css and it does not seem to help.

Is it possible that this is because in the [variation].css like "seagreen.css" the slider-selection is defined as...

Sure, but it's odd that I don't get that rule applied.

Anyway, I have updated rangeSlider.css to remove all background images from the slider track - github.com/tpartner/LimeSurvey-Range-Sli...geSlider.css#L37-L42

Supergreat! Now everything works, researcher is happy, the sun shines and the sky is blue! (Well, two last not really, but still, good.)