search

soderlind / read-offline

Read Offline allows you to download or print posts and pages. You can download the post as PDF, ePub and mobi
https://wordpress.org/plugins/read-offline/
31 stars 10 forks source link

Adding custom CSS for the cover image of epub #20

Closed villevainio closed 8 years ago

villevainio commented 9 years ago

Could you please add support to add custom CSS for the cover image of epub (CoverPage.xhtml)? If this is doable, could you also remove the inline style height:100% so it doesn't override my CSS? I think in some cases setting the height to 100% will cause the cover image to span across two pages (max-height:100% might work better).

soderlind commented 9 years ago

The height is hardcode (inline) in the library, I'll see if I can override it.

soderlind commented 9 years ago

What do you want to do by having a custom style for the cover page ?

villevainio commented 9 years ago

I would just like to try to solve the problem with the cover image sometimes spanning across two pages. But I guess just replacing the current height:100% with max-height:100%might do the trick.

soderlind commented 9 years ago

do you have a link to a page that creates a coverimage spaning over two pages ?

villevainio commented 9 years ago

For example this one http://villevainio.com/iltasatu/the-adventures-of-tom-sawyer/ but I've only come across the problem so far with iPhone/Kobo. I just tried manually changing height:100% to max-width:100%;max-height:100% and it fixed the problem (by scaling down the cover image on Kobo).

soderlind commented 9 years ago

max-height sets the max, but doesn't set the height to 100%, so both are needed (maybe height should be 99%).

soderlind commented 9 years ago

eh .. height should be set to auto: height:auto;

villevainio commented 9 years ago

Yes I agree, but also height defaults to auto so it doesn't need to be stated unless it should override a previous declaration. I guess in this case you could set 

max-width: 100%;
height: auto !important;
max-height: 100%;

in CoverPage.css to override the inline height style in CoverPage.xhtml (though generally using !important should be avoided).

soderlind commented 8 years ago

Please test latest release.