add submenus for collections

_config.yml

@@ -66,6 +66,10 @@ timezone: Europe/Madrid
 ## 
 future: true
 collections:
+  events:
+    output: true
+    menu: true
+    sort_by: date
   talks:
     output: true
   news:

_events/workshop1.md

@@ -0,0 +1,12 @@
+---
+layout: default
+title: An amazing workshop
+location: virtual
+date: 2020-07-24 14:00 +03:00
+location: virtual 
+link: https://www.youtube.com/
+published: true
+---
+
+An amazing workshop!!
+

_events/workshop2.md

@@ -0,0 +1,12 @@
+---
+layout: default
+title: An amazing workshop 2 
+location: virtual
+date: 2022-07-24 14:00 +03:00
+location: virtual 
+link: https://www.youtube.com/
+published: true
+---
+
+An amazing workshop!!
+

_includes/topmenu.html

@@ -1,10 +1,27 @@
 <nav class="topnav" id="topnav">
-        {% assign pages = site.pages | sort: "weight"  %}      	
-         {% for pg in pages %}{% if pg.title %}{% unless pg.hide %}
-	 <a {% if pg.url == page.url %} class = "active" ,{% endif %} href="{{ pg.url | relative_url }}">{{ pg.title }}</a>
-	 {% endunless %}{% endif %}
-    {% endfor %}
-
+	{% assign collections =  site.collections | where_exp: "item", "item.menu" %}
+	{% assign pages = site.pages | sort: "weight"  %}      	
+	{% for pg in pages %}
+	  {% if pg.title %}{% unless pg.hide %}
+	    <a {% if pg.url == page.url %} class = "active" ,{% endif %} href="{{ pg.url | relative_url }}">{{ pg.title }}</a>
+	  {% endunless %}{% endif %}
+	{% endfor %}
+	{% for cl in collections %}
+	<div class="top-button">
+		{% if cl.menu_label %}
+		  {{ cl.menu_label }}
+		{% else %}
+		  {{ cl.label }}
+		{% endif %}
+		<nav class="subnav"> 
+			{% for pg in cl.docs %}
+			{% if pg.title %}{% unless pg.hide %}
+			<a {% if pg.url == page.url %} class = "active" ,{% endif %} href="{{ pg.url | relative_url }}">{{ pg.title }}</a>
+			{% endunless %}{% endif %}
+			{% endfor %}
+		</nav>
+	</div>
+	{% endfor %}
     <div class="plinks">
       {% for link in site.links %}
     <a class = "plink" href = "{{ link.url }}">{{ link.name }}</a> 

assets/style/style.css

@@ -105,7 +105,8 @@ div.title {
 
 
 /* Style the links inside the navigation bar */
-.topnav a {
+.topnav a, .topnav div.top-button {
+  display: block;
   float: left;
   color: #d9dbda;
   text-align: center;
@@ -117,6 +118,11 @@ div.title {
 
 /* Change the color of links on hover */
 .topnav a:hover {
+  background-color: #729FCF;
+  color: black;
+}
+
+.topnav div.top-button:hover {
   background-color: #268BD2;
   color: black;
 }
@@ -143,13 +149,32 @@ div.title {
 	color: white;
 }
 
+
+.subnav {
+ display: none;
+ position: fixed;
+ left: 0;
+ width: 100%;
+ height: auto;
+ z-index: 1;
+ background-color: #268BD2;
+ color: black;
+}
+
+
+
+.topnav div:hover .subnav {
+  display: block;
+}
+
+
 .topnav .menubutton {
   display: none;
 }
 
 
 div.bibtexout {
-   background: #f4f4f4;
+    background: #f4f4f4;
     border: 1px solid #ddd;
     border-left: 3px solid #268BD2;
     color: #666;