feat: Add the button of sticky-top in timeline of post

liuyib · Sep 14, 2019 · 7b859df · 7b859df
1 parent 118e5f2
commit 7b859df
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/layout/_mixins/post-timeline.pug b/layout/_mixins/post-timeline.pug
@@ -17,4 +17,7 @@ mixin postTimeline(posts)
               a(href=url_for(post.link) target="_blank" rel="noopener").post-timeline-item-title__a= post.title || post.link
             else
               a(href=url_for(post.path)).post-timeline-item-title__a= post.title || __("post.untitled")
+        
+        if post.top
+          include ../_partials/widgets/sticky-top.pug
     - })
diff --git a/source/css/_common/components/post/post-timeline.styl b/source/css/_common/components/post/post-timeline.styl
@@ -51,6 +51,7 @@
 
     time-width = 3em;
     time-margin = 1em;
+    sticky-top-width = 2em;
 
     &__time {
       display: inline-block;
@@ -61,10 +62,15 @@
       transform: translateY(3%);
     }
 
+    .sticky-top {
+      width: 2em;
+      height: 2em;
+    }
+
     &-title {
       display: inline-block;
       margin: 0;
-      width: 'calc(100% - %s)' % (time-width + time-margin);
+      width: 'calc(100% - %s)' % (time-width + time-margin + sticky-top-width);
       font-size: 1em;
       font-weight: normal;
       vertical-align: middle;