tag:support.markedapp.com,2011-09-11:/discussions/questions/277-a-novel-manuscript-cssMarked: Discussion 2016-08-11T03:37:33Ztag:support.markedapp.com,2011-09-11:Comment/204619252012-11-05T17:54:03Z2012-11-05T17:54:03ZA novel manuscript CSS?<div><p>I've helped a couple of people work out styles for this, but
never anything that was distributable. I'll see what I can do.</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252012-11-07T09:14:05Z2012-11-07T09:14:07ZA novel manuscript CSS?<div><p>Thanks, Brett.</p>
<p>Even a hacky version would be much appreciated and would
certainly earn an acknowledgement in the Thanks section of my next
book! :-)</p>
<p>best,</p>
<p>-- Hannu</p></div>Hannu Rajaniemitag:support.markedapp.com,2011-09-11:Comment/204619252012-11-07T16:15:35Z2012-11-07T16:15:35ZA novel manuscript CSS?<div><p>Try out the attached and let me know how it works. I'm willing
to work with you on any changes needed and will include the result
in the next release.</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252012-11-08T17:08:49Z2012-11-08T17:08:49ZA novel manuscript CSS?<div><p>Just realized you probably want the indentation as well. I'll
upload a new version with that soon.</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252012-11-12T16:11:31Z2012-11-12T16:11:31ZA novel manuscript CSS?<div><p>Dear Brett,</p>
<p>Many thanks for your efforts - this is an excellent starting
point and already very useful.</p>
<p>Something else that would be useful in a novelistic context
would be replacing sub-headings below a certain level (###'s, say)
with a scene separation marker (usually #).</p>
<p>But this is much appreciated and it has already increased my
Marked use.</p>
<p>best,</p>
<p>-- Hannu</p></div>Hannu Rajaniemitag:support.markedapp.com,2011-09-11:Comment/204619252012-11-22T03:09:38Z2012-11-22T03:09:38ZA novel manuscript CSS?<div><p>Semantically, would it make more sense to turn horizontal rules
into # breaks?</p>
<pre>
<code> ---</code>
</pre>
<p>would become a centered #</p>
<p>What do you think? Do you use hr's anywhere else in a
manuscript?</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252012-11-22T09:27:36Z2012-11-22T09:27:37ZA novel manuscript CSS?<div><p>Dear Brett,</p>
<p>While that might be aesthetically pleasing, I'm not sure it
makes sense from a structural point of view: at least for my
purposes (and for ensuring compatibility with Scrivener etc.) it's
quite important to keep scenes as structural elements of the
document one can then move around and manipulate (e.g. in
FoldingText). So I would prefer to have a level below which
headings get converted into scene separators (#, or simply a space
- # is standard in most manuscript submission formats).</p>
<p>Personally I don't find myself using horizontal lines an awful
lot.</p>
<p>Thanks again for your help!</p>
<p>best,</p>
<p>-- Hannu</p></div>Hannu Rajaniemitag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T02:28:58Z2013-04-09T02:29:00ZA novel manuscript CSS?<div><p>Sorry to revive an old topic, but I have started using this
stylesheet too and it is a great start toward something that I
would be surprised if many other people didn't want too. For me the
only things missing are paragraph indent as you already mentioned,
and perhaps bringing the left and right margins in slightly. This
Wikipedia page gives a great summary of what is required: <a href=
"http://en.wikipedia.org/wiki/Manuscript_format">http://en.wikipedia.org/wiki/Manuscript_format</a></p>
<p>Thank you for your efforts so far,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T03:10:24Z2013-04-09T03:10:24ZA novel manuscript CSS?<div><p>This is where it's at right now. It's being included in the next
version of Marked, but I'm happy to share the CSS if you'd like.
Feedback is welcome:</p>
<p><img alt="" src="http://ckyp.us/SozC+"></p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T03:56:21Z2013-04-09T03:56:23ZA novel manuscript CSS?<div><p>Thanks Brett, looking forward to your next release. :)</p>
<p>I've been playing around a bit myself with the CSS. I found that
the iA Writer team had also produced some CSS specifically designed
to be used with Marked (<a href=
"http://support.iawriter.com/help/discussions/mac-suggestions/381-literary-indention">http://support.iawriter.com/help/discussions/mac-suggestions/381-li...</a>)</p>
<p>The only real change that I can see is required now is
(somehow!) not indenting the first paragraph of a chapter (possibly
quite hard) and (presumably easier) removing the additional space
between paragraphs so that all the lines are evenly spaced as you
scan down the page -- part of the standard manuscript format ("No
extra space between paragraphs").</p>
<p>Thanks for your prompt reply,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T03:59:30Z2013-04-09T03:59:30ZA novel manuscript CSS?<div><p>Second part is definitely easier. It's possible to target the
first paragraph after a header with CSS, so I might be able to make
that work. I'd have to assume that a certain header level was
always a chapter header, though… if h1 is a title, are h2
chapter headers for you?</p>
<p>-Brett</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T04:01:37Z2013-04-09T04:01:41ZA novel manuscript CSS?<div><p>Yes, I always use h2 for chapter headers, so that would be
perfect.</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-09T05:03:34Z2013-04-09T05:03:35ZA novel manuscript CSS?<div><p>One other thing I noticed is that a paragraph doesn't appear on
a printed page unless the whole paragraph can fit, otherwise it is
pushed to the following page. I'm not sure if anything can be done
about this. Also, I'm happy to work with you to get this refined
for the next release. Feel free to email me directly if you want to
bounce a few versions of the CSS back and forth.</p>
<p>Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T01:03:36Z2013-04-10T01:03:39ZA novel manuscript CSS?<div><p>Hi again. Sorry to be a pain, just starting to see how this
stylesheet could be a real asset to the novel writing community if
we get it right. :) It seems to me that blockquotes probably
shouldn't be indented either (like the first paragraph). I guess
this could be achieved by using the special "first paragraph"
styled</p>
<p>tag instead?</p>
<p>I'm happy to continue to have a play with the CSS and send you
some versions to see what you think, but I presume some of this is
going to require modifications to the code that produces the HTML.
Is this something that is user editable or something you would need
to do?</p>
<p>Regards,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T01:13:31Z2013-04-10T01:13:31ZA novel manuscript CSS?<div><p>My goal is no modifications to the markup that can't be avoided.
Pure CSS solutions are preferable, so we'll keep working in that
direction. Feel free to send anything you come up with my way.</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T01:44:47Z2013-04-10T01:44:48ZA novel manuscript CSS?<div><p>Apologies if this post turns up twice, I think the previous
didn't succeed. I can understand not wanting to modify the markup,
I'm just not sure how to change the style of the first paragraph
using CSS only. Do you have any thoughts on how this could be
achieved?</p>
<p>If you do change the markup engine, I was thinking that maybe a
single checkbox with "Uniquely style first paragraph" could be
added to Behaviour tab in preferences and then use</p>
<p class="first">or something for those paragraphs so custom CSS
could be created.</p>
<p>It would be good if blockquotes also used this</p>
<p class="first">style but I can understand how that might clash
with coders using Marked. I am of course speaking from my selfish
perspective. ;)</p>
<p>I've attached my version of the CSS. It is really just your
original with some inclusions from the iA Writer CSS and some minor
additional tweaks (margins etc). I use H1 and H3 for Title and
Author respectively so I have changed these to be centred.</p>
<p>Other than the page headers, this pretty much now matches the
Wikipedia manuscript spec referenced earlier.</p>
<p>Regards,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T01:53:35Z2013-04-10T01:53:35ZA novel manuscript CSS?<div><p>The thing is, an HTML document isn't structured data. I don't
know from a Markdown file where the chapter breaks are or what the
first paragraph of a chapter is when looking at a list of elements
all in a row. Thus, it really has to be done via CSS, and anyone
using it is going to have to know the rules: e.g. ## 2nd level
header is a section, ### 3rd is a chapter, etc. CSS3 pseudo
selectors allow me to find the first p element following an h3, for
example, and apply a style to it. I think we can make that
work.</p>
<p>I can also do it in jQuery by scanning the DOM, but that's much
less portable when exporting documents.</p>
<p>To do it in CSS, assuming 3rd level headers lead each
chapter:</p>
<p>h3+p {}</p>
<p>would target the first paragraph after the headline. This only
works if there's nothing between the headline and the paragraph (no
rules, lists, images, etc.).</p>
<p>-Brett</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T01:56:16Z2013-04-10T01:56:16ZA novel manuscript CSS?<div><p>Hi Brett</p>
<p>That's fabulous, I didn't know about the h3+p syntax. I'll have
a play and get a new version of the CSS back to you.</p>
<p>Thanks so much,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T02:06:00Z2013-04-10T02:06:02ZA novel manuscript CSS?<div><p>You're a genius Brett, the attached CSS works perfectly for
me.</p>
<p>Thanks for bearing with me,<br>
Stuart</p></div>Stuarttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T04:22:36Z2013-04-10T04:22:37ZA novel manuscript CSS?<div><p>Sorry, one last tweak. Changed the page-break section so that
paragraphs can be split across multiple pages to avoid lots of
whitespace and it looking like the reader had got to the end of a
chapter when they hadn't.</p>
<p>img, pre, blockquote, table, figure { page-break-inside: avoid;
}</p>
<p>p { page-break-inside: auto; }</p>
<p>Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T04:42:59Z2013-04-10T04:43:00ZA novel manuscript CSS?<div><p>Hopefully final version...</p>
<p>This one has the 10px margin on the wrapper element removed that
was being added to the 1 inch margins on the body and therefore
making them oversized.</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T07:15:46Z2013-04-10T07:15:48ZA novel manuscript CSS?<div><p>Okay, so I'll stop promising last change, I hope this isn't
starting to seem spammy.</p>
<p>One last thing I noticed is that most novels use a blank line to
designate a scene change within a chapter. To achieve this I have
used the</p>
<hr>
tag. This may not be to everyone's taste because it prevents
<hr>
s from being display, they just appear as three blank lines (due to
the rest of the text being double spaced), but given that
horizontal rules are mostly used for scene breaks anyway this
probably isn't such a problem.
<p>Anyway, code added is below, full stylesheet attached.</p>
<p>Stuart</p>
<p>hr {<br>
margin-top: 3em; border: none; }</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-10T14:18:27Z2013-04-10T14:18:27ZA novel manuscript CSS?<div><p>Ok, I think I got all of your changes incorporated into the
version of Manuscript I want to include in the next release. Please
try out the <a href="http://ckyp.us/vGaS">custom style</a> and let
me know if it looks right.</p>
<p>The style includes some embedded web fonts (Courier Prime), so
it's a little big for editing. If you do want to make changes, feel
free, just note that some editors with syntax highlighting will
choke on it.</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-11T01:00:32Z2013-04-11T01:00:35ZA novel manuscript CSS?<div><p>Hi Brett, thanks for that. The embedded fonts are really handy.
Do these also get embedded in the PDF? I know that is a requirement
for a lot of print on demand services.</p>
<p>I tested the new version and it looks pretty close. There are
only two small things I noticed. The are getting the first line
indented. I had added:</p>
<p>blockquote p {<br>
text-indent: 0; font-style: italic; }</p>
<p>So that paragraphs inside blockquotes were treated like first
paragraphs. I also had the first paragraph after a blockquote not
being indented either using</p>
<p>blockquote+p {<br>
margin: 0; text-indent: 0; }</p>
<p>The only other slight thing I noticed is that the test document
I am using has grown by three pages, I believe due to oversized
margins. I originally experienced this same result when I had a 1
inch margin on the body tag and a 10px margin on the #wrapper. I
didn't notice the 10px margin in your version but it looks like
some extra margin about the same size has crept in somewhere as it
was exactly three pages that I lost when I removed that.</p>
<p>Thanks,<br>
Stuart</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-11T13:56:29Z2013-04-11T13:56:29ZA novel manuscript CSS?<div><p>I'm not sure how the Webkit PDF actually handles the fonts, but
they do appear to be embedded. I'll do some more checking on
that.</p>
<p>Fixed the blockquotes per your notes.</p>
<p>I tested on a document that rendered with 51 pages using the
last version of your CSS, and got 51 pages with mine. Can you send
me a test document that you're seeing grow 3 pages?</p>
<p>-Brett</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-04-11T18:23:03Z2013-04-11T18:23:03ZA novel manuscript CSS?<div><table>
<tr>
<td></td>
</tr>
</table></div>Tristan
yroftag:support.markedapp.com,2011-09-11:Comment/204619252013-04-11T20:27:01Z2013-04-11T20:27:02ZA novel manuscript CSS?<div><p>Thanks Brett</p>
<p>It's embarrassing to admit, but I may have just added three more
pages to the novel between rounds of testing...</p>
<p>Does that original download link you sent me now point to the
updated version?</p>
<p>Regards,<br>
STuar</p></div>Stuart Allentag:support.markedapp.com,2011-09-11:Comment/204619252013-04-11T21:19:22Z2013-04-11T21:19:22ZA novel manuscript CSS?<div><p>Not yet, I'll post it for you tonight.</p>
<p>-Brett</p></div>Bretttag:support.markedapp.com,2011-09-11:Comment/204619252013-06-08T03:33:04Z2013-06-08T03:33:06ZA novel manuscript CSS?<div><p>Hi,<br>
I'm looking too about a novel manuscript CSS; I gave a try to the
file you provide...<br>
maybe there is something i'm doing wrong, but the file
Manuscript.CSS doesn't seem to work as expected. When choosing this
style, its no even in courier, double space, 12px...</p>
<p>Regards</p>
<p>Félix</p></div>Felixtag:support.markedapp.com,2011-09-11:Comment/204619252013-06-29T05:42:10Z2013-06-29T05:42:13ZA novel manuscript CSS?<div><p>Just a quick note- thanks so much for this! Looking for a novel
template and learnt a lot from the css file!</p>
<p>Ben</p></div>Ben Craib