css

scripts/tags/about.js

@@ -10,7 +10,7 @@
 'use strict';
 
 hexo.extend.tag.register('about', function(args, content) {
-  args = hexo.args.map(args, ['avatar', 'height']);
+  args = hexo.args.map(args, ['avatar', 'height', 'border']);
   var rows = hexo.render.renderSync({text: content, engine: 'markdown'}).split('\n');
   var el = '';
   // wrapper
@@ -24,20 +24,15 @@ hexo.extend.tag.register('about', function(args, content) {
   if (avatar_url) {
     el += '<div class="avatar">'
     el += '<img src="' + avatar_url + '"';
-    if (args.height && args.height.length > 0) {
+    if (args.border && args.border.length > 0) {
-      el += ' height="' + args.height + '"/>';
+      el += ' style="border-radius:' + args.border + '"';
-    } else {
-      el += '/>';
     }
+    if (args.height && args.height.length > 0) {
+      el += ' height="' + args.height + '"';
+    }
+    el += '/>';
     el += '</div>';
   }
-  // title
-  if (rows.length > 0) {
-    // el += '<div class="title">';
-    el += rows.shift();
-    // el += '</div>';
-  }
-
   el += '</div>';
 
   // content

source/css/_custom.styl

@@ -76,6 +76,13 @@ $border-image = 6px
   @media screen and (min-width: $device-4k)
     --width-main: 860px
     --gap-l: 64px
+  // iPad 竖屏
+  @media screen and (max-width: $device-tablet)
+    --width-left: 220px
+  // iPad 竖屏
+  @media screen and (max-width: $device-mobile-max)
+    --width-left: 256px
+
 
 
 // shadow

source/css/_layout/layout.styl

@@ -19,11 +19,6 @@
   max-width: var(--width-main)
 
 
-// iPad 竖屏
-@media screen and (max-width: $device-tablet)
-  :root
-    --width-left: 220px
-
 // 手机布局
 @media screen and (max-width: $device-mobile-max)
   .mobile-only

source/css/_layout/tag-plugins/about.styl

@@ -1,11 +1,12 @@
 .tag-plugin.about
   background: var(--block)
   border-radius: $border-card
-  padding: 3rem 2rem 2rem
+  padding: 2rem
   .about-header
     display flex
-    justify-content: space-between
+    justify-content: center
     flex-wrap: wrap
+    margin: 1rem 0 2rem
     img
       object-fit: contain
     >img
@@ -30,7 +31,6 @@
       nav.cap
         margin-top: 1rem
         background: var(--card)
-        border: 1px solid var(--block-border)
         a
           color: $color-link
           &:hover
@@ -43,7 +43,8 @@
 
 @media screen and (max-width: $device-mobile)
   .tag-plugin.about
-    padding: 2rem 1rem 1rem
+    padding: 1rem
     .about-header
+      margin: 2rem 0
       p
         width 100%

source/css/_layout/tag-plugins/friends.styl

@@ -17,10 +17,7 @@
       margin-top: 2rem
   .stellar-friends-api
     display: block
-    .loading-wrap
+    
-      min-height: 50px
-      margin: 2rem 0
-      text-align: center
 
 .users-wrap .user-card
   flex-shrink: 1

source/css/_layout/tag-plugins/timeline.styl

@@ -1,3 +1,6 @@
+.md .tag-plugin.folding .body:has(.timeline)
+  background: var(--site-bg)
+  
 .md .tag-plugin.timeline
   position: relative
   margin-top: 0