[Top][All Lists]
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
Re: [Orgmode] export and containers
From: |
Sebastian Rose |
Subject: |
Re: [Orgmode] export and containers |
Date: |
Mon, 02 Mar 2009 17:00:56 +0100 |
User-agent: |
Gnus/5.13 (Gnus v5.13) Emacs/23.0.91 (gnu/linux) |
OK - I failed badly :-(
I think we can skip the extra <div> element around the TOC.
Here's why:
As it looks now, the problem with the fixed TOC does not go away. My
old trick seems to work only for HTML doctype and/or tables... Should
have tested that one before...
So until now it's not getting any better - but more complicated.
And all those stlyes in the stylesheet become confusing :-/
The main problem is the height of the TOC on orgmode.org. The <div>
element grows and shrinks in height when we resize the window.
Unfortunately, we can't set the height property to 100% because of the
unicorn. Instead I set it to 60% to support Netbooks - but 60% will be
too high if the window is resized to be under a certain height. And
60% is low, if the window fills a bigger screen (> 17')
Seems I can't solve that by adding structural elements. The only
element I could think of would be a table with height=100% and the
unicorn in the first row (fixed height), TOC in the second row (no
height property).
Most of this seems to be true for the other containers I thought of.
Just one around everything and one around the all the sections and
footnotes seems to make sense so far.
Maybe someone finds another way of `skinning' the XHTML output in the
future.
How about adding custom HTML before and after writing the main
containers?
Can't we something like this here ? :
(defun my-export-add-custom-html(when, which)
"when is either 'before' or 'after', which is one of:
- 'body'
- 'title'
- 'toc'
- 'contents'
- 'lot'
..."
(when (string= "body" which)
(if (string= "before" when)
"<div id="\"wrap\">")
"</div>")
)
In org-publish-project-alist:
:custom-html-funcion my-export-add-custom-html
and perhaps:
:org-export-html-sequence '("title" "toc" "content" "footnotes")
;; getting wild and offtopic:
:custom-id-function my-org-id-was-found
That way the output would win flexibility and get closer to an generic
export. One could implement a table based layout, or reuse containers
from the CMS the pages should be used in. Not to forget `<?php
..... ?>' or similar.
We would lose the guaranty that anything validates or org-info.js works
with the resulting structure though. But we could provide different
`themes' on Worg which are guarantied to work (and enhanced by the
comunity).
Or is all this completely weired?
Best,
Sebastian
Carsten Dominik <address@hidden> writes:
> OK, so I will wait with making changes until you have
> done some experimentation, maybe put that up somewhere,
> so that others can have a look?
>
> - Carsten
>
> On Mar 2, 2009, at 12:58 PM, Sebastian Rose wrote:
>
>> Carsten Dominik <address@hidden> writes:
>>> Hi Sebastian,
>>>
>>>
>>> On Mar 2, 2009, at 10:29 AM, Sebastian Rose wrote:
>>>>
>>>> * Suggestions for names
>>>>
>>>> `wrap' is, what they use in typolight and some other CMSs. But
>>>> `content' sounds good to me too.
>>>>
>>>> <div id="center">
>>>> <div id="wrap"><!-- or `content' -->
>>>>
>>>> <div id="box-1">
>>>> <div id="table-of-contents">
>>>> ...
>>>> </div>
>>>> </div><!-- end of box-1 -->
>>>>
>>>> <div id="box-2">
>>>> <div id="outline-container-2" class="outline-2">
>>>> <h2 id="sec-1"><span class="section-number-2">2</span>
>>>> Konfiguration
>>>> </h2>
>>>> <div class="outline-text-2" id="text-2">
>>>> ...
>>>> </div>
>>>> </div>
>>>> ... more sections, footnotes ...
>>>> </div><!-- end of box-2 -->
>>>>
>>>> <div id="postamble">
>>>> postamble
>>>> </div>
>>>>
>>>>
>>>> </div><!-- end of wrap -->
>>>> </div><!-- end of center -->
>>>
>>>
>>> How about these names for additional divs
>>>
>>> content-wrap
>>> content ;; I think we should just have one around the entire
>>> content.
>>> ;; should this also contain the <h1> with the page title?
>>> ;; I think yes
>>
>> OK, one might be enough. There's a cross-browser CSS to center the contents
>> vertically with only one container:
>>
>> #content-wrap
>> {
>> ...
>> margin-top:auto;
>> margin-bottom:auto;
>> vertical-align:middle;
>> ...
>> }
>>
>> And yes, the title should be inside `content-wrap'
>>
>>> table-of-contents-wrap
>>>
>>> footnote-wrap
>>> bibliography-wrap
>>> postamble-wrap
>>>
>>> So we put all the stuff into specific "wrap" containers.
>>> I don't so much like "column-1", because that looks fine
>>> if you use it for columns, but it looks confusing if you
>>> use it for something else...
>>
>>
>> Agreed.
>>
>> How about `org(-container ?) for the outer most container? Think of
>> exporting the content only for inclusion into some framework. In that
>> case `org' seems a natural name.
>>
>> Anyway, for sake of the TOC on the left, we should also wrap all the rest
>> of the contents in one <div> with postamble being the only exception.
>>
>> The tree would simply be:
>>
>> org
>> title
>> table-of-contents-wrap
>> table-of-contents
>> content-wrap
>> sec-1... - unchanged
>> footnotes - unchanged
>> bibliography
>> postamble // already there
>>
>> The reason for the container around everything excluding title, TOC and
>> postamble is, that I don't want the TOC to live in the left margin of
>> the <body>, the way it does now.
>>
>> `float:left' for the TOC will cause the page to look funny in the most
>> cases:
>>
>> +-----+--------------+
>> | TOC | TITLE |
>> +-----+ SEC-1 |
>> | SEC2 |
>> | SEC2 |
>> | FOOTNOTES |
>> +--------------------+
>> | POSTAMBLE |
>> +--------------------+
>>
>> Better:
>>
>> +-----+--------------+
>> | TOC | TITLE |
>> | | SEC-1 |
>> | | SEC2 |
>> | | SEC3 |
>> | | FOOTNOTES |
>> +--------------------+
>> | POSTAMBLE |
>> +--------------------+
>>
>>
>> And this one here would be nice (all navigational elements visible on
>> load):
>>
>> +-----+--------------+-----+
>> | TOC | TITLE | LOT |
>> | | SEC-1 +-----+
>> | | SEC2 | LOF |
>> | | SEC3 +-----+
>> | | FOOTNOTES | BIB |
>> +-----+--------------+-----+
>> | POSTAMBLE |
>> +--------------------------+
>>
>> Some people (see drupal) put the postamble into the right/center column
>> for two and three column layout respectively. I don't like that very
>> much.
>>
>>
>>
>>
>> What we should do before we change anything, is to experiment with one
>> simple document and different stylesheets, to ensure everything works
>> the way we want it to.
>>
>> I'll set up some with the different aproaches and try to add different
>> CSS stylesheets. Our aim must be to make many different layouts possible
>> (we will never make _all_ possible layouts feasable though).
>>
>>
>>
>> Important layouts are:
>>
>> | Name | example |
>> |-------------------------+------------------|
>> | Fixed TOC | orgmode.org |
>> | Floating TOC | orgmode.org/worg |
>> | Please add more here... |
>>
>> The usual page-flow will always stay what it is as long as no special
>> styles are added.
>>
>>
>> Best,
>>
>> Sebastian
>>
>>
>>> - Carsten
>>>
>>>>
>>>>
>>>>
>>>>
>>>>>>
>>>>>> <div id="column-1"> -- Help with fixed TOC
>>>>>> <div id="table-of-contents">
>>>>>> the toc
>>>>>> </div>
>>>>>> </div>
>>>>>>
>>>>>> <div id="column-2"> -- Help with fixed TOC
>>>>>> All the rest of the content goes here
>>>>>> </div>
>>>>>>
>>>>>> <div id="postamble">
>>>>>> postamble
>>>>>> </div>
>>>>>>
>>>>>> </div>
>>>>>> </div>
>>>>>> </body>
>>>>>>
>>>>>>
>>>>>>
>>>>>> Having two boxes for the TOC would make the fixed TOC work in IE. In
>>>>>> general, I prefere to use two kinds of Boxes:
>>>>>>
>>>>>> - one for positioning, floating and so on. This one should have _no_
>>>>>> padding or margin at all!
>>>>>
>>>>> Can one not simply use .body for that?
>>>>>
>>>>>> - one for margin, padding, styling.
>>>>>>
>>>>>> I found, this is the only way to reliably enforce a layout across
>>>>>> browsers.
>>>>>>
>>>>>>
>>>>>> column-1 and column-2 are for that very reason. All we can do to put the
>>>>>> TOC to the left or right is, to add margins to the body or the level 1
>>>>>> contents, and place it there. This is, what causes the problems with the
>>>>>> fixed TOC in IE. `column-1' and `column-2' (and `postamble') make it
>>>>>> possible, to adjust the layout in various common ways.
>>>>>>
>>>>>> The `percent-50' (oh what a name) and `wrap' are just there, to be able
>>>>>> to center the whole page horizontally _and_ veritcally.
>>>>>
>>>>>>
>>>>>>
>>>>>> Best,
>>
>> --
>> Sebastian Rose, EMMA STIL - mediendesign, Niemeyerstr.6, 30449 Hannover
>> Tel.: +49 (0)511 - 36 58 472
>> Fax: +49 (0)1805 - 233633 - 11044
>> mobil: +49 (0)173 - 83 93 417
>> Email: address@hidden, address@hidden
>> Http: www.emma-stil.de
>
--
Sebastian Rose, EMMA STIL - mediendesign, Niemeyerstr.6, 30449 Hannover
Tel.: +49 (0)511 - 36 58 472
Fax: +49 (0)1805 - 233633 - 11044
mobil: +49 (0)173 - 83 93 417
Email: address@hidden, address@hidden
Http: www.emma-stil.de
- Re: [Orgmode] export and containers, Richard Riley, 2009/03/02
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/02
- Re: [Orgmode] export and containers, Carsten Dominik, 2009/03/02
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/02
- Re: [Orgmode] export and containers, Carsten Dominik, 2009/03/02
- Re: [Orgmode] export and containers,
Sebastian Rose <=
- Re: [Orgmode] export and containers, Carsten Dominik, 2009/03/02
- Re: [Orgmode] export and containers, Richard Riley, 2009/03/02
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/02
- Re: [Orgmode] export and containers, Richard Riley, 2009/03/02
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/02
- Re: [Orgmode] export and containers, Richard Riley, 2009/03/02
- Re: [Orgmode] export and containers, Carsten Dominik, 2009/03/03
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/03
- Re: [Orgmode] export and containers, Carsten Dominik, 2009/03/03
- Re: [Orgmode] export and containers, Sebastian Rose, 2009/03/03