Allow changing color of NextPage and PreviousPage buttons

nkormanik · 09-27-2020, 02:57 AM

Please allow for a CSS (style) way to change the color of the NextPage and PreviousPage triangle buttons that show on each page of Calibre Viewer when mouse goes over to the margins.

Thank you!

Nicholas Kormanik

DNSB · 09-27-2020, 01:18 PM

For now I've voted no. Sorry but after the feeding frenzy about the viewer in the calibre 5 beta thread, I would prefer that time be spent on fixing bugs and not on cosmetics. In a while, when calibre 5 has matured, I might change my mind.

davidfor · 09-27-2020, 08:25 PM

Somehow I think the results are going to be similar to the poll @nkormanik created for removing the arrows.

nkormanik · 09-27-2020, 08:58 PM

From researching CSS, all we need to know is the NAME given to those triangles.

Once we have the name, changing the color is a cinch, via a line or two in the 'Style' preferences.

No biggie at all. No need for any coding changes.

So, how do we find that name??

DNSB · 09-27-2020, 09:47 PM

Quote:

Originally Posted by nkormanik

From researching CSS, all we need to know is the NAME given to those triangles.

Once we have the name, changing the color is a cinch, via a line or two in the 'Style' preferences.

No biggie at all. No need for any coding changes.

So, how do we find that name??

Out of curiosity, since you researched the way that the button colour is set by CSS to be able to state from your knowledge that making the changes would be a cinch, why not change the CSS that you found and report back with your results.

nkormanik · 09-28-2020, 01:22 AM

Umm, as I think I said, in order to make a change, one needs to know the NAME given to the thing which is to be changed.

As an example: A room full of people. You want "Mary" to come over to you. In order to get that to happen, you need to know her name.

Like, "Mary, come on over to me."

If you don't know Mary's name, it ain't gonna happen.

thiago.eec · 09-28-2020, 09:22 AM

If you are on Windows, go to 'C:\Program Files\Calibre2\app\resources\viewer.html'. Look for these two lines:

Code:

<symbol viewBox="0 0 1792 1792" id="icon-caret-right">
...
<symbol viewBox="0 0 1792 1792" id="icon-caret-left">

Now, if you want them blue, this is how:

Code:

<symbol viewBox="0 0 1792 1792" id="icon-caret-right" style="fill: blue">
...
<symbol viewBox="0 0 1792 1792" id="icon-caret-left" style="fill: blue">

Or if you want them gone, like before, just use "fill: transparent".

P.S.: a calibre upgrade will overwrite these changes.

theducks · 09-28-2020, 11:07 AM

You will probably be pretty safe putting YOUR (override) VERSION
of resources\viewer.html' into the Resources folder into the CONFIGURATION FOLDER. Updates to that ORIGINAL file are probably low, so you will not need to update YOUR version.
For lurkers: Kovid designed much of Calibre to look into the Config folder/resources first and use that piece, if found. Calibre [U]Updates do not overwrite this area. /U] (the burden of keeping up if needed, is on you

)

thiago.eec · 09-28-2020, 12:47 PM

Quote:

Originally Posted by theducks

You will probably be pretty safe putting YOUR (override) VERSION
of resources\viewer.html' into the Resources folder into the CONFIGURATION FOLDER. Updates to that ORIGINAL file are probably low, so you will not need to update YOUR version.
For lurkers: Kovid designed much of Calibre to look into the Config folder/resources first and use that piece, if found. Calibre [U]Updates do not overwrite this area. /U] (the burden of keeping up if needed, is on you

)

I remembered this tip you once gave me (which is great, by the way), but in this case it didn't work here. Maybe viewer.js had to be at the same spot. Didn't look into it since I won't modify mine.

BetterRed · 09-28-2020, 06:10 PM

I've never found anything in ..\Calibre2\app\resources that couldn't be copied to ..\calibre\resources, made writeable, and then… assuming you know how… be edited or replaced.

BR

kovidgoyal · 09-28-2020, 08:26 PM

JavaScript code cannot be overriden using the usual resource directory in config folder trick, that's because JS code is not really meant to be overridable given that it changes with every release and the rest of calibre depends on it. If you want to change actual code you need to run calibre as described here: https://manual.calibre-ebook.com/develop.html

View Poll Results: Allow changing NextPage and PreviousPage triangles in margins?
Yes	1	14.29%
No	6	85.71%
Voters: 7. You may not vote on this poll

09-27-2020, 02:57 AM	#1
nkormanik Connoisseur Posts: 86 Karma: 10 Join Date: Oct 2010 Location: Philippines Device: DavidAcisAAJ	Allow changing color of NextPage and PreviousPage buttons Please allow for a CSS (style) way to change the color of the NextPage and PreviousPage triangle buttons that show on each page of Calibre Viewer when mouse goes over to the margins. Thank you! Nicholas Kormanik Last edited by nkormanik; 09-27-2020 at 03:05 AM.

09-28-2020, 09:22 AM	#7
thiago.eec Guru Posts: 930 Karma: 1177583 Join Date: Dec 2016 Location: Goiânia - Brazil Device: iPad, Kindle Paperwhite	If you are on Windows, go to 'C:\Program Files\Calibre2\app\resources\viewer.html'. Look for these two lines: Code: <symbol viewBox="0 0 1792 1792" id="icon-caret-right"> ... <symbol viewBox="0 0 1792 1792" id="icon-caret-left"> Now, if you want them blue, this is how: Code: <symbol viewBox="0 0 1792 1792" id="icon-caret-right" style="fill: blue"> ... <symbol viewBox="0 0 1792 1792" id="icon-caret-left" style="fill: blue"> Or if you want them gone, like before, just use "fill: transparent". P.S.: a calibre upgrade will overwrite these changes. Last edited by thiago.eec; 09-28-2020 at 09:30 AM.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Changing font color OR background color for an entry	dkperez	Library Management	2	06-29-2015 11:50 PM
Changing BG color on PDF e-readers	ittiandro	Android Devices	2	06-01-2014 05:32 PM
Changing text color?	bizzybody	ePub	2	10-23-2011 01:45 AM
E-ink background changing color	lobotom1	enTourage Archive	10	04-04-2011 12:16 PM
Changing color of highlighter in Reader	walt526	enTourage Archive	0	06-01-2010 10:46 PM

09-27-2020, 01:18 PM	#2
DNSB Bibliophagist Posts: 35,513 Karma: 145557716 Join Date: Jul 2010 Location: Vancouver Device: Kobo Sage, Forma, Clara HD, Lenovo M8 FHD, Paperwhite 4, Tolino epos	For now I've voted no. Sorry but after the feeding frenzy about the viewer in the calibre 5 beta thread, I would prefer that time be spent on fixing bugs and not on cosmetics. In a while, when calibre 5 has matured, I might change my mind.

09-27-2020, 08:25 PM	#3
davidfor Grand Sorcerer Posts: 24,907 Karma: 47303748 Join Date: Jul 2011 Location: Sydney, Australia Device: Kobo:Touch,Glo, AuraH2O, GloHD,AuraONE, ClaraHD, Libra H2O; tolinoepos	Somehow I think the results are going to be similar to the poll @nkormanik created for removing the arrows.

09-27-2020, 08:58 PM	#4
nkormanik Connoisseur Posts: 86 Karma: 10 Join Date: Oct 2010 Location: Philippines Device: DavidAcisAAJ	From researching CSS, all we need to know is the NAME given to those triangles. Once we have the name, changing the color is a cinch, via a line or two in the 'Style' preferences. No biggie at all. No need for any coding changes. So, how do we find that name??

09-28-2020, 01:22 AM	#6
nkormanik Connoisseur Posts: 86 Karma: 10 Join Date: Oct 2010 Location: Philippines Device: DavidAcisAAJ	Umm, as I think I said, in order to make a change, one needs to know the NAME given to the thing which is to be changed. As an example: A room full of people. You want "Mary" to come over to you. In order to get that to happen, you need to know her name. Like, "Mary, come on over to me." If you don't know Mary's name, it ain't gonna happen.

09-28-2020, 11:07 AM	#8
theducks Well trained by Cats Posts: 29,818 Karma: 54830978 Join Date: Aug 2009 Location: The Central Coast of California Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A	You will probably be pretty safe putting YOUR (override) VERSION of resources\viewer.html' into the Resources folder into the CONFIGURATION FOLDER. Updates to that ORIGINAL file are probably low, so you will not need to update YOUR version. For lurkers: Kovid designed much of Calibre to look into the Config folder/resources first and use that piece, if found. Calibre [U]Updates do not overwrite this area. /U] (the burden of keeping up if needed, is on you )

09-28-2020, 06:10 PM	#10
BetterRed null operator (he/him) Posts: 20,590 Karma: 26954694 Join Date: Mar 2012 Location: Sydney Australia Device: none	I've never found anything in ..\Calibre2\app\resources that couldn't be copied to ..\calibre\resources, made writeable, and then… assuming you know how… be edited or replaced. BR

09-28-2020, 08:26 PM	#11
kovidgoyal creator of calibre Posts: 43,871 Karma: 22666666 Join Date: Oct 2006 Location: Mumbai, India Device: Various	JavaScript code cannot be overriden using the usual resource directory in config folder trick, that's because JS code is not really meant to be overridable given that it changes with every release and the rest of calibre depends on it. If you want to change actual code you need to run calibre as described here: https://manual.calibre-ebook.com/develop.html

Advert

Advert