From fb25c1bb03e7f89e6485fb536432c65963406d00 Mon Sep 17 00:00:00 2001
From: Bernhard Posselt <dev@bernhard-posselt.com>
Date: Mon, 12 May 2014 00:55:00 +0200
Subject: [PATCH] add css docs on layout and navigation, fix #96

---
 developer_manual/app/css.rst | 40 +++++++++++++++++++++++++++++++++++-
 1 file changed, 39 insertions(+), 1 deletion(-)

diff --git a/developer_manual/app/css.rst b/developer_manual/app/css.rst
index 1f9257f62..cea018ac1 100644
--- a/developer_manual/app/css.rst
+++ b/developer_manual/app/css.rst
@@ -1,4 +1,42 @@
+===
 CSS
 ===
 
-.. sectionauthor:: Bernhard Posselt <dev@bernhard-posselt.com>
\ No newline at end of file
+.. sectionauthor:: Bernhard Posselt <dev@bernhard-posselt.com>
+
+The CSS files reside in the **css/** folder and should be included in the template:
+
+.. code-block:: php
+
+  <?php
+  \OCP\Util::addStyle('myapp', 'style');  // adds js/style.css
+
+Standard layout
+===============
+To use the commonly used layout consisting of sidebar navigation and content the **app-navigation** and **app-content** ids can be used:
+
+.. code-block:: html
+
+    <div id="app">
+        <div id="app-navigation">Your navigation</div>
+        <div id="app-content">Your content</div>
+    </div>
+
+Navigation
+==========
+ownCloud provides a default CSS navigation layout. If list entries should have 16x16 px icons, the **with-icon** class can be added to the base **ul**:
+
+.. code-block:: html
+
+    <div id="app-navigation">
+        <ul class="with-icon">
+            <li><a href="#">First level</a></li>
+            <li>
+                <ul>
+                    <li><a href="#">Second level</a></li>
+                    <li><a href="#">Second level</a></li>
+                </ul>
+            </li>
+        </ul>
+    </div>
+    
\ No newline at end of file