From b12ee1d8b7564b99c5bf0ec5c5d7ad85db07d1b9 Mon Sep 17 00:00:00 2001
From: budaeva <47611627+budaeva@users.noreply.github.com>
Date: Mon, 27 Jun 2022 18:15:55 +0700
Subject: [PATCH] fix tasklist presenation (#2147)

Signed-off-by: budaeva <irina.budaeva@xored.com>
---
 .../src/components/message/Nodes.svelte         | 10 ++++++++--
 packages/theme/styles/_layouts.scss             | 17 ++++++++++++++++-
 plugins/chunter-resources/src/backlinks.ts      |  6 +++++-
 3 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/packages/presentation/src/components/message/Nodes.svelte b/packages/presentation/src/components/message/Nodes.svelte
index 75b5655a28..48b9ec5642 100644
--- a/packages/presentation/src/components/message/Nodes.svelte
+++ b/packages/presentation/src/components/message/Nodes.svelte
@@ -59,7 +59,7 @@
     {:else if node.nodeName === 'OL'}
       <ol><svelte:self nodes={node.childNodes} /></ol>
     {:else if node.nodeName === 'LI'}
-      <li class={'flex-row-center flex-grow  gap-1 checkbox_style'}><svelte:self nodes={node.childNodes} /></li>
+      <li class={'flex flex-grow gap-1 checkbox_style'}><svelte:self nodes={node.childNodes} /></li>
     {:else if node.nodeName === 'DIV'}
       <div><svelte:self nodes={node.childNodes} /></div>
     {:else if node.nodeName === 'A'}
@@ -70,7 +70,9 @@
       <svelte:self nodes={node.childNodes} />
     {:else if node.nodeName === 'INPUT'}
       {#if node.type?.toLowerCase() === 'checkbox'}
-        <CheckBox readonly checked={node.checked} />
+        <div class="checkboxContainer">
+          <CheckBox readonly checked={node.checked} />
+        </div>
       {/if}
     {:else if node.nodeName === 'SPAN'}
       <Component
@@ -98,4 +100,8 @@
       width: 100%;
     }
   }
+
+  .checkboxContainer {
+    padding-top: 0.125rem;
+  }
 </style>
diff --git a/packages/theme/styles/_layouts.scss b/packages/theme/styles/_layouts.scss
index 55e4c2615c..4074524fa8 100644
--- a/packages/theme/styles/_layouts.scss
+++ b/packages/theme/styles/_layouts.scss
@@ -713,6 +713,21 @@ a.no-line {
 
 .checkbox_style {
   input {
-    // TODO: Add a proper style here
+    appearance: none;
+    flex-shrink: 0;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    width: 0.875rem;
+    height: 0.875rem;
+    border: 1px solid var(--dark-color);
+    border-radius: 0.25rem;
+  }
+
+  
+  input:checked {
+    background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><polygon fill="white" points="7.3,11.5 4,8.3 5,7.4 7.3,9.7 11.8,5.1 12.7,6.1 " /></svg>');
+    background-color: var(--primary-bg-color);
+    border-color: transparent;
   }
 }
diff --git a/plugins/chunter-resources/src/backlinks.ts b/plugins/chunter-resources/src/backlinks.ts
index f3df2cf5d0..0bb6d52ee9 100644
--- a/plugins/chunter-resources/src/backlinks.ts
+++ b/plugins/chunter-resources/src/backlinks.ts
@@ -49,7 +49,11 @@ function extractBacklinks (
       break
     }
     nds.forEach((kid) => {
-      if (kid.nodeType === Node.ELEMENT_NODE && (kid as HTMLElement).localName === 'span') {
+      if (
+        kid.nodeType === Node.ELEMENT_NODE &&
+        (kid as HTMLElement).localName === 'span' &&
+        (kid as HTMLElement).getAttribute('data-type') === 'reference'
+      ) {
         const el = kid as HTMLElement
         const ato = el.getAttribute('data-id') as Ref<Doc>
         const atoClass = el.getAttribute('data-objectclass') as Ref<Class<Doc>>