Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Don’t use disabled Popover
Thomas Scholtes committed 2 years ago
commit f2eb867d1f7bcd0581dc113f959491cf3ada9431
parent cea5aeb614c23491d28165704a0d121c13cf8308
4 files changed +15 -26
modified src/App/Header/Authenticate.svelte
@@ -4,6 +4,7 @@
  import { closeFocused } from "@app/components/Popover.svelte";

  import { httpdStore } from "@app/lib/httpd";
+ 
  import Avatar from "@app/components/Avatar.svelte";

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

  import ConnectModal from "@app/modals/ConnectModal.svelte";

  import IconButton from "@app/components/IconButton.svelte";
@@ -24,14 +25,8 @@
    color: var(--color-fill-gray);

    text-align: left;

  }
- 
  .avatar {
- 
    height: 1.5rem;
- 
    color: var(--color-fill-secondary) !important;
+ 
  .peer-info {

    display: flex;
- 
    gap: 0.5rem;
- 
    align-items: center;
- 
    justify-content: center;
- 
    font-weight: var(--font-weight-regular);

    font-family: var(--font-family-monospace);

  }

  .indicator {
@@ -59,12 +54,11 @@
      on:click={toggle}

      size="large"

      variant="secondary-toggle-on">
- 
      <div class="avatar">
- 
        <NodeId
- 
          large
- 
          disableTooltip
- 
          nodeId={$httpdStore.session.publicKey}
- 
          alias={$httpdStore.session.alias} />
+ 
      <div class="peer-info">
+ 
        <div style:height="1.25rem" style:margin-right="0.5rem">
+ 
          <Avatar nodeId={$httpdStore.session.publicKey} />
+ 
        </div>
+ 
        {$httpdStore.session.alias}

      </div>

    </Button>
modified src/components/HoverPopover.svelte
@@ -1,8 +1,6 @@
<script lang="ts">

  import debounce from "lodash/debounce";
- 
  export let disabled: boolean = false;
- 


  export let onShow: () => void = () => {};

  export let stylePopoverPositionLeft: string | undefined = undefined;

  export let stylePopoverPositionTop: string | undefined = undefined;
@@ -11,11 +9,9 @@
  let visible: boolean = false;



  const setVisible = debounce((value: boolean) => {
- 
    if (!disabled) {
- 
      visible = value;
- 
      if (visible) {
- 
        onShow();
- 
      }
+ 
    visible = value;
+ 
    if (visible) {
+ 
      onShow();

    }

  }, 150);

</script>
modified src/components/NodeId.svelte
@@ -7,7 +7,6 @@


  export let nodeId: string;

  export let alias: string | undefined = undefined;
- 
  export let disableTooltip: boolean = false;

  export let large: boolean = false;

</script>
@@ -43,7 +42,6 @@
</style>



<HoverPopover
- 
  disabled={disableTooltip}

  stylePopoverPositionLeft="-4.5rem"

  stylePopoverPadding="0.5rem 0.5rem 0.5rem 0.75rem"

  stylePopoverPositionTop="-4.5rem">
modified src/views/projects/Source/PeerSelector.svelte
@@ -14,6 +14,7 @@
  import IconSmall from "@app/components/IconSmall.svelte";

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

  import Button from "@app/components/Button.svelte";
+ 
  import Avatar from "@app/components/Avatar.svelte";



  export let peers: Array<{ remote: Remote; selected: boolean; route: Route }>;
@@ -60,10 +61,10 @@
        <DropdownListItem

          selected={item.selected}

          title={createTitle(item.remote)}>
- 
          <NodeId
- 
            disableTooltip
- 
            nodeId={item.remote.id}
- 
            alias={item.remote.alias} />
+ 
          <Avatar nodeId={item.remote.id} />
+ 
          <span style:font-family="var(--font-family-monospace)">
+ 
            {item.remote.alias || formatNodeId(item.remote.id)}
+ 
          </span>

          {#if item.remote.delegate}

            <div style:color="var(--color-fill-secondary)">

              <Badge size="tiny" variant="secondary">delegate</Badge>