diff --git a/src/ui/css/diff2html.css b/src/ui/css/diff2html.css
index e351511..99ae1e2 100644
--- a/src/ui/css/diff2html.css
+++ b/src/ui/css/diff2html.css
@@ -5,6 +5,10 @@
*
*/
+.d2h-d-none {
+ display: none;
+}
+
.d2h-wrapper {
text-align: left;
}
@@ -79,6 +83,10 @@
padding: 4px 8px;
}
+.d2h-file-collapse.d2h-selected {
+ background-color: #c8e1ff;
+}
+
.d2h-file-collapse-input {
margin: 0 4px 0 0;
}
diff --git a/src/ui/js/diff2html-ui-base.ts b/src/ui/js/diff2html-ui-base.ts
index b3f7730..20bdd6c 100644
--- a/src/ui/js/diff2html-ui-base.ts
+++ b/src/ui/js/diff2html-ui-base.ts
@@ -118,8 +118,10 @@ export class Diff2HtmlUI {
.closest('.d2h-file-wrapper')
?.querySelector(selector);
- if (fileContents !== null && fileContents !== undefined)
- fileContents.style.display = fileContents.style.display === 'none' ? '' : 'none';
+ if (fileContents !== null && fileContents !== undefined) {
+ fileContentToggleBtn.classList.toggle('d2h-selected');
+ fileContents.classList.toggle('d2h-d-none');
+ }
};
const toggleHandler: (e: Event) => void = e => {