fix indent guides on mobile

content/treehouse/changelog.tree

@@ -12,6 +12,9 @@
         % id = "01HQ94FDZK5TJDM3CMNKQKES6Z"
         - if that's too annoying for you, it's easy to disable - scroll down on the [news page][page:treehouse/new] and there's a (collapsed by default) settings section for the page
 
+    % id = "01HQ95D2GHKF807X294N3GBADP"
+    - another thing: there are now indent guides! my girlfriend said these make the website a lot more readable for her, so I guess they're good
+
 % id = "01HP5AKRNJRG1W71MDJ8QY4YFW"
 - **revision 4:** there's now a thing in the footer
 

static/css/tree.css

@@ -86,6 +86,13 @@
     --tree-indent-guide-highlighted: var(--border-1);
 }
 
+@media (hover: none) {
+    .tree {
+        --tree-indent-guide-dim: var(--border-1);
+        --tree-indent-guide-highlighted: var(--border-1);
+    }
+}
+
 /* Use an indent level appropriate for the viewport. */
 .tree ul {
     --tree-responsive-indent-width: clamp(8px, 2vw, var(--tree-indent-width));
@@ -102,6 +109,7 @@
     border-left-color: var(--tree-indent-guide-highlighted);
 }
 
+
 /* Top level should not have an indent or a border. */
 .tree>ul {
     padding-left: 0;
@@ -287,6 +295,14 @@ th-bb {
 @media (hover: none) {
     .tree th-bb {
         opacity: 100%;
+
+        /* Replace margin with button size to make it easier to click. */
+        margin: 0px;
+
+        & a.icon {
+            width: 32px;
+            height: 32px;
+        }
     }
 }