made file trees more responsive

docs/css/styles.css

@@ -644,20 +644,11 @@ pre[class*=language-] code * {
   list-style: none;
   line-height: 1.25;
   position: relative;
-  overflow: hidden;
 }
 
 .file-tree > ul {
    padding-left: 0;
-}
-
-.file-tree li:not(:last-child) > ul::before {
-  content: '\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020';
-  position: absolute;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  width: 1em;
+   overflow-x: auto;
 }
 
 .file-tree li {
@@ -670,6 +661,16 @@ pre[class*=language-] code * {
   margin-top: 0;
 }
 
+.file-tree li:not(:last-child) > ul::before {
+  content: '\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020';
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 1em;
+  white-space: normal;
+}
+
 .file-tree li::before {
   content: '\251C\2500\2500\0020';
 }
@@ -678,11 +679,6 @@ pre[class*=language-] code * {
   content: '\2514\2500\2500\0020';
 }
 
-.file-tree li::before,
-.file-tree ul::before {
-  white-space: normal;
-}
-
 /* Expandable sections */
 
 .expandable-section {

themes/infusion/static/css/styles.css

@@ -644,20 +644,11 @@ pre[class*=language-] code * {
   list-style: none;
   line-height: 1.25;
   position: relative;
-  overflow: hidden;
 }
 
 .file-tree > ul {
    padding-left: 0;
-}
-
-.file-tree li:not(:last-child) > ul::before {
-  content: '\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020';
-  position: absolute;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  width: 1em;
+   overflow-x: auto;
 }
 
 .file-tree li {
@@ -670,6 +661,16 @@ pre[class*=language-] code * {
   margin-top: 0;
 }
 
+.file-tree li:not(:last-child) > ul::before {
+  content: '\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020\2502\0020';
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 1em;
+  white-space: normal;
+}
+
 .file-tree li::before {
   content: '\251C\2500\2500\0020';
 }
@@ -678,11 +679,6 @@ pre[class*=language-] code * {
   content: '\2514\2500\2500\0020';
 }
 
-.file-tree li::before,
-.file-tree ul::before {
-  white-space: normal;
-}
-
 /* Expandable sections */
 
 .expandable-section {