org-notes-style

Introduction

org-notes-style is a light CSS theme for Org mode. It provides a stylesheet to style your exported HTML documents.

This HTML page is styled with org-notes-style from its org source file. Check more examples at here.

Features

Pure HTML5 and CSS3
Responsive web design

Installation

Requirements

It requires Org mode of version 8.2.5h or above. To install the latest Org mode in Emacs 24, please refer to http://orgmode.org/elpa.html

Configuration

Add following settings to your org documents.

# Turn off default internal styles
#+OPTIONS: html-style:nil html5-fancy:t

# Exporting to HTML5
#+HTML_DOCTYPE: html5
#+HTML_HEAD: <meta http-equiv="X-UA-Compatible" content="IE=edge">
#+HTML_HEAD: <meta name="viewport" content="width=device-width, initial-scale=1">

# Add notes.css here
#+HTML_HEAD: <link href="https://taopeng.me/org-notes-style/css/notes.css" rel="stylesheet" type="text/css" />

A better option is to save all the settings in a single org file (let's say ~/org/notes-style.org), and then include this file in your org documents:

#+SETUPFILE: ~/org/notes-style.org

Development

org-notes-style is develped based on the Compass framework. To setup the development environment:

$ git clone [email protected]:ptpt/org-notes-style.git
$ cd org-notes-style
$ compass watch