CSS Override Code

[amalthia]

This post is to help anyone who'd like to modify the style or look of the epubs downloaded at the A03 Archive.

I made a new "Extra CSS" code to use in Calibre to convert the A03 epubs to epub. I also found out how to remove underlines on the Chapter links and turn the font back. The purpose of the reconverting is to remove the blank paragraph space and replace it a indent at the start of a new paragraph. During the tests I also found out how to remove the underline on the Chapters so it looks more like a heading and less like a link. That was something I found kind of neat because the links still work. :) But they don't look like links.

Here is the code:

body { margin: 0; }
a {text-decoration: none; color: black;}
a [href] {text-decoration: none; color: black;}
p {margin-top: 0pt; margin-bottom: 0pt; padding: 0pt; text-indent: 15pt; text-align: justify;}
h1 { text-align: center;}
h2 {text-align: center; }
h3 { text-align: center;}
h4 { text-align: center; }
h5 { text-align: center; }
h6 { text-align: center; }

And here's more information on the Look and Feel section of Calibre.

I've found that converting epub2epub gave me the best results.

I wasn't sure if I was the only one that preferred indents over the space but just in case I thought I should share.

Comments

[mremre.livejournal.com]

ILU! ::grabby hands::

Now if only more epic fic is reposted on AO3... =)

[amalthia]

There is! well I've found stories around 150k words long. I think it depends on the fandom.

[mremre.livejournal.com]

Oh! http://www.tthfanfic.org has a download ePub function too... do you have any advice on converting that? It comes in a zipfile of HTML chapter files... Is that reformattable? How does that work?

[amalthia]

You know I think if you download the epub version the same css stylesheet may work. However...that's only if the author uploaded their story using < p > tags. If they used < br > the code will not work. I've seen lots of stories that are < br > < br >

But I can test this out. Because I love that archive!

[amalthia]

Okay I tested and it's not working. The site is using break tags instead of paragraph tags. The only way to fix that would be switch out all the break tags which would require the use of an epub editor or opening the files in winrar and then from their opening the contents in Notepad ++ to find and replace.

All the files I've tested at A03 had paragraph tags. I'm not sure if every story uses them or if the site automatically translates the break tags to paragraph tags but for css stylesheets to work and skins you have to use proper html coding and well using break tags to create paragraphs isn't proper coding.

[thedorkygirl.livejournal.com]

Couldn't you replace your CSS with "br br" -- that worked for me when I played with CSS in high school

[thedorkygirl.livejournal.com]

I meant "p" with "br br"

[amalthia]

Can you share the css code to do that? I'm still not an expert at css so there are things I still do not know.

[thedorkygirl.livejournal.com]

I would make it exactly like this

p {margin-top: 0pt; margin-bottom: 0pt; padding: 0pt; text-indent: 15pt; text-align: justify;}

br br {margin-top: 0pt; margin-bottom: 0pt; padding: 0pt; text-indent: 15pt; text-align: justify;}

The first to get any paragraph codes standing alone. The second to get the line breaks being used as paragraph codes (which is what most wordpad to html programs like to do -- the olders ones I used, at least, ten years ago; it's been that long since I've played with CSS, or nearly!!)

[thedorkygirl.livejournal.com]

Also you don't need the a [href] because there's no difference there between it & the main attribute; you should be able to cover all link codes with just the a attribute alone. Unless for some reason there is a glitch that I don't know/can't see.

[thedorkygirl.livejournal.com]

...such as a style difference in the primary CSS page, derrr!

[amalthia]

I think the reason I added the href is because I'd hit a site that for some reason would not remove the underline or change the font color to black for links. Once I added the href option it worked though. I can't recall what site it was anymore but I kind of kept it in there since. It doesn't seem to hurt anything.

[amalthia]

will this work when the break tags aren't on the same line or back to back?

[thedorkygirl.livejournal.com]

I'm not sure - you'll have to play around. I haven't messed about with a website in about five years :)

[amalthia]

I also rarely do web design. Though with all the css in ebooks I might as well be! :)

[thedorkygirl.livejournal.com]

I'm assuming that you can make a basic HTML document & CSS page and link the two?

[amalthia]

I make a basic html document and then use the CSS override in Calibre to add the attributes I want to the paragraphs, headers, and etc...It's much easier to edit a lot of files that way. :)

[haikitteh.livejournal.com]

Thank you so much! I also prefer indents to the space. I'm usually pretty incompetent with Calibre beyond the most rudimentary commands, but I'm going to give it a whirl!

[amalthia]

Good luck! and I hope it works. :)

[whispersecho.livejournal.com]

You seem to have a handle on the Calibre css... I've been trying to re-format .pdf files into .epub and it's not playing nice. What I'd like it to do:
-NOT put a blank line between *each* paragraph (eg I don't want internet/fanfic formatting where each paragraph starts not-indented with a blank line between)
-indent each paragraph (EXCEPT the first of a new chapter, or after a "double return" {ie blank line between one paragraph and the next}),
-be able to selectively "blockquote" sections (inset right and left, and control font size)

What it *actually* does:
-indent each paragraph, but remove spacing between *all* paragraphs including places where it 'changes scene/location' and needs a space

I haven't been able to effectively "blockquote".
And, of course, there's just some rather bad formatting of the original PDFs.

Any help would be SPECTACULARLY appreciated.
Thanks!

[amalthia]

My recommendation and I think 99.9% of the people at Mobile Read would recommend this too, is to first convert your PDF to an html file and then edit the html code. PDFs never convert well and you could spend hours and days trying to get one file to look close to what the author originally intended.

I gave up on using Calibre to convert PDFs two years ago. Now if I have no other choice I open the PDF in Adobe Acrobat Professional and save as an html or RTF file. Once you have your paragraphs set in the html it's much easier to get the file to look the way you want.

If you can find the PDF in another format first that would be even better because I'm not going to lie that conversion is going probably not going to be easy to edit. There is a reason I wrote that super long post not too long ago about why I hate PDF and do not like that so many fan fiction authors are sharing fics in that format thinking it's an ebook format.

Blockquote and everything else is generally easier to create in the html file, though I haven't actually used blockquote myself but I know you can use css and create a paragraph tag with an even bigger indent compared to regular paragraphs.

The only person I know that's an expert with PDFs is elfwreck. Though she may also say find the original source file and start from scratch and save yourself the headache/time. But if there is a way to convert that PDF so it looks okay she'd be the one to know how to do it.

Sorry I couldn't be of more help.