coderefinery / sphinx-lesson

Sphinx extension for creating CodeRefinery lessons
https://coderefinery.github.io/sphinx-lesson/
MIT License
15 stars 20 forks source link

Change highlighter colour to preserve black text #105

Open ashwinvis opened 1 week ago

ashwinvis commented 1 week ago

Currently the highlight colour blends in with the rest of the theme and also inverts the colour of text.

image

If we add a CSS tweak something like this:

/*** Works on common browsers ***/
::selection {
    background-color: #fce762;
    color: #000;
}

/*** Mozilla based browsers ***/
::-moz-selection {
    background-color: #fce762;
    color: #000;
}

/***For Other Browsers ***/
::-o-selection {
    background-color: #fce762;
    color: #000;
}

::-ms-selection {
    background-color: #fce762;
    color: #000;
}

/*** For Webkit ***/
::-webkit-selection {
    background-color: #fce762;
    color: #000;
}

image

NOTE: this is inspired from how The Guardian website does this, but I got the CSS from https://stackoverflow.com/questions/2258647/changing-the-highlight-color-when-selecting-text-in-an-html-text-input

bast commented 1 week ago

Thank you! Upvote from me.