On Feb 24, 2013, at 11:03 AM, Sebastian Wiesner <lunary...@gmail.com> wrote:
> Hello, > > how is the online manual of Org mode [1] rendered? Especially, how is > the awesome table of contents on the right sight created? It is done through CSS and I do something similar with most of my HTML exports. I have a custom CSS that I load by having the following in every Org file. #+begin_example #+HTML_STYLE: <link rel="stylesheet" type="text/css" href="/Users/mlm/Documents/OrgMaster/org/css/org-html.css" /> #+end_example Into my custom CSS I copied the TOC CSS from the Org mode home page (see below). I may have altered it slightly from what is on Org for colors and such, but I don't recall. #+begin_example @media screen { /* TOC inspired by http://jashkenas.github.com/coffee-script */ #table-of-contents { font-size: 10pt; position: fixed; right: 0em; top: 0em; background-color: #F3F5F7; -webkit-box-shadow: 0 0 1em #777777; -moz-box-shadow: 0 0 1em #777777; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; text-align: right; /* ensure doesn't flow off the screen when expanded */ max-height: 80%; overflow: auto; } #table-of-contents h2 { font-size: 10pt; max-width: 10em; text-decoration: underline; padding-left: 0.5em; padding-left: 0.5em; padding-top: 0.05em; padding-bottom: 0.05em; margin-bottom: 15px; border: none; } #table-of-contents ul { list-style-type: none; } #table-of-contents #text-table-of-contents { display: none; text-align: left; } #table-of-contents:hover #text-table-of-contents { display: block; padding: 0.5em; margin-top: -1.5em; } } @media print { /* TOC inspired by http://jashkenas.github.com/coffee-script */ #table-of-contents { font-size: 10pt; background: white; } #table-of-contents h2 { font-size: 10pt; max-width: 10em; text-decoration: underline; padding-left: 0.5em; padding-left: 0.5em; padding-top: 0.05em; padding-bottom: 0.05em; margin-bottom: 15px; border: none; } #table-of-contents ul { list-style-type: none; } #table-of-contents #text-table-of-contents { text-align: left; } #table-of-contents:hover #text-table-of-contents { display: block; padding: 0.5em; margin-top: -1.5em; } } #+end_example