🔀 Merge pull request #89 from geriyoco/main

fanurs · web-flow · commit ac95471de58b · 2022-08-01T18:34:39.000-04:00
🚀 v0.4.1
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Change Log
 
+## [0.4.1] - 2022-08-01
+### Fixed
+- Buttons to expand/collapse all sub-folders were not showing up (temporary fix without using [@vscode/codicons](https://github.com/microsoft/vscode-codicons))
+
 ## [0.4.0] - 2022-07-30
 ### Added
 - Buttons to expand/collapse all sub-folders in the gallery view
diff --git a/media/gallery.css b/media/gallery.css
@@ -129,12 +129,15 @@ html {
 
 .codicon {
 	padding: 3px;
+	width: 20px;
+	height: 20px;
 	background-color: hsl(0, 0%, 17%);
-	border: 0;
+	border-color: white;
+	border-width: 1px;
 	color: white;
 }
 
 .codicon:hover {
 	background-color: hsl(180, 0%, 21%);
-	border-radius: 5px;
+	border-radius: 3px;
 }
diff --git a/media/gallery.js b/media/gallery.js
@@ -47,33 +47,37 @@
 
 			let expandAll = Array.from(gridElements).some(el => el.style.display === "none");
 			if (expandAll) {
-				let collapseAllButton = document.getElementsByClassName("codicon-collapse-all");
+				let collapseAllButton = document.getElementsByClassName("temp-collapse-all");
 				if (collapseAllButton.length !== 0) {
-					collapseAllButton[0].setAttribute("class", "codicon codicon-expand-all");
+					collapseAllButton[0].setAttribute("class", "codicon temp-expand-all");
+					collapseAllButton[0].textContent = "+";
 				}
 			} else {
-				let expandAllButton = document.getElementsByClassName("codicon-expand-all");
+				let expandAllButton = document.getElementsByClassName("temp-expand-all");
 				if (expandAllButton.length !== 0) {
-					expandAllButton[0].setAttribute("class", "codicon codicon-collapse-all");
+					expandAllButton[0].setAttribute("class", "codicon temp-collapse-all");
+					collapseAllButton[0].textContent = "−";
 				}
 			}
 			return;
 		}
 
-		if (node.classList.contains("codicon-expand-all")) {
+		if (node.classList.contains("temp-expand-all")) {
 			gridElements.forEach((gridElement) => {
 				gridElement.style.display = "grid";
 				gridElement.previousElementSibling.firstElementChild.textContent = "⮟";
 			});
-			node.setAttribute("class", "codicon codicon-collapse-all");
+			node.setAttribute("class", "codicon temp-collapse-all");
+			node.textContent = "−";
 			return;
 		}
-		if (node.classList.contains("codicon-collapse-all")) {
+		if (node.classList.contains("temp-collapse-all")) {
 			gridElements.forEach((gridElement) => {
 				gridElement.style.display = "none";
 				gridElement.previousElementSibling.firstElementChild.textContent = "⮞";
 			});
-			node.setAttribute("class", "codicon codicon-expand-all");
+			node.setAttribute("class", "codicon temp-expand-all");
+			node.textContent = "+";
 			return;
 		}
 
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
 	"name": "vscode-image-gallery",
 	"displayName": "Image Gallery",
 	"description": "An extension that enhances image browsing experience.",
-	"version": "0.4.0",
+	"version": "0.4.1",
 	"publisher": "GeriYoco",
 	"repository": {
 		"type": "git",
diff --git a/src/gallery.ts b/src/gallery.ts
@@ -108,8 +108,8 @@ function getWebviewContent(
 		<body>
             <div class="toolbar">
                 ${Object.keys(imagesBySubFolders).length > 1 ?
-            '<button class="codicon codicon-expand-all"></button>' :
-            '<button class="codicon codicon-collapse-all"></button>'
+            '<button class="codicon temp-expand-all">+</button>' :
+            '<button class="codicon temp-collapse-all">-</button>'
         }
                 <div class="folder-count">${Object.keys(imagesBySubFolders).length} folders found</div>
             </div>
