Skip to content
forked from gnab/remark

A simple, in-browser, markdown-driven slideshow tool.

License

Notifications You must be signed in to change notification settings

Taku-Yamashita/remark

Folders and files

NameName
Last commit message
Last commit date

Latest commit

6510b3f · May 12, 2015
May 8, 2015
Apr 25, 2015
Dec 20, 2014
Mar 6, 2013
Mar 8, 2013
Jan 4, 2015
Jan 18, 2015
Feb 12, 2013
Sep 25, 2014
May 14, 2014
Dec 29, 2014
Jul 29, 2014
May 6, 2014
May 8, 2015
Sep 25, 2014
May 12, 2015
May 12, 2015

Repository files navigation

remark

Build Status

A simple, in-browser, markdown-driven slideshow tool targeted at people who know their way around HTML and CSS, featuring:

  • Markdown formatting, with smart extensions
  • Presenter mode, with cloned slideshow view
  • Syntax highlighting, supporting a range of languages
  • Slide scaling, thus similar appearance on all devices / resolutions
  • Touch support for smart phones and pads, i.e. swipe to navigate slides

Check out this remark slideshow for a brief introduction.

To render your Markdown-based slideshow on the fly, checkout Remarkise.

Getting Started

It takes only a few, simple steps to get up and running with remark:

  1. Create a HTML file to contain your slideshow (see below)
  2. Open the HTML file in a decent browser
  3. Edit the Markdown and/or CSS styles as needed, save and refresh!

Below is a boilerplate HTML file to get you started:

<!DOCTYPE html>
<html>
  <head>
    <title>Title</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <style type="text/css">
      @import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
      @import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
      @import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);

      body { font-family: 'Droid Serif'; }
      h1, h2, h3 {
        font-family: 'Yanone Kaffeesatz';
        font-weight: normal;
      }
      .remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; }
    </style>
  </head>
  <body>
    <textarea id="source">

class: center, middle

# Title

---

# Agenda

1. Introduction
2. Deep-dive
3. ...

---

# Introduction

    </textarea>
    <script src="https://gnab.github.io/remark/downloads/remark-latest.min.js">
    </script>
    <script>
      var slideshow = remark.create();
    </script>
  </body>
</html>

Moving On

For more information on using remark, please check out the wiki pages.

Real-world remark slideshows

On using remark:

Other interesting stuff:

Other systems integrating with remark

Credits

License

remark is licensed under the MIT license. See LICENSE for further details.

About

A simple, in-browser, markdown-driven slideshow tool.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 50.0%
  • JavaScript 49.7%
  • Other 0.3%