asciidoctor-epub3 icon indicating copy to clipboard operation
asciidoctor-epub3 copied to clipboard

Font for verse block

Open boydkelly opened this issue 3 years ago • 1 comments

I found that using a [verse] block that is rendered with the M+ 1mn font. This was a particular problem not only as it is fixed width (subjective but I would prefer a varialble width font), but more importantly it does not support the extended latin characters I need.
With the Foliate reader on linux there was some substitution happening but the result was unacceptable. With Calibre the missing glyphs were substituted with Déjà vu, and this was fine. But on Android (Lithium Reader) no glyphs were rendered at all.

I started by trying to customize the font and realized thats not possible, but did come up with an acceptable solution. So all ok here. You can probably close this immediately. But my suggestion is that verse by default doesn't look like code.... And it would be awesome to customize any fonts. (I realize there is an issue open). Thanks!!

in the epub3.css file on line 52 I added the M+ p1 font family for div.verse . pre

/* TODO we may want to reenable hyphens here, but not for kf8 */                                                                                 
div.verse > pre {
  font-family: "M+ 1p", sans-serif !important;
  background-color: transparent;
  border: none;
  font-size: 1.2em;
  text-align: center;
}

Otherwise the verse style is grabbing the defined font-family from epub3-css3-only.css

/* QUESTION what about nested elements inside code? */    
body code, body kbd, body pre, pre :not(code){    
  /* !important required to override custom font setting in Kindle / Gitden / Namo */    
  /* Gitden requires the extra weight of a parent selector */    
  /* Kindle and Gitden require the override on pre child elements */    
  font-family: "M+ 1mn", monospace !important;    
}    

boydkelly avatar Apr 07 '21 12:04 boydkelly

I agree using a prose font for verse (while still preserving spaces) is the right strategy. We made a similar switch in the HTML converter. See https://github.com/asciidoctor/asciidoctor/commit/2640a9938bd76dd5f577910117776f847962b41b

mojavelinux avatar Apr 07 '21 19:04 mojavelinux