Optimize .links-of-blogroll-item style

next-theme · Nov 27, 2024 · 3fb181f · 3fb181f
1 parent 58004e8
commit 3fb181f
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 32 deletions.
diff --git a/source/css/_common/outline/sidebar/index.styl b/source/css/_common/outline/sidebar/index.styl
@@ -70,19 +70,7 @@
   }
 
   .links-of-blogroll-item {
-    if (hexo-config('links_settings.layout') == 'inline') {
-      display: inline-block;
-    }
-    padding: 2px 10px;
-
-    a {
-      box-sizing: border-box;
-      display: inline-block;
-      max-width: 280px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
+    padding: 0 5px;
   }
 
   .popular-posts .popular-posts-item .popular-posts-link:hover {
@@ -115,6 +103,14 @@
   flex-column();
 }
 
+.links-of-blogroll-item {
+  max-width: calc(100% - 20px);
+
+  a {
+    sidebar-inline-links-item();
+  }
+}
+
 .cc-license {
   .cc-opacity {
     border-bottom: 0;

diff --git a/source/css/_common/outline/sidebar/sidebar-blogroll.styl b/source/css/_common/outline/sidebar/sidebar-blogroll.styl
@@ -9,6 +9,12 @@
 
 .links-of-blogroll-list {
   list-style: none;
-  margin: 0;
+  gap: 5px;
+  margin: 5px 0 0;
   padding: 0;
+  flex-wrap();
+
+  if (hexo-config('links_settings.layout') == 'block') {
+    flex-direction: column;
+  }
 }
diff --git a/source/css/_mixins.styl b/source/css/_mixins.styl
@@ -76,17 +76,12 @@ disable-user-select() {
 }
 
 sidebar-inline-links-item() {
-  margin: 5px 0 0;
-
-  a {
-    box-sizing: border-box;
-    display: inline-block;
-    max-width: 100%;
-    overflow: hidden;
-    padding: 0 5px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
+  box-sizing: border-box;
+  display: inline-block;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 flex-wrap() {

diff --git a/source/css/_schemes/Pisces/_sidebar.styl b/source/css/_schemes/Pisces/_sidebar.styl
@@ -50,7 +50,7 @@
   }
 
   .links-of-author-item {
-    sidebar-inline-links-item();
+    margin: 5px 0 0;
 
     if (not hexo-config('social_icons.icons_only')) {
       width: 50%;
@@ -60,19 +60,17 @@
       border-bottom: 0;
       border-radius: 4px;
       display: block;
+      padding: 0 5px;
+      sidebar-inline-links-item();
 
       &:hover {
         background: var(--body-bg-color);
       }
     }
   }
 
-  .links-of-blogroll-item {
-    if (hexo-config('links_settings.layout') == 'inline') {
-      display: inline-block;
-      max-width: 100%;
-      sidebar-inline-links-item();
-    }
+  .links-of-blogroll-item a {
+    padding: 0 5px;
   }
 
   if (hexo-config('back2top.sidebar')) {