collections as sl-tree

collections.xsl

@@ -19,6 +19,33 @@
 
 
     <xsl:template match="/">
+        <sl-tree>
+            <xsl:apply-templates/>
+        </sl-tree>
+    </xsl:template>
+
+    <xsl:template match="label">
+    </xsl:template>
+
+    <xsl:template match="ul">
+        <sl-tree-item expanded="true">
+                <a>
+                    <xsl:attribute name="href">
+                        <xsl:value-of select="concat('/bundles/max-db?collection=', preceding-sibling::label/@data-path)"></xsl:value-of>
+                    </xsl:attribute>
+                    <xsl:value-of select="preceding-sibling::label/data()"/>
+                </a>
+            <xsl:apply-templates/>
+        </sl-tree-item>
+    </xsl:template>
+
+
+    <xsl:template match="li">
+
+            <xsl:apply-templates/>
+
+    </xsl:template>
+   <!--<xsl:template match="/">
         <xsl:apply-templates/>
     </xsl:template>
 
@@ -29,5 +56,18 @@
             </xsl:attribute>
             <xsl:apply-templates/>
         </a>
-    </xsl:template>
+    </xsl:template>-->
 </xsl:stylesheet>
+
+
+<!--<div>
+    <label data-path="/">
+        Collection <em>/</em>
+    </label>
+    <ul>
+        <li>
+            <label data-path="sources">sources</label>
+            <ul></ul>
+        </li>
+    </ul>
+</div>-->
\ No newline at end of file

static/max-db.css

@@ -11,3 +11,7 @@ ul {
     list-style-type: square;
     margin-left:0;
 }
+
+#collections-pane a {
+    text-decoration: none;
+}
\ No newline at end of file

templates/index.html

@@ -66,7 +66,7 @@
                                     then <tr id="{$source/data()}">
                                             <td>{$source/data()}</td>
                                             <td>{string($source/@size)}</td>
-                                            <td>{string($source/@modified-date)}</td>
+                                            <td><sl-relative-time title="{string($source/@modified-date)}" date="{string($source/@modified-date)}" lang="fr-FR"></sl-relative-time></td>
                                             <td class="text-center">
                                               <sl-icon-button name="download" title="télécharger" onclick="downloadSource('{$source/data()}')">
                                               </sl-icon-button>
@@ -109,10 +109,11 @@
                 </div>
                 <div
                   slot="end"
+                  id="collections-pane"
                   style="height: 100vh; display: flex; flex-direction:column;"
                 >
                     <div class="m-2">
-                        <h2 class="mt-3">Collections</h2>
+                        <h4 class="mt-3 text-center">Collections</h4>
                         {$collectionTree}
                     </div>
                 </div>