Remove legacy classes; fix svg question icon

2 files changed, 17 insertions, 22 deletions

diff --git a/assets/js/webmentions.js b/assets/js/webmentions.js
index 0576560..b19dd7b 100644
--- a/assets/js/webmentions.js
+++ b/assets/js/webmentions.js
@@ -4,9 +4,6 @@
 const ANON_AVATAR = 'data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"%3E%3Cpath fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z" clip-rule="evenodd" /%3E%3C/svg%3E';
 
 const fetchWebmentions = (url, aliases, productionBaseUrl) => {
-  if (!document.getElementById('comments')) {
-    return;
-  }
   if (!url) {
     url = document.location.origin + document.location.pathname;
   }
diff --git a/layouts/partials/webmentions.html b/layouts/partials/webmentions.html
index 4062aa7..20e0a10 100644
--- a/layouts/partials/webmentions.html
+++ b/layouts/partials/webmentions.html
@@ -18,7 +18,7 @@
   </div>
   <div>
     <a href="https://indieweb.org/Webmention" title="What are Webmentions?">
-      <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+      <svg class="fill-current w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
         <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
       </svg>
     </a>
@@ -26,42 +26,40 @@
 </div>
 
 <template id="reply-template" class="list-none">
-  <li class="h-entry flex mb-8 text-base">    
+  <li class="flex mb-8 text-base">    
     <a class="js-author flex-shrink-0" href="">
-      <img class="comment-avatar u-photo js-avatar w-8 h-8 rounded-full mr-3" alt="" src=""/>
+      <img class="js-avatar w-8 h-8 rounded-full mr-3" alt="" src=""/>
     </a>
-    <div class="comment-note__body">
-      <div class="p-author">
-        <strong><a class="no-underline u-author js-author-name" href=""></a></strong>
-        <small><a class="no-underline u-url js-date js-source" href=""></a></small>
+    <div>
+      <div>
+        <strong><a class="js-author-name no-underline" href=""></a></strong>
+        <small><a class="js-date js-source no-underline ml-2" href=""></a></small>
       </div>
-      <div class="js-content e-entry"></div>
+      <div class="js-content"></div>
     </div>
   </li>
 </template>
 <template id="like-template" class="list-none">
-  <li class="h-entry flex mb-8 text-base">
-    <a class="reply__avatar u-author js-author flex-shrink-0" href="">
-      <img class="u-photo js-avatar w-8 h-8 rounded-full mr-3" alt="" src=""/>
+  <li class="flex mb-8 text-base">
+    <a class="js-author flex-shrink-0" href="">
+      <img class="js-avatar w-8 h-8 rounded-full mr-3" alt="" src=""/>
     </a>
-    <a class="no-underline u-url js-source" href="">
-      <span class="reply__author p-name js-sentence js-author-name" href=""></span>
-      <small class="reply__date js-date" href=""></small>
+    <a class="js-source no-underline" href="">
+      <span class="js-sentence js-author-name" href=""></span>
+      <small class="js-date ml-2" href=""></small>
     </a>
   </li>
 </template>
 
 <div id="webmentions-interactions">
-  <ul class="replies" id="replies"></ul>
-  <ul class="shares" id="shares"></ul>
+  <ul id="replies"></ul>
+  <ul id="shares"></ul>
 </div>
 
 <div id="webmentions-likes">
-  <ul class="likes" id="likes"></ul>
+  <ul id="likes"></ul>
 </div>
 
-<div id="comments"></div>
-
 <script type="text/javascript">
   var webmentions = (permalink, aliases, productionBaseUrl) => {
     fetchWebmentions(permalink, aliases, productionBaseUrl);