[Libreoffice-commits] help.git: help3xsl/addxsl2xhp.sh help3xsl/default.css help3xsl/get_bookmark.sh help3xsl/get_bookmark.xsl help3xsl/get_url.sh help3xsl/get_url.xsl help3xsl/help.js help3xsl/help-to-html.sh help3xsl/index.html help3xsl/jquery-3.1.1.min.js help3xsl/online_transform.xsl help3xsl/README.txt help3xsl/tabs.css help3xsl/tree.css source/default.css source/get_bookmark.sh source/get_bookmark.xsl source/help.js source/help-to-html.sh source/jquery-3.1.1.min.js source/online_transform.xsl

Olivier Hallot olivier.hallot at libreoffice.org
Sat Jun 24 23:55:34 UTC 2017


 help3xsl/README.txt           |  113 ++++-----------
 help3xsl/addxsl2xhp.sh        |    2 
 help3xsl/default.css          |   15 --
 help3xsl/get_bookmark.sh      |    9 +
 help3xsl/get_bookmark.xsl     |    8 -
 help3xsl/get_url.sh           |   32 ++++
 help3xsl/get_url.xsl          |   61 ++++++++
 help3xsl/help-to-html.sh      |   45 ++++--
 help3xsl/index.html           |   45 ++++++
 help3xsl/online_transform.xsl |  315 ++++++++++++++++++++++--------------------
 help3xsl/tabs.css             |  134 +++++++++++++++++
 help3xsl/tree.css             |  123 ++++++++++++++++
 12 files changed, 639 insertions(+), 263 deletions(-)

New commits:
commit 181b72469b27cc2f711525838463e98a0920161c
Author: Olivier Hallot <olivier.hallot at libreoffice.org>
Date:   Tue Jun 20 00:04:54 2017 -0300

    Help-in-browser: several improvements
    
    * tabs for Contents/Index/Search
    * product version (6.0, 5.3, 5.2, etc...)
    * capable to receive URL from LibreOffice help call
    (need to change help url in sfx2/:
    protocol://<host>/index.html?<params>
    
    Change-Id: I2244336ea47cdb923884ae97b9f4a586d85ec706
    Reviewed-on: https://gerrit.libreoffice.org/39227
    Reviewed-by: Olivier Hallot <olivier.hallot at edx.srv.br>
    Tested-by: Olivier Hallot <olivier.hallot at edx.srv.br>

diff --git a/help3xsl/README.txt b/help3xsl/README.txt
index 2d7b87af2..c26d9152f 100644
--- a/help3xsl/README.txt
+++ b/help3xsl/README.txt
@@ -2,27 +2,23 @@
 Helpcontent displayed in a browser directly from XML 
 ----------------------------------------------------------------- 
 
-This folder contains components for displaying the Helpcontent2 XML 
-pages (XHP) from a webserver and also directly rendered in a modern 
-browser. 
+This README shows how to display Helpcontent2 XML pages (XHP) directly rendered in a modern browser. 
 
 ----------------------------------------------------------------- 
 Background 
 ----------------------------------------------------------------- 
 
-The XML files must be transformed into HTML files with the help of 
-a style sheet file (XSL).
+The XML files must be transformed into HTML files with the help of a style sheet file (XSL).
 
-In the current helpcontent2, the processing is done in xmlhelp/ 
-module, an ancient XSLT processor developed circa 2005 
-(OpenOffice.org 1.5)
+In the current helpcontent2, the processing is done in xmlhelp/ module, an ancient XSLT processor developed circa 2005 (OpenOffice.org 1.5)
 
-Modern browsers such as Firefox, Chrome and Rekonq are capable to 
-execute the transformation direcly in the client, by getting an URL 
-that returns a XML file that contains the reference of the necessary 
-XSL style sheet.
+Modern browsers such as Firefox, Chrome and Rekonq are capable to execute the transformation direcly in the client, by getting an URL that returns a XML file that contains the reference of the necessary XSL style sheet.
 
-This is the objective of this exercise.
+How to display Helpcontent2 in a browser
+
+1. Open the browser
+2. Open the file index.html in source/ folder
+3. Navigate in pages
 
 ----------------------------------------------------------------- 
 File descriptions
@@ -32,84 +28,47 @@ default.css:
 -------------
 the cascading style sheet for HTML formatting.
 
-index.html: 
------------
-A dummy entry web page in the root folder of the server.
-
 online_transform.xsl:
 --------------------
-the XSL transform file. This file is a modification of 
-xmlhelper/util/main_transform.xsl, which was designed for xmlhelp 
-XSL processor.
+the XSL transform file. Transform XHP files into HTML files.
 
-The XSLT online_transform.xsl is highly parametrizable and has params 
-and variables ready to handle the proper paths and URLs of the server.
+This file is a modification of xmlhelper/util/main_transform.xsl, which was designed for xmlhelp XSL processor.
 
------------------------------------------------------------------ 
-How to build the help website
------------------------------------------------------------------ 
+help.js
+-------
+This javascript file: 
+1. modifies href attributes in <a> of #DisplayArea to handle &DbPAR and &System params
+2. picks the bookmarks file and displays in #BottomLeft <div> area.
+3. Reads URL params.
 
-Each XHP file of helpcontent2/ must have a reference to the XSL file 
-online_transform.xsl, placed in the root folder of the help website.
+-----------------------------------------------------------------
+New ‘Object’ tag
+-----------------------------------------------------------------
 
-Therefore it is necessary to copy all XHP files in a temporary folder 
-and change the first line, through the script in addxsl2xhp.sh
+The filter online_transform.xsl now support the <object> tag defined for XHP files to allow a generic object in the browser. The <object> tag now maps to the folowing HTML5 tags:
+Maps to HTML5 <video> tag:
 
-Media files: Media files in helpcontent2 are located in module 
-icons-themes/ . It is necessary to create a media/ folder in the 
-webserver and copy the icon-themes folders and files in the right place.
+<section id="video">
+  <object id="1232312" type ="video/ogg" data="movies/testvideo.ogv" height="480px" width="640px"/>
+</section>
 
-But media in XHP files also depends on the icon theme defined in the 
-LibreOffice View options. This issue is not addressed at the moment.
+Maps to HTML5 <audio> tag:
+<section id="audio">
+  <object id="1232312" type ="audio/ogg" data="audio/testaudio.wav" height="" width=""/>
+</section>
 
-XHP file modified by addxsl2xml.sh script must exist in text/ folder 
-in the root folder of the webserver.
+Maps to HTML5 <object> tag:
+
+  <object id="1232312" type ="{mimetype}" data="object/testobject.swf" height="" width=""/>
 
 ----------------------------------------------------------------- 
-Folder layout.
+How to build the LibreOffice Browser help 
 ----------------------------------------------------------------- 
 
-Root folder
-		/
-		default.css
-		online_transform.xsl
-		index.html
-		media/
-		text/
-
-
-Notes:
-1) The folder text/ is exactly the same as in helpcontent2/ minus the 
-first line. The first line has the <xml> declaration followed by the 
-<xsl> declaration. NOTHING MORE.
-
-2) the online_transform.xsl is main_transform.xsl of HC2 modified to 
-accomodate the layout of the screen, It has 4 <div> hooked in each of 
-the 4 corners of the browser screen to allow resizing.
-
-3) the lower-right <div> displays the help content
-
-4) the upper-left <div> has entries to change help books/modules
-
-5) the upper right <div> is available to place a search mechanism
-
-6) the lower-left <div> is available to inser a index with javascript
-
-7) index.html is just a top landing page.
-
-8) default.css is the css used in helpconten2/languages
-
-9) plenty of simplification/tweak is possible in the XSLT.
+1) run help-to-html.sh in helpcontent2/help3xsl/ folder. A previous language build must exist in workdir/HelpTranslatePartHelp/ . 
+The script will build all existing languages available in this folder. See help-to-html.sh script and adjust path.
 
-10) The whole HC can be tranformed in html with XSLTPROC or any other 
-XSL processor, provided the reference to the XSL file is fixed, and 
-the xsl file be aware of the specifics of the XSL processor.
 
-11) Help pages can be acessed by 
-http://<url>/help_file.xhp#<bookmark | section | whatever ID>
+2) copy folder html/ to your root web server.
 
-12) Works with Firefox, Chrome, Rekonq. MS Edge does not understand 
-xml+xsl at first glance, likely to need some config, I guess.
 
-13) References to media are incomplete. That will require a change 
-in the urls of the media inside the help pages, thus forking from HC2
diff --git a/help3xsl/addxsl2xhp.sh b/help3xsl/addxsl2xhp.sh
deleted file mode 100755
index da7d75bed..000000000
--- a/help3xsl/addxsl2xhp.sh
+++ /dev/null
@@ -1,2 +0,0 @@
-#/bin/bash
-find . -type f -name "*.xhp" -exec sed -i 's/UTF-8"?>/UTF-8"?><?xml-stylesheet type="text\/xsl" href="\/online_transform.xsl"?>/g' {} +
diff --git a/source/default.css b/help3xsl/default.css
similarity index 96%
rename from source/default.css
rename to help3xsl/default.css
index be9a1af27..ddb701334 100644
--- a/source/default.css
+++ b/help3xsl/default.css
@@ -93,7 +93,7 @@ h4, h5, h6 {
 }
 
 .avis {
-    background-color: #EEEEEE;
+/*    background-color: #EEEEEE;*/
 }
 
 .relatedtopics {
@@ -301,19 +301,6 @@ position: fixed;
     font-size: 10pt;
 }
 
-#BottomLeft ul > li{
-    list-style-type: none;
-    font-size:11pt;
-}
-
-#SearchBox p {
-	background-color: #c2f6ba;
-	font-size: 16pt;
-	font-weight: bold;
-	line-height:2em;
-	border: 1px solid #18A303;
-}
-
 // Top menu System
 #TopSystem nav {
     background-color: #333;
diff --git a/source/get_bookmark.sh b/help3xsl/get_bookmark.sh
similarity index 86%
rename from source/get_bookmark.sh
rename to help3xsl/get_bookmark.sh
index c83da41bc..d926787da 100755
--- a/source/get_bookmark.sh
+++ b/help3xsl/get_bookmark.sh
@@ -6,6 +6,10 @@
 # License, v. 2.0. If a copy of the MPL was not distributed with this
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
+# $1 is html/productversion/
+# $2 is Language
+# $3 is productversion
+
 outdir=$1$2
 mkdir -p $outdir
 sourcedir=`pwd`/
@@ -13,7 +17,7 @@ ffile=$outdir'/bookmarks.js'
 rm -f $ffile
 ffile2=temp.html
 stub2=\'
-xslfile=$outdir/../../get_bookmark.xsl
+xslfile=$outdir/../../../get_bookmark.xsl
 
 # bookmarks for modules
 
@@ -23,6 +27,7 @@ stub1='document.getElementById("bookmark'$i'").innerHTML='\'\\
 sfind=$sourcedir`echo 'text/s'$i | tr '[:upper:]' '[:lower:]'`
 param='--stringparam app '$i
 param=$param' --stringparam Language '$2
+param=$param' --stringparam productversion '$3
 rm -f $ffile2
 find $sfind -type f -name "*.xhp" -exec xsltproc $param $xslfile {} + >> $ffile2
 echo $stub1 >> $ffile
@@ -37,6 +42,7 @@ stub1='document.getElementById("bookmarkSHARED").innerHTML='\'\\
 rm -f $ffile2
 param='--stringparam app SHARED'
 param=$param' --stringparam Language '$2
+param=$param' --stringparam productversion '$3
 find $sourcedir'text/shared' -type f -name "*.xhp" -exec xsltproc $param $xslfile {} + >> $ffile2
 echo $stub1 >> $ffile
 sort -k3b -t\> -s -o $ffile2 $ffile2
@@ -49,6 +55,7 @@ stub1='document.getElementById("bookmarkBASE").innerHTML='\'\\
 rm -f $ffile2
 param='--stringparam app BASE'
 param=$param' --stringparam Language '$2
+param=$param' --stringparam productversion '$3
 find $sourcedir'text/shared/explorer/database' -type f -name "*.xhp" -exec xsltproc $param $xslfile {} + >> $ffile2
 echo $stub1 >> $ffile
 sort -k3b -t\> -s -o $ffile2 $ffile2
diff --git a/source/get_bookmark.xsl b/help3xsl/get_bookmark.xsl
similarity index 95%
rename from source/get_bookmark.xsl
rename to help3xsl/get_bookmark.xsl
index 47441f406..724fcc73c 100644
--- a/source/get_bookmark.xsl
+++ b/help3xsl/get_bookmark.xsl
@@ -18,7 +18,7 @@ xsltproc get_bookmark.xsl <file.xhp>
 <xsl:param name="app"/>
 <xsl:param name="Language"/>
 <xsl:param name="productname" select="'LibreOffice'"/>
-<xsl:param name="productversion" select="'5.2'"/>
+<xsl:param name="productversion"/>
 
 <xsl:output indent="yes" method="text"/>
 
@@ -53,24 +53,20 @@ xsltproc get_bookmark.xsl <file.xhp>
 <xsl:template match="/">
       <xsl:for-each select="//bookmark[@branch='index']">
            <xsl:variable name="hrefhtml" select="substring-before($filename,'xhp')"/>   
-           <xsl:variable name="href" select="concat($Language,'/',$hrefhtml,'html?DbPAR=',$app,'#', at id)"/>
+           <xsl:variable name="href" select="concat($productversion,'/',$Language,'/',$hrefhtml,'html?DbPAR=',$app,'#', at id)"/>
            <xsl:for-each select="bookmark_value">
                      <xsl:variable name="here1">
-                     
                      <xsl:text disable-output-escaping="yes"><![CDATA[<li><a target="_top" href="]]></xsl:text>
                      <xsl:value-of select="$href"/>
                      <xsl:text disable-output-escaping="yes"><![CDATA["</a>]]></xsl:text>
-                     
                      <xsl:call-template name="apostrophe"><xsl:with-param name="string">
                           <xsl:value-of select="."/>
                      </xsl:with-param></xsl:call-template>
-                     
                      </xsl:variable>
 
 		     <xsl:call-template name="brand"><xsl:with-param name="string">
                           <xsl:value-of select="$here1"/>
                      </xsl:with-param></xsl:call-template>
-                     
                      <xsl:text disable-output-escaping="yes"><![CDATA[</li>\]]>&#xA;</xsl:text>
            </xsl:for-each>
       </xsl:for-each>
diff --git a/help3xsl/get_url.sh b/help3xsl/get_url.sh
new file mode 100755
index 000000000..13c809dbf
--- /dev/null
+++ b/help3xsl/get_url.sh
@@ -0,0 +1,32 @@
+#/bin/bash
+
+# This file is part of the LibreOffice project.
+#
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+# $1 is html/productversion/
+# $2 is Language
+# $3 is productversion
+
+outdir=html/
+# mkdir -p $outdir
+sourcedir=`pwd`/
+ffile=$outdir'filemap.js'
+rm -f $ffile
+ffile2=temp.html
+stub2='};'
+xslfile=get_url.xsl
+
+# bookmarks branch -> path/to/helpfile.html
+
+stub1='var map={'
+sfind=$sourcedir'text/'
+rm -f $ffile2
+find $sfind -type f -name "*.xhp" -exec xsltproc $xslfile {} + > $ffile2
+echo $stub1 >> $ffile
+# sort -k3b -t\> -s -o $ffile2 $ffile2
+awk 'NF' $ffile2 >> $ffile
+echo $stub2 >> $ffile
+
diff --git a/help3xsl/get_url.xsl b/help3xsl/get_url.xsl
new file mode 100644
index 000000000..a6beff66f
--- /dev/null
+++ b/help3xsl/get_url.xsl
@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--
+ * This file is part of the LibreOffice project.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+-->
+<!--
+Stylesheet to extract index bookmarks from xhp files and output a link to
+the xhp file.
+Usage:
+xsltproc get_bookmark.xsl <file.xhp>
+-->
+<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
+
+<xsl:param name="app"/>
+<xsl:param name="Language"/>
+<xsl:param name="productname" select="'LibreOffice'"/>
+<xsl:param name="productversion"/>
+
+<xsl:output indent="yes" method="text"/>
+
+<!--
+############################
+# Variables and Parameters #
+############################
+//-->
+<xsl:variable name="fname" select="/helpdocument/meta/topic/filename"/>
+<xsl:variable name="filename">
+    <xsl:choose>
+        <xsl:when test="starts-with($fname, '/')">
+            <xsl:value-of select="substring($fname, 2)"/>
+        </xsl:when>
+        <xsl:otherwise>
+            <xsl:value-of select="$fname"/>
+        </xsl:otherwise>
+    </xsl:choose>
+</xsl:variable>
+<!--
+#############
+# Templates #
+#############
+//-->
+
+<!-- Extract the bookmarks branches x filename-->
+<xsl:template match="/">
+      <xsl:variable name="href" select="concat(substring-before($filename,'xhp'),'html')"/>   
+      <xsl:for-each select="//bookmark[@branch!='index']">
+            <xsl:if test="not(contains(@branch,'/.uno'))">
+               <xsl:text>'</xsl:text>
+               <xsl:value-of select="substring-after(@branch,'hid/')"/>
+               <xsl:text>':'</xsl:text>
+               <xsl:value-of select="$href" /><xsl:text>',&#xA;</xsl:text>
+            </xsl:if>
+      </xsl:for-each>
+</xsl:template>
+
+
+</xsl:stylesheet>
diff --git a/source/help-to-html.sh b/help3xsl/help-to-html.sh
similarity index 61%
rename from source/help-to-html.sh
rename to help3xsl/help-to-html.sh
index f17b439c0..62efd87d9 100755
--- a/source/help-to-html.sh
+++ b/help3xsl/help-to-html.sh
@@ -10,11 +10,12 @@
 #Languages are merged in XHP files in
 # workdir/HelpTranslatePartTarget/
 #
-
+# $1 is product version ( 6.0, 5.3, 5.2, ...)
 #
-# location of the script is in core/helpcontent2/source/ = sourceDir
+# location of the script is in core/helpcontent2/source/help3xsl = sourceDir
 #
 sourceDir=`pwd`
+
 #
 # Location of the merged l10n help files from sourceDir
 #
@@ -23,23 +24,39 @@ langDirSource=../../workdir/HelpTranslatePartTarget/
 # Uggly hack: copy en-US from sourcedir to HelpTranslatePartTarget...
 rm -rf $langDirSource/en-US
 mkdir -p $langDirSource/en-US/helpcontent2/source
-cp -r $sourceDir/text/ $langDirSource/en-US/helpcontent2/source/
-
+cp -r $sourceDir/../source/text/ $langDirSource/en-US/helpcontent2/source/
 
 #
 # Location of the resulting html
 #
-outDir=$sourceDir/html/
+productversion=$1
+outDir=$sourceDir/html/$productversion/
 
 filter=$sourceDir/online_transform.xsl
 
 #clean and recreate the resulting html
-rm -rf $outDir
-mkdir $outDir
+rm -rf html
+mkdir -p html/$productversion
 
 #copy some service files
-cp default.css help.js jquery-3.1.1.min.js $outDir
-cp -rap media $outDir
+cp index.html html/
+cp default.css help.js jquery-3.1.1.min.js tabs.css tree.css $outDir
+cp -rap ../source/media $outDir
+mkdir -p $outDir'media/icon-themes'
+cp -rap ../../icon-themes/galaxy/* $outDir/media/icon-themes/
+ln -s $productversion html/latest
+
+# Create the bookmark2file map
+stub1='var map={'
+stub2='};'
+sfind='../source/text/'
+ffile='html/bookmark2file.js'
+ffile2=tmp.txt
+rm -f $ffile2 $ffile
+find $sfind -type f -name "*.xhp" -exec xsltproc get_url.xsl {} + > $ffile2
+echo $stub1 >> $ffile
+awk 'NF' $ffile2 >> $ffile
+echo $stub2 >> $ffile
 
 # Change to the merged l10 root folder
 cd $langDirSource
@@ -49,15 +66,15 @@ langDirSource=`pwd`
 
 # iterate existing languages
 for lang in `ls $langDirSource`
+# for lang in en-US
 do
         echo $lang
         cd $langDirSource/$lang/helpcontent2/source
         ln -sf $filter .
         ln -sf $sourceDir/get_bookmark.sh .
         mkdir -p  $outDir/$lang
-        ./get_bookmark.sh $outDir $lang
-        xsltparm='--stringparam Language '$lang
-
+        ./get_bookmark.sh $outDir $lang $productversion
+        xsltparm='--stringparam Language '$lang' --stringparam productversion '$productversion
         # iterate all xhp files
         for filep in `find text/ -name *.xhp`
         do
@@ -68,12 +85,14 @@ do
         done
 
         # some service links
-        ln -s text/shared/main0108.html $outDir/$lang/index.html
+
+#         ln -s text/shared/main0108.html $outDir/$lang/index.html
         ln -s ../media $outDir/$lang/media
         # back to l10n root folder
         cd $langDirSource
 
 done
+
 # Should copy core/icon-themes/galaxy/ to the media folder as icon-theme/
         #mkdir $outDir'media/icon-theme'
         # cp -rap ../../../../../icon-themes/galaxy/* $outDir/media/icon-theme/
diff --git a/source/help.js b/help3xsl/help.js
similarity index 100%
rename from source/help.js
rename to help3xsl/help.js
diff --git a/help3xsl/index.html b/help3xsl/index.html
new file mode 100644
index 000000000..932c4d944
--- /dev/null
+++ b/help3xsl/index.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<script type="text/javascript" src="latest/help.js"></script>
+	<script type="text/javascript" src="bookmark2file.js"></script>
+	</head>
+	<body>
+        <script type="text/javascript">
+        var url = window.location.href;
+        var n = url.indexOf('index.html?');
+        if (n != -1){
+        // the URL came from LibreOffice help (F1)
+            var version = getParameterByName("Version",url);
+            var lang = getParameterByName("Language",url);
+            var system  = getParameterByName("System",url);
+            var rest= url.substr(n+11,url.lenght);
+            var module;
+            var defaultFile;
+            var smodule = rest.substr(0, rest.indexOf('/'));
+            switch (smodule) {
+            case "swriter":   {defaultFile='text/swriter/main0000.html';module="WRITER";break;}
+            case "scalc":     {defaultFile='text/scalc/main0000.html';module="CALC";break;}
+            case "simpress":  {defaultFile='text/simpress/main0000.html';module="IMPRESS";break;}
+            case "sdraw":     {defaultFile='text/sdraw/main0000.html';module="DRAW";break;}
+            case "smath":     {defaultFile='text/smath/main0000.html';module="MATH";break;}
+            case "sdatabase": {defaultFile='text/shared/explorer/database/main.html';module="BASE";break;}
+            case "sbasic":    {defaultFile='text/sbasic/shared/main0601.html';module="BASIC";break;}
+            default:          {defaultFile='text/shared/main0000.html';module="WRITER";break;}
+            }
+            var bookmark = rest.slice(rest.indexOf('/')+1, rest.indexOf('?')); 
+            var file = map[bookmark];
+            // rebuild URL
+            if (file=='undefined'){
+                file = defaultFile;
+            }
+            var newURL = '/'+version+'/'+lang+'/'+file+'?System='+system+'&DbPAR='+module;
+            window.open(newURL,'_self');
+        }else{
+        // URL came from elsewhere, direct access to webroot, we redirect to main Help page
+            window.open('latest/en-US/text/shared/main0108.html?&DbPAR=WRITER&System=WIN','_self');
+        }
+    </script>
+	</body>
+</html>
+
diff --git a/source/jquery-3.1.1.min.js b/help3xsl/jquery-3.1.1.min.js
similarity index 100%
rename from source/jquery-3.1.1.min.js
rename to help3xsl/jquery-3.1.1.min.js
diff --git a/source/online_transform.xsl b/help3xsl/online_transform.xsl
similarity index 79%
rename from source/online_transform.xsl
rename to help3xsl/online_transform.xsl
index f73642db8..9107c6ecd 100644
--- a/source/online_transform.xsl
+++ b/help3xsl/online_transform.xsl
@@ -27,6 +27,9 @@
 ############################
 //-->
 
+<xsl:param name="productversion"/>
+
+
 <!-- General Usage -->
 <xsl:variable name="am" select="'&'"/>
 <xsl:variable name="sl" select="'/'"/>
@@ -68,7 +71,7 @@
   <!-- the other parameters given by the help caller -->
 <xsl:param name="System" select="'WIN'"/>
 <xsl:param name="productname" select="'LibreOffice'"/>
-<xsl:param name="productversion" select="''"/>
+
 <xsl:variable name="pversion">
 	<xsl:value-of select="translate($productversion,' ','')"/>
 </xsl:variable>
@@ -86,20 +89,15 @@
   <!-- parts of help and image urls -->
 <!--<xsl:variable name="help_url_prefix" select="'vnd.sun.star.help://'"/>-->
 <xsl:variable name="help_url_prefix" select="''"/>
-<xsl:variable name="img_url_internal" select="''"/>
-<xsl:variable name="img_url_prefix" select="concat('media',$imgtheme,'/')"/>
-<!-- <xsl:variable name="img_url_prefix" select="concat('vnd.libreoffice.image://',$imgtheme,'/')"/> -->
-<!--<xsl:variable name="urlpost" select=""/>-->
+
+<xsl:variable name="img_url_internal" select="$productversion"/>
+<xsl:variable name="img_url_prefix" select="concat($productversion,'/media',$imgtheme,'/')"/>
 <xsl:variable name="urlpost" select="concat('?Language=',$lang,$am,'System=',$System,$am,'UseDB=no')"/>
 <xsl:variable name="urlpre" select="$help_url_prefix" />
-<xsl:variable name="linkprefix" select="concat('/',$lang,'/')"/>
+<xsl:variable name="linkprefix" select="concat($productversion,'/',$lang,'/')"/>
 <!--<xsl:variable name="linkpostfix" select="$urlpost"/>-->
 <xsl:variable name="linkpostfix" select="''"/>
 
-
-<xsl:variable name="css" select="'default.css'"/>
-<xsl:variable name="csslink" select="concat($urlpre,$css)"/>
-
 <!-- images for notes, tips and warnings -->
 <xsl:variable name="note_img" select="concat($img_url_prefix,'helpimg/note.png')"/>
 <xsl:variable name="tip_img" select="concat($img_url_prefix,'helpimg/tip.png')"/>
@@ -113,144 +111,161 @@
 
 <!-- Create the document skeleton -->
 <xsl:template match="/">
-	<xsl:variable name="csslink" select="concat($urlpre,'default.css')"/>
-        <xsl:variable name="bookmarkref" select="concat($lang,'/bookmarks.js')"/>
-        <xsl:variable name="htmlpage"><xsl:call-template name="filehtml"><xsl:with-param name="file" select="$filename"/></xsl:call-template></xsl:variable>
-	<html>
-		<head>
-<!-- 		        <base href="file:///home/tdf/git/core/helpcontent2/source/html/"/> -->
-			<!--<base href="/{$lang}"/>-->
-                    <base href="/"/>
-                        <title><xsl:call-template name="brand"><xsl:with-param name="string">
-                               <xsl:value-of select="$title"/>
-                               </xsl:with-param></xsl:call-template></title>
-			<link href="{$csslink}" rel="Stylesheet" type="text/css" />
-			<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
-                        <script type="text/javascript" src="help.js"></script>
-
-  		<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
-		</head>
-		<body lang="{$lang}">
-                   <div id="BottomLeft">
-                       <div id="SearchBox">
-			       <p><xsl:text disable-output-escaping="yes">&nbsp;&#x1f50e;&nbsp;</xsl:text><input type="text" id="search-bar"/></p>
-                   </div>
-                       <ul id="bookmarkCALC" hidden="true"></ul>
-                       <ul id="bookmarkCHART" hidden="true"></ul>
-                       <ul id="bookmarkWRITER" hidden="true"></ul>
-                       <ul id="bookmarkDRAW" hidden="true"></ul>
-                       <ul id="bookmarkIMPRESS" hidden="true"></ul>
-                       <ul id="bookmarkMATH" hidden="true"></ul>
-                       <ul id="bookmarkBASE" hidden="true"></ul>
-                       <ul id="bookmarkSHARED" hidden="true"></ul>
-                       <ul id="bookmarkBASIC" hidden="true"></ul>
-                   </div>
-		   <div id="DisplayArea">
-			<xsl:apply-templates select="/helpdocument/body"/>
-                        <div class="debug">
-                            <h3 class="bug">Help content debug info:</h3>
-                            <p>This page is: <xsl:value-of select="$filename"/></p>
-                            <p>Title is: <xsl:value-of select="$title"/></p>
-                            <p id="bm_module"></p>
-                            <p id="bm_system"></p>
-                        </div>
-                   </div>
-                   <div id="TopLang"><!--<p>a</p></div>-->
-                   <nav>
-                   <ul>
-                       <li><a href="/en-US{$htmlpage}">EN</a></li>
-                       <li><a href="/ast{$htmlpage}">AST</a></li>
-                       <li><a href="/bg{$htmlpage}">BG</a></li>
-                       <li><a href="/bn{$htmlpage}">BN</a></li>
-                       <li><a href="/bn-IN{$htmlpage}">BN-IN</a></li>
-		       <li><a href="/ca{$htmlpage}">CA</a></li>
-                       <li><a href="/cs{$htmlpage}">CS</a></li>
-                       <li><a href="/da{$htmlpage}">DA</a></li>
-		       <li><a href="/de{$htmlpage}">DE</a></li>
-                       <li><a href="/el{$htmlpage}">EL</a></li>
-		       <li><a href="/es{$htmlpage}">ES</a></li>
-                       <li><a href="/eu{$htmlpage}">EU</a></li>
-                       <li><a href="/fi{$htmlpage}">FI</a></li>
-		       <li><a href="/fr{$htmlpage}">FR</a></li>
-                       <li><a href="/hu{$htmlpage}">HU</a></li>
-                       <li><a href="/it{$htmlpage}">IT</a></li>
-                       <li><a href="/ja{$htmlpage}">JA</a></li>
-                       <li><a href="/km{$htmlpage}">KM</a></li>
-                       <li><a href="/ko{$htmlpage}">KO</a></li>
-                       <li><a href="/nb{$htmlpage}">NB</a></li>
-                       <li><a href="/nl{$htmlpage}">NL</a></li>
-                       <li><a href="/om{$htmlpage}">OM</a></li>
-                       <li><a href="/pl{$htmlpage}">PL</a></li>
-		       <li><a href="/pt{$htmlpage}">PT</a></li>
-                       <li><a href="/pt-BR{$htmlpage}">PT-BR</a></li>
-                       <li><a href="/ru{$htmlpage}">RU</a></li>
-                       <li><a href="/sl{$htmlpage}">SL</a></li>
-                       <li><a href="/sv{$htmlpage}">SV</a></li>
-                       <li><a href="/tr{$htmlpage}">TR</a></li>
-                       <li><a href="/vi{$htmlpage}">VI</a></li>
-                       <li><a href="/zh-CN{$htmlpage}">ZH-CN</a></li>
-                       <li><a href="/zh-TW{$htmlpage}">ZH-TW</a></li>
-                   </ul>
-                   </nav>
-                   </div>
-                   <div id="TopRight">
-                       <script type="text/javascript">
-                       <![CDATA[
-                             (function() {
-                             var cx = '010161382024564278136:jcdsgegjym8';
-                             var gcse = document.createElement('script');
-                             gcse.type = 'text/javascript';
-                             gcse.async = true;
-                             gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
-                             var s = document.getElementsByTagName('script')[0];
-                             s.parentNode.insertBefore(gcse, s);
-                             })();
-                       ]]>
-                       </script>
-                       <xsl:text disable-output-escaping="yes"><gcse:search></gcse:search></xsl:text>
-                   </div>
-                   <div id="TopLeft">
-                       <nav id="SelectModules">
-                           <ul>
-                               <li><a href="/{$lang}/text/scalc/main0000.html?DbPAR=CALC">Calc</a></li>
-                               <li><a href="/{$lang}/text/swriter/main0000.html?DbPAR=WRITER">Writer</a></li>
-                               <li><a href="/{$lang}/text/simpress/main0000.html?DbPAR=IMPRESS">Impress</a></li>
-                               <li><a href="/{$lang}/text/sdraw/main0000.html?DbPAR=DRAW">Draw</a></li>
-                               <li><a href="/{$lang}/text/schart/main0000.html?DbPAR=CHART">Chart</a></li>
-                               <li><a href="/{$lang}/text/sbasic/shared/main0601.html?DbPAR=BASIC">Basic</a></li>
-                               <li><a href="/{$lang}/text/smath/main0000.html?DbPAR=MATH">Math</a></li>
-                               <li><a href="/{$lang}/text/shared/explorer/database/main.html?DbPAR=BASE">Base</a></li>
-                               <li><a href="/{$lang}/text/shared/guide/main.html?DbPAR=SHARED">Guide</a></li>
-                           </ul>
-                       </nav>
-                 </div>
-                 <div id="TopSystem">
-                     <nav id="SelectSystem">
-                         <ul>
-                             <li id="win"><a href="{$lang}{$htmlpage}">Wndows</a></li>
-                             <li id="lin"><a href="{$lang}{$htmlpage}">Linux</a></li>
-                             <li id="mac"><a href="{$lang}{$htmlpage}">Mac</a></li>
-                         </ul>
-                     </nav>
-                 </div>
-                 <script type="text/javascript">
-<![CDATA[
-//if (window.location.href.indexOf('?') == -1) {
-//window.open('text/shared/main0108.html?System=DEFSYS&DbPAR=WRITER&System=WIN','_self');
-//}
-var module = getParameterByName("DbPAR");
-setModule(module);
-var system = getParameterByName("System");
-setSystem(system);
-fixURL(module,system);
-setSystemURLButton(module);
-document.getElementById("bm_module").innerHTML ="Module is: "+module;
-document.getElementById("bm_system").innerHTML ="System is: "+system;
-]]>
-                 </script>
-                 <script type="text/javascript" src="{$bookmarkref}"/>
-                 </body>
-	</html>
+    <xsl:variable name="htmlpage"><xsl:call-template name="filehtml"><xsl:with-param name="file" select="$filename"/></xsl:call-template></xsl:variable>
+<html>
+<head>
+        <!--<base href="file:///home/tdf/git/core/helpcontent2/source/html/"/> -->
+        <base href="/"/>
+        <title><xsl:call-template name="brand"><xsl:with-param name="string">
+                    <xsl:value-of select="$title"/>
+                    </xsl:with-param></xsl:call-template>
+        </title>
+        <link href="{$productversion}/default.css" rel="Stylesheet" type="text/css" />
+        <link href="{$productversion}/tabs.css" rel="Stylesheet" type="text/css" />
+        <link href="{$productversion}/tree.css" rel="Stylesheet" type="text/css" />
+        <script type="text/javascript" src="{$productversion}/jquery-3.1.1.min.js"></script>
+        <script type="text/javascript" src="{$productversion}/help.js"></script>
+        <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
+</head>
+<body lang="{$lang}">
+    <div id="BottomLeft">
+        <div id="container"> <!-- Tabs -->
+            <input id="tab-1" type="radio" name="tab-group" checked="checked" />
+            <label for="tab-1">Index</label>
+            <input id="tab-2" type="radio" name="tab-group" />
+            <label for="tab-2">Contents</label>
+            <input id="tab-3" type="radio" name="tab-group" />
+            <label for="tab-3">Search</label>
+            <div id="content">
+                <div id="content-1">
+                    <div id="SearchBox"><p> &#x1f50e; <input type="text" id="search-bar"/></p></div>
+                    <div id="Bookmarks">
+                        <ul id="bookmarkCALC" hidden="true"></ul>
+                        <ul id="bookmarkCHART" hidden="true"></ul>
+                        <ul id="bookmarkWRITER" hidden="true"></ul>
+                        <ul id="bookmarkDRAW" hidden="true"></ul>
+                        <ul id="bookmarkIMPRESS" hidden="true"></ul>
+                        <ul id="bookmarkMATH" hidden="true"></ul>
+                        <ul id="bookmarkBASE" hidden="true"></ul>
+                        <ul id="bookmarkSHARED" hidden="true"></ul>
+                        <ul id="bookmarkBASIC" hidden="true"></ul>
+                    </div>
+                </div>
+                <div id="content-2">
+                    <p>Lorem ipsum dolor sit amet</p>
+                </div>
+                <div id="content-3">
+                    <p>Lorem ipsum dolor sit amet</p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div id="DisplayArea">
+        <xsl:apply-templates select="/helpdocument/body"/>
+        <div class="debug">
+            <h3 class="bug">Help content debug info:</h3>
+            <p>This page is: <xsl:value-of select="$filename"/></p>
+            <p>Title is: <xsl:value-of select="$title"/></p>
+            <p id="bm_module"></p>
+            <p id="bm_system"></p>
+        </div>
+    </div>
+    <div id="TopLang">
+        <nav>
+            <ul>
+                <li><a href="{$productversion}/en-US{$htmlpage}">EN</a></li>
+                <li><a href="{$productversion}/ast{$htmlpage}">AST</a></li>
+                <li><a href="{$productversion}/bg{$htmlpage}">BG</a></li>
+                <li><a href="{$productversion}/bn{$htmlpage}">BN</a></li>
+                <li><a href="{$productversion}/bn-IN{$htmlpage}">BN-IN</a></li>
+                <li><a href="{$productversion}/ca{$htmlpage}">CA</a></li>
+                <li><a href="{$productversion}/cs{$htmlpage}">CS</a></li>
+                <li><a href="{$productversion}/da{$htmlpage}">DA</a></li>
+                <li><a href="{$productversion}/de{$htmlpage}">DE</a></li>
+                <li><a href="{$productversion}/el{$htmlpage}">EL</a></li>
+                <li><a href="{$productversion}/es{$htmlpage}">ES</a></li>
+                <li><a href="{$productversion}/eu{$htmlpage}">EU</a></li>
+                <li><a href="{$productversion}/fi{$htmlpage}">FI</a></li>
+                <li><a href="{$productversion}/fr{$htmlpage}">FR</a></li>
+                <li><a href="{$productversion}/hu{$htmlpage}">HU</a></li>
+                <li><a href="{$productversion}/it{$htmlpage}">IT</a></li>
+                <li><a href="{$productversion}/ja{$htmlpage}">JA</a></li>
+                <li><a href="{$productversion}/km{$htmlpage}">KM</a></li>
+                <li><a href="{$productversion}/ko{$htmlpage}">KO</a></li>
+                <li><a href="{$productversion}/nb{$htmlpage}">NB</a></li>
+                <li><a href="{$productversion}/nl{$htmlpage}">NL</a></li>
+                <li><a href="{$productversion}/om{$htmlpage}">OM</a></li>
+                <li><a href="{$productversion}/pl{$htmlpage}">PL</a></li>
+                <li><a href="{$productversion}/pt{$htmlpage}">PT</a></li>
+                <li><a href="{$productversion}/pt-BR{$htmlpage}">PT-BR</a></li>
+                <li><a href="{$productversion}/ru{$htmlpage}">RU</a></li>
+                <li><a href="{$productversion}/sl{$htmlpage}">SL</a></li>
+                <li><a href="{$productversion}/sv{$htmlpage}">SV</a></li>
+                <li><a href="{$productversion}/tr{$htmlpage}">TR</a></li>
+                <li><a href="{$productversion}/vi{$htmlpage}">VI</a></li>
+                <li><a href="{$productversion}/zh-CN{$htmlpage}">ZH-CN</a></li>
+                <li><a href="{$productversion}/zh-TW{$htmlpage}">ZH-TW</a></li>
+            </ul>
+        </nav>
+    </div>
+    <div id="TopRight">
+        <script type="text/javascript">
+            <![CDATA[
+            (function() {
+            var cx = '010161382024564278136:oejldkqc20o';
+            var gcse = document.createElement('script');
+            gcse.type = 'text/javascript';
+            gcse.async = true;
+            gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
+            var s = document.getElementsByTagName('script')[0];
+            s.parentNode.insertBefore(gcse, s);
+            })();
+            ]]>
+        </script>
+        <xsl:text disable-output-escaping="yes"><gcse:search></gcse:search></xsl:text>
+    </div>
+    <div id="TopLeft">
+        <nav id="SelectModules">
+            <ul>
+                <li><a href="{$productversion}/{$lang}/text/scalc/main0000.html?DbPAR=CALC">Calc</a></li>
+                <li><a href="{$productversion}/{$lang}/text/swriter/main0000.html?DbPAR=WRITER">Writer</a></li>
+                <li><a href="{$productversion}/{$lang}/text/simpress/main0000.html?DbPAR=IMPRESS">Impress</a></li>
+                <li><a href="{$productversion}/{$lang}/text/sdraw/main0000.html?DbPAR=DRAW">Draw</a></li>
+                <li><a href="{$productversion}/{$lang}/text/schart/main0000.html?DbPAR=CHART">Chart</a></li>
+                <li><a href="{$productversion}/{$lang}/text/sbasic/shared/main0601.html?DbPAR=BASIC">Basic</a></li>
+                <li><a href="{$productversion}/{$lang}/text/smath/main0000.html?DbPAR=MATH">Math</a></li>
+                <li><a href="{$productversion}/{$lang}/text/shared/explorer/database/main.html?DbPAR=BASE">Base</a></li>
+                <li><a href="{$productversion}/{$lang}/text/shared/guide/main.html?DbPAR=SHARED">Guide</a></li>
+            </ul>
+        </nav>
+    </div>
+    <div id="TopSystem">
+        <nav id="SelectSystem">
+            <ul>
+                <li id="win"><a href="{$productversion}/{$lang}{$htmlpage}">Wndows</a></li>
+                <li id="lin"><a href="{$productversion}/{$lang}{$htmlpage}">Linux</a></li>
+                <li id="mac"><a href="{$productversion}/{$lang}{$htmlpage}">Mac</a></li>
+            </ul>
+        </nav>
+    </div>
+    <script type="text/javascript">
+        <![CDATA[
+        //if (window.location.href.indexOf('?') == -1) {
+        //window.open('text/shared/main0108.html?System=DEFSYS&DbPAR=WRITER&System=WIN','_self');
+        //}
+        var module = getParameterByName("DbPAR");
+        setModule(module);
+        var system = getParameterByName("System");
+        setSystem(system);
+        fixURL(module,system);
+        setSystemURLButton(module);
+        document.getElementById("bm_module").innerHTML ="Module is: "+module;
+        document.getElementById("bm_system").innerHTML ="System is: "+system;
+        ]]>
+    </script>
+    <script type="text/javascript" src="{$productversion}/{$lang}/bookmarks.js"/>
+</body>
+</html>
 </xsl:template>
 
 <!-- AHELP -->
@@ -900,10 +915,10 @@ document.getElementById("bm_system").innerHTML ="System is: "+system;
   <xsl:variable name="src">
     <xsl:choose>
      <xsl:when test="starts-with(@src,'media/')">
-          <xsl:value-of select="concat($img_url_internal, at src)"/>
+          <xsl:value-of select="concat($img_url_internal,'/', at src)"/>
      </xsl:when>
      <xsl:when test="not(starts-with(@src,'media/'))">
-         <xsl:value-of select="concat($img_url_internal,'media/icon-theme/', at src)"/>
+         <xsl:value-of select="concat($img_url_internal,'/media/icon-themes/', at src)"/>
      </xsl:when>
     <xsl:when test="not($ExtensionId='') and starts-with(@src,$ExtensionId)">
         <xsl:value-of select="concat($ExtensionPath,'/', at src)"/>
diff --git a/help3xsl/tabs.css b/help3xsl/tabs.css
new file mode 100644
index 000000000..cbbc9846d
--- /dev/null
+++ b/help3xsl/tabs.css
@@ -0,0 +1,134 @@
+/*Copyright (c) 2017 by César Gabriel (http://codepen.io/CesarGabriel/pen/nLhAa)
+
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+*/
+
+#container {
+    margin: 0 auto;
+    width: 100%;  /* Ancho del contenedor */
+    height: 100%;
+}
+
+#container input {
+	height: 2.5em;
+	visibility: hidden;
+}
+
+#container label {
+	background: #f9f9f9;  /* Fondo de las pestañas */
+	border-radius: .25em .25em 0 0;
+	color: #888;  /* Color del texto de las pestañas */
+	cursor: pointer;
+	display: block;
+	float: left;
+	font-size: 1em;  /* Tamaño del texto de las pestañas */
+	height: 2.5em;
+	line-height: 2.5em;
+	margin-right: .25em;
+	padding: 0 1.5em;
+	text-align: center;
+}
+
+#container input:hover + label {
+	background: #ddd;  /* Fondo de las pestañas al pasar el cursor por encima */
+	color: #666;  /* Color del texto de las pestañas al pasar el cursor por encima */
+}
+
+#container input:checked + label {
+	background: #f1f1f1;  /* Fondo de las pestañas al presionar */
+	color: #444; /* Color de las pestañas al presionar */
+	position: relative;
+	z-index: 6;
+	/*
+	-webkit-transition: .1s;
+	-moz-transition: .1s;
+	-o-transition: .1s;
+	-ms-transition: .1s;
+	*/
+}
+
+#content {
+	background: #ffffff;  /* Fondo del contenido */
+	border-radius: 0 .25em .25em .25em;
+	min-height: 20em;  /* Alto del contenido */
+	position: relative;
+	width: 100%;
+        height:100%;
+	z-index: 5;
+}
+
+#content div {
+	opacity: 0;
+	padding: 1.em;
+	position: absolute;
+	z-index: -100;
+        width:100%;
+	/*
+	transition: all linear 0.1s;
+	*/
+}
+
+
+/*#content-1 p {
+	clear: both;
+	margin-bottom: 1em;
+}
+#content-1 p.left img {
+	float: left;
+	margin-right: 1em;
+}
+#content-1 p.last {
+	margin-bottom: 0;
+}
+*/
+#content-1 div#SearchBox {
+	background-color: #c2f6ba;
+	line-height:2em;
+	border: 1px solid #18A303;
+        vertical-align: center;
+        text-align: center;
+        position: absolute;
+        top:2px;
+        left:2px;
+}
+#content-1 div#Bookmarks {
+        top:50px;
+}
+#content-1 ul li {
+    list-style-type: none;
+}
+#content-1 p {
+	font-size: 16pt;
+	font-weight: bold;
+}
+
+#container input#tab-1:checked ~ #content #content-1,
+#container input#tab-2:checked ~ #content #content-2,
+#container input#tab-3:checked ~ #content #content-3
+{
+    opacity: 1;
+    z-index: 100;
+}
+
+#container input#tab-2:checked ~ #content #content-2 *
+{
+    opacity: 1;
+    z-index: 100;
+    visibility: visible;
+}
+
+#container input#tab-1:checked ~ #content #content-1 *
+{
+    opacity: 1;
+    z-index: 100;
+    visibility: visible;
+}
+
+#container input.visible {
+  visibility: visible !important;
+}
diff --git a/help3xsl/tree.css b/help3xsl/tree.css
new file mode 100644
index 000000000..0bc539f7d
--- /dev/null
+++ b/help3xsl/tree.css
@@ -0,0 +1,123 @@
+<!--
+Copyright (c) 2017 by Ty Strong (http://codepen.io/tystrong/pen/cmxaJ)
+
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+-->
+
+
+.css-treeview ul,
+.css-treeview li
+{
+    padding: 0;
+    margin: 0;
+    list-style: none;
+}
+ 
+.css-treeview input
+{
+    position: absolute;
+    opacity: 0;
+}
+ 
+.css-treeview
+{
+    user-select: none;
+}
+ 
+.css-treeview a
+{
+    color: #35d;
+    text-decoration: none;
+}
+ 
+.css-treeview a:hover
+{
+    text-decoration: underline;
+}
+ 
+.css-treeview input + label + ul
+{
+    margin: 0 0 0 22px;
+}
+ 
+.css-treeview input ~ ul
+{
+    display: none;
+}
+ 
+.css-treeview label,
+.css-treeview label::before
+{
+    cursor: pointer;
+}
+ 
+.css-treeview input:disabled + label
+{
+    cursor: default;
+    opacity: .6;
+}
+ 
+.css-treeview input:checked:not(:disabled) ~ ul
+{
+    display: block;
+}
+ 
+.css-treeview label,
+.css-treeview label::before
+{
+    background: url("http://experiments.wemakesites.net//pages/css3-treeview/example/icons.png") no-repeat;
+}
+ 
+.css-treeview label,
+.css-treeview a,
+.css-treeview label::before
+{
+    display: inline-block;
+    height: 16px;
+    line-height: 16px;
+    vertical-align: middle;
+}
+ 
+.css-treeview label
+{
+    background-position: 18px 0;
+}
+ 
+.css-treeview label::before
+{
+    content: "";
+    width: 16px;
+    margin: 0 22px 0 0;
+    vertical-align: middle;
+    background-position: 0 -32px;
+}
+ 
+.css-treeview input:checked + label::before
+{
+    background-position: 0 -16px;
+}
+
+ at media screen and (-webkit-min-device-pixel-ratio:0)
+{
+    .css-treeview 
+    {
+        -webkit-animation: webkit-adjacent-element-selector-bugfix infinite 1s;
+    }
+ 
+    @-webkit-keyframes webkit-adjacent-element-selector-bugfix 
+    {
+        from 
+        { 
+            padding: 0;
+        } 
+        to 
+        { 
+            padding: 0;
+        }
+    }
+}


More information about the Libreoffice-commits mailing list