Add demo anchors

site/static/style.css

@@ -2105,3 +2105,35 @@ a.entry-link:hover .anticon-smile {
   border-radius: 0 0 0.35rem 0.35rem;
   display: none;
 }
+
+.demos-anchor {
+  color: #aaa;
+  position: fixed;
+  bottom: 50%;
+  right: 10px;
+  z-index: 100;
+  transform: translateY(50%);
+  transition: all 0.3s ease;
+  background: #fff;
+  padding: 8px 8px 8px 28px;
+  border: 1px dashed #e9e9e9;
+  border-radius: 6px;
+  margin: 0;
+  font-size: 12px;
+}
+
+.demos-anchor li {
+  list-style: decimal outside;
+  width: 86px;
+}
+
+.demos-anchor a {
+  color: #666;
+  margin-bottom: 4px;
+  text-align: right;
+}
+
+.demos-anchor a:hover {
+  text-decoration: underline;
+  color: #2db7f5;
+}

site/templates/demos.html

@@ -33,4 +33,10 @@
   </div>
   {%- endif %}
 </div>
+<ul class="demos-anchor">
+  {%- for item in items %}
+  {%- set post = item.meta.filepath|parsePost %}
+  <li><a title="{{ post.title }}" href="#{{post.meta.id|removeCodeBoxIdPrefix}}">{{ post.title }}</a></li>
+  {%- endfor %}
+</ul>
 {%- endif %}