Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Fix patches state colors
Sebastian Martinez committed 3 years ago
commit 94632d7ea0079ad65b44bc88d7d833d431c4b0cb
parent 4ff0258af6e8f6ab6d7ea6b6a45f2cbe206d0721
3 files changed +30 -17
modified src/components/Badge.svelte
@@ -1,5 +1,5 @@
- 
<script lang="ts">
- 
  export let variant:
+ 
<script lang="ts" context="module">
+ 
  export type Variant =

    | "caution"

    | "foreground"

    | "negative"
@@ -7,6 +7,10 @@
    | "primary"

    | "secondary"

    | "tertiary";
+ 
</script>
+
+ 
<script lang="ts">
+ 
  export let variant: Variant;

  export let style: string | undefined = undefined;

</script>
modified src/views/projects/Patch.svelte
@@ -1,5 +1,6 @@
<script lang="ts">

  import type { BaseUrl, Comment, Merge, Patch, Review } from "@httpd-client";
+ 
  import type { Variant } from "@app/components/Badge.svelte";



  interface Thread {

    root: Comment;
@@ -159,6 +160,20 @@
    currentRevision.base,

    currentRevision.oid,

  );
+
+ 
  function badgeColor(status: string): Variant {
+ 
    if (status === "draft") {
+ 
      return "foreground";
+ 
    } else if (status === "open") {
+ 
      return "positive";
+ 
    } else if (status === "archived") {
+ 
      return "caution";
+ 
    } else if (status === "merged") {
+ 
      return "primary";
+ 
    } else {
+ 
      return "foreground";
+ 
    }
+ 
  }

</script>



<style>
@@ -234,19 +249,9 @@
        </Floating>

      </span>

      <svelte:fragment slot="state">
- 
        {#if patch.state.status === "draft"}
- 
          <Badge variant="foreground">
- 
            {patch.state.status}
- 
          </Badge>
- 
        {:else if patch.state.status === "open"}
- 
          <Badge variant="positive">
- 
            {patch.state.status}
- 
          </Badge>
- 
        {:else}
- 
          <Badge variant="positive">
- 
            {patch.state.status}
- 
          </Badge>
- 
        {/if}
+ 
        <Badge variant={badgeColor(patch.state.status)}>
+ 
          {patch.state.status}
+ 
        </Badge>

        <div class="layout-desktop">

          <Authorship

            highlight
modified src/views/projects/Patch/PatchTeaser.svelte
@@ -93,13 +93,16 @@
    color: var(--color-foreground-6);

  }

  .draft {
- 
    background-color: var(--color-foreground-3);
+ 
    background-color: var(--color-foreground-4);

  }

  .open {

    background-color: var(--color-positive);

  }

  .archived {
- 
    background-color: var(--color-negative);
+ 
    background-color: var(--color-caution);
+ 
  }
+ 
  .merged {
+ 
    background-color: var(--color-primary);

  }

  @media (max-width: 960px) {

    .tags {
@@ -114,6 +117,7 @@
      class="state-icon"

      class:draft={patch.state.status === "draft"}

      class:open={patch.state.status === "open"}
+ 
      class:merged={patch.state.status === "merged"}

      class:archived={patch.state.status === "archived"} />

  </div>

  <div class="column-left">