Work progress on project UI

assets/zip/personnal-data-export-navigator/assets/css/main.css

@@ -1,5 +1,19 @@
+/**
+ * Data export result stylesheet
+ *
+ * @author Pierre HUBERT
+ */
+
 
 .sidenav.sidenav-fixed {
 	/*transform: unset;*/
 	/*margin-top: 80px;*/
+}
+
+main {
+	margin-left: 300px;
+}
+
+main .container {
+	display: none;
 }

assets/zip/personnal-data-export-navigator/assets/js/main.js

@@ -0,0 +1,34 @@
+/**
+ * Data export visualization navigator
+ *
+ * @author Pierre HUBERT
+ */
+
+/**
+ * Refresh tabs visibility accordingly to the hash of
+ * the current URL
+ */
+function RefreshTabsVisibility(){
+
+	var hash = location.href.toString().split("#")[1];
+
+	if(!hash)
+		return;
+
+	document.querySelectorAll(".category").forEach(el => {
+
+		el.style.display = el.id === hash ? "block" : "none";
+
+	});
+
+}
+
+/**
+ * Automatically switch the tab when it
+ * is required by the user
+ */
+window.addEventListener("hashchange", RefreshTabsVisibility);
+
+
+//Page initialization
+RefreshTabsVisibility();