ianmcburnie/jekyll-comic-script-style

CSS to convert Jekyll README format into formatted script for comics/graphic novels.

jekyll-comic-script-style

CSS I have been using to style Jekyll Markdown format as formatted script for comics/graphic novels (similar, but not exactly the same, as a movie screenplay).

view the source code

Page Template

The default Jekyll theme creates an article tag around the content.

<article class="post-content">
    {{ content }}
</article>

Article tag isn't really the best choice for this content (remember, Jekyll is a blog templating engine) - so I will change this to a simple div in future.

Markdown Example

Write your script in the following format.

1. INTRO - Valet

    1. A modest, single-story casino lies nestled among the huge, redwood trees of an old mountain highway. The neon lights read "Tommy's Casino".

        > "The family you came from isn't as important as the family you're going to..."

    1. A silver Mercedes approaches the main driveway of the casino. Behind the tint of the windows, the driver's features remain indistinguishable.

        > "...at least, that's what somebody once told me."

    1. We see Martin, a young valet attendant standing outside the Casino entrance. He is smartly dressed in charcoal trousers, black shoes, burgundy waistcoat and white shirt. He is around 5,10". His short dark hair is swept back and to one side, framing his youthful, handsome face. A name badge is pinned to his breast pocket. A small desk/podium stands beside him. Littered about it's surface are papers, business cards and a clunky looking cell phone.

        > "My uncle put me to work at the valet as soon as I was old enough to drive."

    1. View from inside the silver car pulling up to attendant. We only see the driver's hands on the wheel. His pudgy fingers are adorned with large, ugly rings. A sign by the curb reads 'Valet Parking'.

        > "I've always loved cars."

    1. The driver, Dick, has stepped out of the car and is passing the keys to the young attendant. The car door remains open. Dick is portly, and has a wheezing red-face. Somewhere around 50 years old. He wears western, cowboy style attire that is one size too small for him. Cream trousers and a cream shirt. Brown sweat stains. The man oozes sleaze.

        > "I've had a fascination with them ever since I was a young boy."

        - DICK
            - Take good care of it boy

    1. Closeup of Martin's hand taking the key. The key loop placed over one finger. The key is in the shape of a naked lady. We see the boy's name badge, it reads 'MARTIN'.

        > "Some would even say a morbid fascination."

    1. Dick walks through the automatic double doors of the casino entrance. Behind him is the roar of the car engine.

        > "Everyone in town knew what my father had done."

        - SFX
            - Vrrrrrrroooooooooom!

    1. Dick stops and turns around, his face flustered and angry. The car screeches off.

        > "And how his brother, my uncle, stepped in and raised me as his own."

        - DICK _under his breath_
            - That little bastard

1. INTRO - Garage

    1. The silver car is at a parking garage gate. Martin's hand reaches out of the driver side window, taking a ticket from the machine.

        > "He gave me a roof over my head."

    1. The gate rises and the car accelerates into the large indoor parking garage ahead.

        > "He gave me a *big* roof over my head."

    1. The silver car accelerates down the straight section. There are cars parked on either side.

        > "With all the cars I ever wanted."

        - SFX
            - Vrrrrrrrrrroooooom

    1. The silver car brakes sharply, it's tires screeching on the polished surface. We see an up ramp to the roof level, the twinkling stars visible above, and a down ramp, with only darkness below.

        > "I have a rooftop balcony, where I sit and watch the stars at night."

        - SFX
            - Screeeeeech!

    1. The silver car turns sharply to take the down ramp, wheels squeaking loudly again.

        > "But best of all, I have my own basement."

    1. View from bottom of down-ramp as the large, silver car descends the steep incline. The bright glare of the headlights drowns us in light.

        > "It's all a kid ever wanted."

    1. There are no overhead lights on in the basement, so we see very little. There don't appear to be any other valet cars parked here. The silver car rolls along slowly.

        > "Nobody ever disturbs me down here."

    1. We now see an illuminated corner of the parking garage. There is a collection of cars and bikes and other assorted machinery. They look like they have been worked on by a mechanic. Some have doors missing, or their engines stripped. Others are jacked up without wheels.

        > "I mostly have the place to myself."

    1. As the car slows to a halt, we see a closeup of the spinning gyration of the hub cap. It's polished silver surface seems to reflect the hazy form of a young child standing by the car.

        > "Mostly..."

Example excerpt taken from Death Valet.