Fix overflow problem in Border component — radicle-desktop

rad:z4D5UCArafTzTQpDZNQRuqswh3ury

Radicle desktop app

Fix overflow problem in Border component

Merged rudolfs opened 1 year ago

2 files changed +9 -6 5277028e → f5c35b2d

modified src/components/Border.svelte

@@ -9,6 +9,7 @@

   export let styleWidth: string | undefined = undefined;
   export let styleCursor: "default" | "pointer" = "default";
   export let styleGap: string = "0.5rem";
   export let styleOverflow: string | undefined = undefined;
   $: style =
     `--local-button-color-1: var(--color-fill-${variant});` +

@@ -66,7 +67,6 @@

     grid-area: p3-3;
     display: flex;
     align-items: center;
     overflow: hidden;
   }
   .p3-4 {
     grid-area: p3-4;

@@ -173,7 +173,11 @@

   <div class="pixel p3-1"></div>
   <div class="pixel p3-2"></div>
   <div class="pixel p3-3" style:padding={stylePadding} style:gap={styleGap}>
   <div
     class="pixel p3-3"
     style:padding={stylePadding}
     style:gap={styleGap}
     style:overflow={styleOverflow}>
     <slot />
   </div>
   <div class="pixel p3-4"></div>

modified src/components/RepoCard.svelte

@@ -19,11 +19,9 @@

     margin-top: 1rem;
     justify-content: space-between;
   }
   .title {
   .description {
     color: var(--color-fill-gray);
     margin-top: 4px;
     overflow: hidden;
     text-overflow: ellipsis;
   }
   .container {
     width: 100%;

@@ -35,12 +33,13 @@

   styleCursor="pointer"
   styleWidth="100%"
   stylePadding="8px 12px"
   styleOverflow="hidden"
   hoverable
   {onclick}>
   <div class="container txt-small">
     <RepoHeader {repo} {selfDid} />
     <div class="title" title={project.data.description}>
     <div class="description txt-overflow" title={project.data.description}>
       {#if project.data.description}
         {project.data.description}
       {:else}