🐛 fix https://github.com/b3log/solo/issues/12679

Pinghsu/article-list.ftl

@@ -23,27 +23,27 @@
             <div class="item__container">
                 <div class="item__cover" style="background-image: url(${article.articleImg1URL})"></div>
                 <div rel="bookmark" class="item__abstract">
-                    <div>
+                    <a pjax-title="${article.articleTitle}" href="${servePath}${article.articlePermalink}">
                         ${article.articleAbstractText}
-                    </div>
+                    </a>
                 </div>
                 <div class="item__slant"></div>
                 <div class="item__slant item__slant--white"></div>
                 <div class="item__main">
-                    <h2 class="item__title">
-                        <a rel="bookmark" href="${servePath}${article.articlePermalink}">
-                            ${article.articleTitle}
-                        </a>
                     <#if article.articlePutTop>
-                    <sup>
+                    <sup class="ft__red">
                         ${topArticleLabel}
                     </sup>
                     </#if>
                     <#if article.hasUpdated>
-                    <sup>
+                    <sup class="ft__red">
                         ${updatedLabel}
                     </sup>
                     </#if>
+                    <h2 class="item__title">
+                        <a rel="bookmark" href="${servePath}${article.articlePermalink}">
+                            ${article.articleTitle}
+                        </a>
                     </h2>
                 <#list article.articleTags?split(",") as articleTag>
                     <#if articleTag_index == 0>

Pinghsu/css/base.scss

@@ -319,7 +319,9 @@ a:active, a:focus, a:hover {
       word-break: break-all;
       box-sizing: border-box;
       transition: all .5s;
-      & > div {
+      & > a {
+        color: #fff;
+        display: block;
         opacity: 0;
         overflow: hidden;
         -webkit-line-clamp: 7;
@@ -343,13 +345,6 @@ a:active, a:focus, a:hover {
         -webkit-box-orient: vertical;
         display: -webkit-box;
       }
-      sup {
-        font-weight: normal;
-        font-size: 12px;
-        float: left;
-        top: -33px;
-        color: $red;
-      }
     }
 
     &__tag {
@@ -367,7 +362,7 @@ a:active, a:focus, a:hover {
         }
         &__abstract {
           background-color: rgba(0, 0, 0, .5);
-          & > div {
+          & > a {
             animation: fade-in;
             animation-duration: .5s;
             opacity: 1;