🚀 fix: pin top

layout/_partial/post/title.ejs

@@ -7,11 +7,10 @@
 <% } else if (post.title){ %> <% if (index){ %>
 <h2 itemprop="name">
   <a class="<%= class_name %>" href="<%- url_for(post.path) %>"
-    ><%= post.title %></a
+    ><%= post.title %><%- partial('topping') %></a> 
-  >
 </h2>
 <% } else { %>
 <h1 class="<%= class_name %> sea-center" style="border-left:0" itemprop="name">
   <%= post.title %>
 </h1>
-<% } %> <%- partial('topping') %> <% } %>
+<% } %> <% } %>

layout/_partial/post/topping.ejs

@@ -1,5 +1,3 @@
 <% if (is_home() && post.top) { %>
-<div class="article-topping">
+  <i class="article-topping">置顶</i>
-  <i class="ri-umbrella-line"></i>
-</div>
 <% } %>

package.json

@@ -4,7 +4,7 @@
   "description": "a clean and elegant theme for hexo.",
   "scripts": {
     "dev": "parcel serve source-src/main.js -d source/css",
-    "build": "parcel build source-src/main.js -d source/css"
+    "build": "parcel build source-src/main.js -d source/css --no-source-maps"
   },
   "source": "source-src/main.js",
   "repository": {

source-src/css/_partial/article.styl

@@ -16,13 +16,17 @@
 //  overflow hidden
 
 .article-topping
-  position absolute
+  display inline-block
-  top 0
+  margin-left 10px
-  left -3rem
+  padding 0 10px
-  color: #ea434a
+  border-radius 4px
-  &>i
+  font-style normal
-    font-size 2rem
+  font-size 10px
-    line-height 1.7
+  background-color #ea434a
+  color #fff
+  height 20px
+  line-height 22px
+  transform translateY(-8px)
 
 
 .article-meta

source/css/main.js

@@ -3,4 +3,3 @@ parcelRequire=function(e,r,t,n){var i,o="function"==typeof parcelRequire&&parcel
 },{}],"epB2":[function(require,module,exports) {
 "use strict";require("./css/style.styl");
 },{"./css/style.styl":"MiQR"}]},{},["epB2"], null)
-//# sourceMappingURL=/main.js.map

source/css/main.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["main.js"],"names":[],"mappings":";;;AAAA,aAAA,QAAA","file":"main.js","sourceRoot":"..\\..\\source-src","sourcesContent":["import './css/style.styl'"]}