refactoring in post component

post_component.js

···
     let content = $tag('div.content');
 
     if (this.context == 'thread' && !this.isRoot) {
-      let edge = $tag('div.edge');
-      let line = $tag('div.line');
-      edge.appendChild(line);
-      div.appendChild(edge);
-
-      let plus = $tag('img.plus', { src: 'icons/subtract-square.png' });
-      div.appendChild(plus);
-
-      [edge, plus].forEach(x => {
-        x.addEventListener('click', (e) => {
-          e.preventDefault();
-          this.toggleSectionFold();
-        });
-      });
+      let edgeMargin = this.buildEdgeMargin();
+      div.appendChild(edgeMargin);
     }
 
     let wrapper;
···
     return h;
   }
 
+  buildEdgeMargin() {
+    let div = $tag('div.margin');
+
+    let edge = $tag('div.edge');
+    let line = $tag('div.line');
+    edge.appendChild(line);
+    div.appendChild(edge);
+
+    let plus = $tag('img.plus', { src: 'icons/subtract-square.png' });
+    div.appendChild(plus);
+
+    [edge, plus].forEach(x => {
+      x.addEventListener('click', (e) => {
+        e.preventDefault();
+        this.toggleSectionFold();
+      });
+    });
+
+    return div;
+  }
+
   /** @param {string} url, @returns {HTMLImageElement} */
 
   buildUserAvatar(url) {
···
     }
 
     if (!this.isRoot && this.context != 'quote' && this.post.quoteCount) {
-      let q = new URL(getLocation());
-      q.searchParams.set('quotes', this.linkToPost);
+      let quotesLink = this.buildQuotesIconLink(this.post.quoteCount, false);
+      stats.append(quotesLink);
+    }
 
-      let quotes = $tag('a', {
-        html: `<i class="fa-regular ${this.post.quoteCount > 1 ? 'fa-comments' : 'fa-comment'}"></i> ${this.post.quoteCount}`,
-        href: q.toString()
-      });
+    return stats;
+  }
+
+  /** @param {number} count, @param {boolean} expanded, @returns {AnyElement} */
+
+  buildQuotesIconLink(count, expanded) {
+    let q = new URL(getLocation());
+    q.searchParams.set('quotes', this.linkToPost);
+
+    let url = q.toString();
+    let icon = `<i class="fa-regular ${count > 1 ? 'fa-comments' : 'fa-comment'}"></i>`;
 
-      stats.append(quotes);
+    if (expanded) {
+      let span = $tag('span', { html: `${icon} ` });
+      let link = $tag('a', { text: (count > 1) ? `${count} quotes` : '1 quote', href: url });
+      span.append(link);
+      return span;
+    } else {
+      return $tag('a', { html: `${icon} ${count}`, href: url });
     }
+  }
 
-    return stats;
+  /** @param {number} quoteCount, @param {boolean} expanded */
+
+  appendQuotesIconLink(quoteCount, expanded) {
+    let stats = this.rootElement.querySelector(':scope > .content > p.stats');
+    let quotesLink = this.buildQuotesIconLink(quoteCount, expanded);
+    stats.append(quotesLink);
   }
 
   /** @returns {AnyElement} */
···
   }
 
   toggleSectionFold() {
-    let plus = this.rootElement.querySelector('.plus');
+    let plus = this.rootElement.querySelector(':scope > .margin .plus');
 
     if (this.isCollapsed()) {
       this.rootElement.classList.remove('collapsed');

skythread.js

···
 
   loadQuoteCount?.then(count => {
     if (count > 0) {
-      let stats = view.querySelector(':scope > .content > p.stats');
-      let q = new URL(getLocation());
-      q.searchParams.set('quotes', component.linkToPost);
-      stats.append($tag('i', { className: count > 1 ? 'fa-regular fa-comments' : 'fa-regular fa-comment' }));
-      stats.append(" ");
-      let quotes = $tag('a', {
-        text: count > 1 ? `${count} quotes` : '1 quote',
-        href: q.toString()
-      });
-      stats.append(quotes);
+      component.appendQuotesIconLink(count, true);
     }
   }).catch(error => {
     console.warn("Couldn't load quote count: " + error);

style.css

···
   border-left: 2px solid #888;
 }
 
+.post .plus {
+  position: absolute;
+  top: 8px;
+  left: -6px;
+  width: 14px;
+}
+
 .post.collapsed .line {
   display: none;
 }
···
   margin-top: 25px;
 }
 
-.post.flat > .edge {
+.post.flat > .margin {
   display: none;
 }
 
···
 
 .post.muted .missing {
   color: #bbb;
-}
-
-.post .plus {
-  position: absolute;
-  top: 8px;
-  left: -6px;
-  width: 14px;
-}
-
-.post.flat > .plus {
-  display: none;
 }
 
 .post h2 {