diff --git a/crates/treehouse/src/html/tree.rs b/crates/treehouse/src/html/tree.rs index 14cf661..831c0d5 100644 --- a/crates/treehouse/src/html/tree.rs +++ b/crates/treehouse/src/html/tree.rs @@ -83,6 +83,8 @@ pub fn branch_to_html(s: &mut String, treehouse: &mut Treehouse, file_id: FileId BranchKind::Collapsed => "
", }); s.push_str(""); + } else { + s.push_str("
"); } let raw_block_content = &source[branch.content.clone()]; @@ -108,10 +110,23 @@ pub fn branch_to_html(s: &mut String, treehouse: &mut Treehouse, file_id: FileId }); markdown::push_html(s, markdown_parser); + s.push_str(""); + { + write!( + s, + "", + EscapeAttribute(&attributes.id) + ) + .unwrap(); + } + s.push_str(""); + if !branch.children.is_empty() { s.push_str("
"); branches_to_html(s, treehouse, file_id, &branch.children); s.push_str("
"); + } else { + s.push_str(""); } } s.push_str(""); diff --git a/static/css/tree.css b/static/css/tree.css index 6f11a8e..14dc5fd 100644 --- a/static/css/tree.css +++ b/static/css/tree.css @@ -12,6 +12,8 @@ /* I have no clue why this works, deal with it */ --tree-hover-expansion: 0.01px; + + position: relative; } .tree details>summary { @@ -21,6 +23,29 @@ .tree li { list-style: none; + + display: flex; + flex-direction: row; + + position: relative; +} + +.tree li>*:first-child { + width: 100%; +} + +.tree li>div:first-child { + box-sizing: border-box; +} + +.tree li>div:first-child, +.tree li>details>summary:first-child { + padding-right: 32px; +} + +.tree li>div:first-child:hover { + border-bottom: 1px solid rgba(0, 0, 0, 15%); + margin-bottom: -1px; } .tree details>summary { @@ -52,3 +77,32 @@ .tree details[open]>summary { background-image: url('../svg/collapse.svg'); } + +.tree th-bb { + height: 24px; + margin: 4px; + + position: absolute; + top: 0; + right: 0; + + display: flex; + flex-direction: row; + + opacity: 0%; +} + +.tree li>details>summary:hover>th-bb, +.tree li>div:hover>th-bb { + opacity: 100%; +} + +.tree .branch-link { + background-image: url("../svg/link.svg"); + background-repeat: no-repeat; + background-position: 50% 50%; + opacity: 35%; + + width: 24px; + height: 24px; +} diff --git a/static/svg/go.svg b/static/svg/go.svg new file mode 100644 index 0000000..729d94e --- /dev/null +++ b/static/svg/go.svg @@ -0,0 +1,5 @@ + + + diff --git a/static/svg/link.svg b/static/svg/link.svg new file mode 100644 index 0000000..ccb7598 --- /dev/null +++ b/static/svg/link.svg @@ -0,0 +1,5 @@ + + +