View Full Version : When displaying ePubs, what is the best way to display user font-size, color, etc.?


mattcurtis
05-04-2013, 06:46 PM
A lot of ePubs specify things like font-size, paragraph spacing, line-height, and font color via stylesheets. I'm developing a reader, and I'm wondering what is the recommended way of overriding those ePub-set styles and displaying a user's custom display settings. Besides inserting something like:

* { color: #usercolor; }
p { color: #usercolor; }
body { color: #usercolor; }

Are there any recommended techniques for this? Thanks.

Toxaris
05-05-2013, 03:14 AM
Dependes on your reader. Some can, others can't. Otherwise you can change it in the ePUB itself, but I would not recommend that.

AlPe
05-05-2013, 08:28 AM
Assuming that you are using an already existing engine to render the XHTML pages, what you should do is patching the source code of the pages extracted from the EPUB container, before passing them to the renderer.

In general, this will require analyzing the CSS cascade, the XHTML of the page (style can be defined both in <head> and inline), etc. Wherever needed, you must change/add your own style definitions for the various elements, according to your user-generated settings.

It is a pretty complicate endeavour, but a simple start consists in injecting the user-generated settings as last <style> element in the head of the XHTML page. This overrides CSS declarations, but it might be overridden by inline style statemets. However this technique should probably suffice for a vast majority of eBooks.

dgatwood
05-11-2013, 01:46 AM
The approach I would tend to take is this:

1. If the user doesn't request a style override, use the publisher's style as-is.
2. If the user asks for a typical style override, inject a new style tag after the last one in the document, then walk each stylesheet in the order in which they appear (not including the one you just inserted). For each CSS rule in the book's stylesheets:

a. Create a new rule set in your custom stylesheet with the same selector.
b. Inspect each declaration within that rule, and if there is a conflicting declaration in the book's stylesheet that is not marked !important, insert your own declaration inside the rule set you just created.
c. If there is a conflicting declaration that is marked !important, don't try to override it.

Repeat until you have processed every stylesheet in the book.

3. If the user asks for a "sudo" style override, either disable the book's stylesheet outright and substitute your own, or follow the steps for #2, but override the !important styles, too. Please be judicious in deciding when it is appropriate to do this, though. This really only makes sense if you're basically overriding everything—font face, font size, line height, margins (and particularly negative margins), padding, etc. and setting everything to the defaults. If you leave almost any book-specific styling in place, you'll almost invariably break things.

mattcurtis
05-17-2013, 01:06 AM
The approach I would tend to take is this:

1. If the user doesn't request a style override, use the publisher's style as-is.
2. If the user asks for a typical style override, inject a new style tag after the last one in the document, then walk each stylesheet in the order in which they appear (not including the one you just inserted). For each CSS rule in the book's stylesheets:

a. Create a new rule set in your custom stylesheet with the same selector.
b. Inspect each declaration within that rule, and if there is a conflicting declaration in the book's stylesheet that is not marked !important, insert your own declaration inside the rule set you just created.
c. If there is a conflicting declaration that is marked !important, don't try to override it.

Repeat until you have processed every stylesheet in the book.

3. If the user asks for a "sudo" style override, either disable the book's stylesheet outright and substitute your own, or follow the steps for #2, but override the !important styles, too. Please be judicious in deciding when it is appropriate to do this, though. This really only makes sense if you're basically overriding everything—font face, font size, line height, margins (and particularly negative margins), padding, etc. and setting everything to the defaults. If you leave almost any book-specific styling in place, you'll almost invariably break things.

Excellent answers I'm getting! Thank you.

Question: wouldn't number 2 override headers? Would you say it's a good idea for my selector for the user's font size target paragraph tags, instead of body?

William Ockham
05-17-2013, 04:09 PM
No, don't do this. What you are asking is how to be non-compliant with the spec. To quote from the 2.01 version of the spec:

This specification assumes the use of selectors (see http://www.w3.org/TR/REC-CSS2/selector.html), cascade, and inheritance (see http://www.w3.org/TR/CSS2/cascade.html) be consistent with the definitions in the CSS2 Specification. For example, the CSS2 Specification defines !important rules (see http://www.w3.org/TR/CSS2/cascade.html#important-rules) to create a balance of power between author and user style sheets.

Use the cascade. No special effort required.

AlPe
05-20-2013, 07:16 PM
BTW, how many reading systems actually support (the required) oeb-page-head and oeb-page-foot ?

If a RS lets the user choose to override something, I do not see it as a problem, as soon as it is not the default (and only) behavior.

mattcurtis
05-24-2013, 10:37 AM
No, don't do this. What you are asking is how to be non-compliant with the spec. To quote from the 2.01 version of the spec:

This specification assumes the use of selectors (see http://www.w3.org/TR/REC-CSS2/selector.html), cascade, and inheritance (see http://www.w3.org/TR/CSS2/cascade.html) be consistent with the definitions in the CSS2 Specification. For example, the CSS2 Specification defines !important rules (see http://www.w3.org/TR/CSS2/cascade.html#important-rules) to create a balance of power between author and user style sheets.

Use the cascade. No special effort required.
I'm probably going to give this a shot, and see if other methods are required.