Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Remove last line in commits list
Sebastian Martinez committed 2 years ago
commit 905b933e4a4a41122e314082d325c373a2ef9fe0
parent 8d676985751508dfc9dc67e3cf06c522cd3c14d1
2 files changed +69 -28
added src/views/projects/Cob/CobCommitListing.svelte
@@ -0,0 +1,67 @@
+ 
<script lang="ts">
+ 
  import type { BaseUrl, CommitHeader } from "@httpd-client";
+
+ 
  import { onMount } from "svelte";
+
+ 
  import CobCommitTeaser from "@app/views/projects/Cob/CobCommitTeaser.svelte";
+
+ 
  export let baseUrl: BaseUrl;
+ 
  export let commits: CommitHeader[];
+ 
  export let projectId: string;
+
+ 
  let commitsDiv: HTMLElement | undefined = undefined;
+ 
  const commitsDot: HTMLElement[] = [];
+
+ 
  onMount(() => {
+ 
    if (commitsDiv && commitsDot) {
+ 
      const lastCommitDot = commitsDot.pop();
+ 
      if (lastCommitDot?.parentElement) {
+ 
        // Calculate the position of the last commit-dot relative to the div.commits
+ 
        const commitDotBottom = lastCommitDot.parentElement.offsetTop + 10.5;
+
+ 
        // Set the height of the pseudo-element (border)
+ 
        commitsDiv.style.setProperty("--border-height", `${commitDotBottom}px`);
+ 
      }
+ 
    }
+ 
  });
+ 
</script>
+
+ 
<style>
+ 
  .commits {
+ 
    position: relative;
+ 
    display: flex;
+ 
    flex-direction: column;
+ 
    font-size: var(--font-size-small);
+ 
    margin-left: 1rem;
+ 
    gap: 0.5rem;
+ 
    padding: 1rem 1rem;
+ 
  }
+
+ 
  .commits::after {
+ 
    content: "";
+ 
    position: absolute;
+ 
    left: 0;
+ 
    top: 0;
+ 
    bottom: 0;
+ 
    border-left: 1px solid var(--color-fill-separator);
+ 
    height: var(--border-height);
+ 
  }
+ 
  .commit-dot {
+ 
    border-radius: var(--border-radius-round);
+ 
    width: 4px;
+ 
    height: 4px;
+ 
    position: absolute;
+ 
    top: 0.5rem;
+ 
    left: -17.5px;
+ 
    background-color: var(--color-fill-separator);
+ 
  }
+ 
</style>
+
+ 
<div bind:this={commitsDiv} class="commits">
+ 
  {#each commits.reverse() as commit, index}
+ 
    <div style:position="relative">
+ 
      <div class="commit-dot" bind:this={commitsDot[index]} />
+ 
      <CobCommitTeaser {commit} {baseUrl} {projectId} />
+ 
    </div>
+ 
  {/each}
+ 
</div>
modified src/views/projects/Cob/Revision.svelte
@@ -6,7 +6,7 @@
  import { HttpdClient } from "@httpd-client";

  import { onMount } from "svelte";
- 
  import CobCommitTeaser from "./CobCommitTeaser.svelte";
+ 
  import CobCommitListing from "@app/views/projects/Cob/CobCommitListing.svelte";

  import CommentComponent from "@app/components/Comment.svelte";

  import DiffStatBadge from "@app/components/DiffStatBadge.svelte";

  import DropdownList from "@app/components/DropdownList.svelte";
@@ -166,28 +166,9 @@
    font-size: var(--font-size-small);

    color: var(--color-fill-gray);

  }
- 
  .commits {
- 
    display: flex;
- 
    flex-direction: column;
- 
    font-size: var(--font-size-small);
- 
    border-left: 1px solid var(--color-fill-separator);
- 
    margin-left: 1rem;
- 
    gap: 0.5rem;
- 
    padding: 1rem 1rem;
- 
  }
- 


  .expanded {

    box-shadow: 0 0 0 1px var(--color-border-hint);

  }
- 
  .commit-dot {
- 
    border-radius: var(--border-radius-round);
- 
    width: 4px;
- 
    height: 4px;
- 
    position: absolute;
- 
    top: 0.5rem;
- 
    left: -18.5px;
- 
    background-color: var(--color-fill-separator);
- 
  }

  .connector {

    width: 1px;

    height: 1.5rem;
@@ -358,14 +339,7 @@
          </div>

        {/if}

        {#if response?.commits}
- 
          <div class="commits">
- 
            {#each response.commits.reverse() as commit}
- 
              <div style:position="relative">
- 
                <div class="commit-dot" />
- 
                <CobCommitTeaser {commit} {baseUrl} {projectId} />
- 
              </div>
- 
            {/each}
- 
          </div>
+ 
          <CobCommitListing commits={response.commits} {baseUrl} {projectId} />

        {/if}

      </div>

      {#if error}