fix: no text-wrapping for URL collapsibles

csaf-poc · Nov 17, 2023 · d792c17 · d792c17
1 parent ac678ef
commit d792c17
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/src/lib/Collapsible.svelte b/src/lib/Collapsible.svelte
@@ -52,28 +52,28 @@
   {#if level == "2"}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
     <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <div style="cursor:pointer" id={header} on:click={toggle} class={class_}>
+    <div title={header} style="cursor:pointer" id={header} on:click={toggle} class={class_}>
       <h2><i class="bx {icon}" />{header}</h2>
     </div>
   {/if}
   {#if level == "3"}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
     <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <div style="cursor:pointer" id={header} on:click={toggle} class={class_}>
+    <div title={header} style="cursor:pointer" id={header} on:click={toggle} class={class_}>
       <h3><i class="bx {icon}" />{header}</h3>
     </div>
   {/if}
   {#if level == "4"}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
     <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <div style="cursor:pointer" id={header} on:click={toggle} class={class_}>
+    <div title={header} style="cursor:pointer" id={header} on:click={toggle} class={class_}>
       <h4><i class="bx {icon}" />{header}</h4>
     </div>
   {/if}
   {#if level == "5"}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
     <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <div style="cursor:pointer" id={header} on:click={toggle} class={class_}>
+    <div title={header} style="cursor:pointer" id={header} on:click={toggle} class={class_}>
       <h6><i class="bx {icon}" />{header}</h6>
     </div>
   {/if}

diff --git a/src/lib/feedview/entries/URLCollapsible.svelte b/src/lib/feedview/entries/URLCollapsible.svelte
@@ -55,7 +55,7 @@
   {#if level == "4"}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
     <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <div style="cursor:pointer" id={entry.id} on:click={toggle} class={class_}>
+    <div title={entry.title} style="cursor:pointer" id={entry.id} on:click={toggle} class={class_}>
       <h4>
         <i class="bx {icon}" />
         <a href={lookupID} on:click={openLink}>{entry.id}: {entry.title}</a>
@@ -70,6 +70,9 @@
 </div>
 
 <style>
+  .collapsible {
+    white-space: nowrap;
+  }
   .body {
     padding-left: 3rem;
   }