[Pkg-owncloud-commits] [owncloud-doc] 26/227: add docs for folders and drag and drop

David Prévot taffit at moszumanska.debian.org
Sat Oct 11 17:20:30 UTC 2014


This is an automated email from the git hooks/post-receive script.

taffit pushed a commit to branch master
in repository owncloud-doc.

commit 83efbb88f7e00aa4c751169c346cdfe39032579e
Author: Bernhard Posselt <dev at bernhard-posselt.com>
Date:   Thu Aug 28 12:55:50 2014 +0200

    add docs for folders and drag and drop
---
 developer_manual/app/css.rst       | 53 +++++++++++++++++++++++++++++++++++---
 developer_manual/testing/index.rst |  4 +--
 2 files changed, 51 insertions(+), 6 deletions(-)

diff --git a/developer_manual/app/css.rst b/developer_manual/app/css.rst
index c132b51..f06fe56 100644
--- a/developer_manual/app/css.rst
+++ b/developer_manual/app/css.rst
@@ -24,22 +24,67 @@ To use the commonly used layout consisting of sidebar navigation and content the
 
 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**:
+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**. The maximum supported indention level is two, further indentions are not recommended.
 
 .. code-block:: html
 
     <div id="app-navigation">
         <ul class="with-icon">
-            <li><a href="#">First level</a></li>
+            <li><a href="#">First level entry</a></li>
             <li>
+                <a href="#">First level container</a>
                 <ul>
-                    <li><a href="#">Second level</a></li>
-                    <li><a href="#">Second level</a></li>
+                    <li><a href="#">Second level entry</a></li>
+                    <li><a href="#">Second level entry</a></li>
                 </ul>
             </li>
         </ul>
     </div>
 
+Folders
+-------
+
+Folders are like normal entries and are only supported for the first level. In contrast to normal entries, the links which show the title of the folder need to have the **folder-icon** css class.
+
+If the folder should be collapsible, the **collapsible** class and a button with the class **collapse** are needed. After adding the collapsible class the folder's child entries can be toggled by adding the **open** class to the list element:
+
+.. code-block:: html
+
+    <div id="app-navigation">
+        <ul class="with-icon">
+            <li><a href="#">First level entry</a></li>
+            <li class="collapsible open">
+                <button class="collapse"></button>
+                <a href="#" class="folder-icon">Folder name</a>
+                <ul>
+                    <li><a href="#">Folder contents</a></li>
+                    <li><a href="#">Folder contents</a></li>
+                </ul>
+            </li>
+        </ul>
+    </div>
+
+
+Drag and drop
+-------------
+The class which should be applied to a first level element (**li**) that hosts or can host a second level is **drag-and-drop**. This will cause the hovered entry to slide down giving a visual hint that it can accept the dragged element. In case of jQuery UI's droppable feature, the **hoverClass** option should be set to the **drag-and-drop** class.
+
+.. code-block:: html
+
+    <div id="app-navigation">
+        <ul class="with-icon">
+            <li><a href="#">First level entry</a></li>
+            <li class="drag-and-drop">
+                <a href="#" class="folder-icon">Folder name</a>
+                <ul>
+                    <li><a href="#">Folder contents</a></li>
+                    <li><a href="#">Folder contents</a></li>
+                </ul>
+            </li>
+        </ul>
+    </div>
+
+
 Settings Area
 =============
 To create a settings area create a div with the id **app-settings** inside the **app-navgiation** div:
diff --git a/developer_manual/testing/index.rst b/developer_manual/testing/index.rst
index 9f04ed2..9c0d479 100644
--- a/developer_manual/testing/index.rst
+++ b/developer_manual/testing/index.rst
@@ -7,7 +7,7 @@ ownCloud Test Pilots
    :hidden:
 
 
-The ownCloud Test Pilots help to test and improve different server and client setups with ownCloud. 
+The ownCloud Test Pilots help to test and improve different server and client setups with ownCloud.
 
 Why do you want to join
 -----------------------
@@ -75,7 +75,7 @@ tracker. It might even be fixed, sometimes! It can also be fruitful to contact t
 `developers on irc <irc://freenode/#owncloud-dev>`_. Tell them you're testing ownCloud
 and share what problem you bumped into. Or just ask on the test-pilots mailing list.
 
-Finally, if the issue you bump into is a clear bug and the developers are not aware of it, file it as a new issue. See :doc:`../bugtracker`
+Finally, if the issue you bump into is a clear bug and the developers are not aware of it, file it as a new issue. See :doc:`../bugtracker/index`
 
 
 

-- 
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-owncloud/owncloud-doc.git



More information about the Pkg-owncloud-commits mailing list