Colour of the focus row / and line number width woes (again)

[ajtruckle]

I have just used your plugin for the first time on an actual post on my site with Gutenberg (in this case not bbPress) and I have to say it was a pleasant experience. :)

I only have two issues that i see:

1/ The colour of the focus row highlight is not that apparent to me (I am colour blind). I have looked for a hover css to override the background and I can't see one.

2/ I have a conflict for the width of the line numbers area. In bbPress posts I need to use something like this:

ol.EnlighterJS, ul.EnlighterJS {
    padding-left: 50px !important;
    font-size: 10pt !important;
}

If I don't use 50px then I can't see the line numbers. But in a standard "post" that width is too much. It only needs to be 10px. How can I use one width for bbPress and one for posts?

[AndiDittrich]

1. do you mean "highlighted line" mode or just hover ? both settings can be controlled via the theme customizer
2. you can use #bbpress-forums as selector

[ajtruckle]

1. you can use #bbpress-forums as selector

I have applied your suggestion:

#bbpress-forums ol.EnlighterJS {
    padding-left: 50px !important;
}

ol.EnlighterJS {
    padding-left: 0px !important;
}

The above is working but I don't think changing the left padding is a foolproof resolution. For example, if my shortcode begins with a larger line number value, eg:

[generic offset ="10000" highlight="10030"]

The padding of 50px is not enough for line numbers of that size. So it seems to me that there is something else that needs to be fixed instead of adjusting this padding property.

2. do you mean "highlighted line" mode or just hover ? both settings can be controlled via the theme customizer

As for the focus row (in a standard post) this is what it looks like for me:

That colour is just not standing out for me being colourblind.

[ajtruckle]

So it seems to me that there is something else that needs to be fixed instead of adjusting this padding property.

I did a side by side comparison of the Post v bbPress Topic and I noticed a difference. I therefore changed my Additional CSS to match the Post style, like this:

#bbpress-forums ol.EnlighterJS > li, ul.EnlighterJS > li {
  margin-left: 40px !important;
}

That did the trick. What I have noticed though is that the line numbering system appears to be designed to cope with numbers up to 999. As as soon as you use 1001 you will visually lose a character. I don't know if you have noticed that before? The above styling was what I required though and I have tested it with multiple browsers.

As for the focus row (in a standard post) this is what it looks like for me:

The above issue still stands for me about the colour of row mouse is over.

[AndiDittrich]

this are known "side effects" of using the list auto-numbering. EnlighterJS v3 solves this issue using another markup.

just change the color within the theme customizer

[ajtruckle]

this are known "side effects" of using the list auto-numbering. EnlighterJS v3 solves this issue using another markup.

just change the color within the theme customizer

What do you mean by theme customiser? Sorry if I should already know the answer to that one. Are you referring to my WordPress Additional CSS area?

[AndiDittrich]

the most powerful feature of the Enlighter plugin - you can customize any theme without css knowledge (as mentioned in every doc) just select wp custom as theme and a new tab on the settings page will appear

[ajtruckle]

the most powerful feature of the Enlighter plugin - you can customize any theme without css knowledge (as mentioned in every doc) just select wp custom as theme and a new tab on the settings page will appear

That is a fabulous feature! :) Issue sorted!