Alpha Picker position and color

[cochize1 28]

Hi, can't seem to find a way to change the color of the letters in Alpha Picker and also the way to move it down a little, anyone?

[Happy2Play 5765]

Something like this

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-fixed {top: 12em;}

 

[cochize1 28]

Sorry, doesn't work for me, everything stays the same

EDIT: It worked when I placed the code at the beggining of my existing code

Edited October 28, 2020 by cochize1

[Happy2Play 5765]

What do you mean?

[arrbee99 884]

Not some kind of browser caching thing I suppose ?

[arrbee99 884]

Am wondering if anyone might know some updates for these please, as its something that stopped working for me recently. Also similar stuff I had to increase the size of the letters stopped working. I tried to fix it up yesterday but as usual nothing worked.

[Happy2Play 5765]

12 minutes ago, arrbee99 said:

Am wondering if anyone might know some updates for these please, as its something that stopped working for me recently. Also similar stuff I had to increase the size of the letters stopped working. I tried to fix it up yesterday but as usual nothing worked.

Sorry the code above works for me.  And you can add "font-size" to "div.alphaPickerRow-vertical button".

only tested in 4.7.0.3 though.

[arrbee99 884]

Weird.

Still, I just tried adding font size as a separate item in the middle here -

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 12em;}

and thats the only one that works. Something to do with !imprtant (which was only there as it was a cut and paste job), or the absence of Row, or something.

[Happy2Play 5765]

13 minutes ago, arrbee99 said:

Weird.

Still, I just tried adding font size as a separate item in the middle here -

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 12em;}

and thats the only one that works. Something to do with !imprtant (which was only there as it was a cut and paste job), or the absence of Row, or something.

Original code adding font-size to button but I can apply at your level without !important (tested with different color).  This is what I get

Only thing I can think of would be conflicting code.  Did you test this code by itself?

Edited June 24 by Happy2Play

[arrbee99 884]

Haven't tried by itself. I might well do so, though I admit increasing the font size to something I can actually see is the most important for me, and thats the bit that works.

But I shall no-doubt continue to fiddle with the other two items and probably try it by itself pretty soon.

[Happy2Play 5765]

11 minutes ago, arrbee99 said:

Haven't tried by itself. I might well do so, though I admit increasing the font size to something I can actually see is the most important for me, and thats the bit that works.

But I shall no-doubt continue to fiddle with the other two items and probably try it by itself pretty soon.

div.alphaPickerRow-vertical {font-size: initial;}
div.alphaPickerRow-vertical button {color: red;}
div.alphaPicker-fixed {top: 12em;}

 

[arrbee99 884]

The bottom two lines work.

The top line doesn't seem to. I changed it from initial to 135%, stayed the same, upped it to 200%, stayed the same, added !important, stayed the same, got rid of Row, stayed the same.

So if I have this

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 32em;}

 

/*div.alphaPicker-vertical {font-size: 200% !important;}
div.alphaPickerRow-vertical button {color: red;}
div.alphaPicker-fixed {top: 32em;}*/

I get this -

and if I swap round whats enabled -

/*div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 32em;}*/

 

div.alphaPicker-vertical {font-size: 200% !important;}
div.alphaPickerRow-vertical button {color: red;}
div.alphaPicker-fixed {top: 32em;}

I get this -

Does that make sense to you ? I guess I should try the 'getting rid of all the other stuff' bit.

 

 

[Happy2Play 5765]

10 minutes ago, arrbee99 said:

Does that make sense to you ? I guess I should try the 'getting rid of all the other stuff' bit.

No as both work for me, I don't need the !important either.  Also if you apply to much "Top" you will loose the lower letters.  But can only guess you have some conflicting code somewhere.  You should be able to see in the dev console as it shows you the custom css applied.

[Happy2Play 5765]

@arrbee99How about just this.

button.alphaPickerButton-vertical {
    font: caption;
    color: yellow;
}

 

[arrbee99 884]

5 minutes ago, Happy2Play said:

@arrbee99How about just this.

button.alphaPickerButton-vertical {
    font: caption;
    color: yellow;
}

 

...I just get small yellow letters.

If I have this -

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 12em;}

I get big letters in the right place, but not yellow, but if I comment out the top (color yellow) line I just get small letters in the right place.

[arrbee99 884]

But if I chuck everything completely and add this

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 32em;}

back, everythings fine (except too low, but that was just to see if that command was working.

[arrbee99 884]

But I might give up and put everything back, and just keep this

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 12em;}

so that the size and position work

[Happy2Play 5765]

1 minute ago, arrbee99 said:

12 minutes ago, Happy2Play said:

@arrbee99How about just this.

button.alphaPickerButton-vertical {
    font: caption;
    color: yellow;
}

 

Expand  

...I just get small yellow letters.

Really as I get this.

2 minutes ago, arrbee99 said:

But if I chuck everything completely and add this

div.alphaPickerRow-vertical button {color: yellow;}
div.alphaPicker-vertical {font-size: 135% !important;}
div.alphaPicker-fixed {top: 32em;}

back, everythings fine (except too low, but that was just to see if that command was working.

So you have conflicting code somewhere.  You can PM or post your complete code and I can take a look.

[arrbee99 884]

I can PM (or post) it, but it seems like quite a bit to me, so if you don't fancy it, please say so...

[Happy2Play 5765]

5 minutes ago, arrbee99 said:

I can PM (or post) it, but it seems like quite a bit to me, so if you don't fancy it, please say so...

No worries I offered.  Not knowing what you have you might want to put it in a txt file and attach or PM.

[arrbee99 884]

Hokay...

Emby css alphapicker text.txt

[Happy2Play 5765]

16 minutes ago, arrbee99 said:

Hokay...

Emby css alphapicker text.txt 12.1 kB · 0 downloads

You know your only issue is a missing "/" in one of your line breaks.  The one for your alphapicker section is in.  Then of course uncommenting the color.

here as this starts breaking the code below it.

* ---------------------------------------------------------------------------------------------------- */
/* Movie and Series List */

 

Edited June 25 by Happy2Play

[arrbee99 884]

That is just so completely, erm, flipping typical. Thanks for spotting my deliberate mistake

I don't know what upside down face means but I like it.

Any idea how come it doesn't break everything after it, of which there's quite a bit ?

[Happy2Play 5765]

1 minute ago, arrbee99 said:

That is just so completely, erm, flipping typical. Thanks for spotting my deliberate mistake

I don't know what upside down face means but I like it.

Any idea how come it doesn't break everything after it, of which there's quite a bit ?

That I do not know as it is sort of selection after the break in the code.

[arrbee99 884]

Oh, well, thanks again, and sorry for all the time-wasting.