ca28fc2 Display a top and bottom border in the file tree when overflowing — radicle-explorer

Radicle web interface

Display a top and bottom border in the file tree when overflowing

Sebastian Martinez committed 2 years ago

commit ca28fc28b20907e977d154a22215a68c0678301f
parent f44b0f4709de89667f7c30129c30d22c18528096

1 file changed +14 -1

modified src/views/projects/Source.svelte

@@ -29,6 +29,12 @@

   // Whether the mobile file tree is visible.
   let mobileFileTree = false;
   let treeElement: HTMLElement | undefined = undefined;
   let treeOverflow: boolean = false;
   $: if (treeElement) {
     treeOverflow = treeElement.scrollHeight > treeElement.offsetHeight;
   }
   const api = new HttpdClient(baseUrl);

@@ -98,6 +104,10 @@

     width: 17.5rem;
     padding-right: 0.25rem;
   }
   .source-tree-overflow {
     border-bottom: 1px solid var(--color-fill-separator);
     border-top: 1px solid var(--color-fill-separator);
   }
   .sticky {
     position: sticky;
     top: 2rem;

@@ -174,7 +184,10 @@

   <div class="container center-content">
     {#if tree.entries.length > 0}
       <div class="column-left">
         <div class="source-tree sticky">
         <div
           bind:this={treeElement}
           class="source-tree sticky"
           class:source-tree-overflow={treeOverflow}>
           <TreeComponent
             projectId={project.id}
             {revision}