🎨 #17390

Author: Vanessa219

app/src/assets/scss/business/_config.scss

@@ -249,10 +249,6 @@
     &__panel {
       height: 100%;
       overflow: auto;
-
-      &[data-type="downloaded"] .config-bazaar__content {
-        margin: 16px;
-      }
     }
 
     &__title {
@@ -264,8 +260,7 @@
     }
 
     &__content {
-      display: grid;
-      gap: 16px;
+      margin: 1px 16px;
     }
 
     &__readme {

app/src/assets/scss/component/_card.scss

@@ -18,7 +18,10 @@
     display: grid;
     gap: 16px;
     grid-template-columns: repeat(auto-fill, minmax(min(100%, 342px), 1fr));
-    margin: 16px;
+
+    &--nowrap {
+      grid-template-columns:1fr;
+    }
   }
 
   &--current {
@@ -67,10 +70,6 @@
     line-height: 14px;
     padding: 3px 11px 11px;
 
-    &:not(.b3-card__actions--right) .block__icon {
-      color: var(--b3-theme-on-surface-light);
-    }
-
     &--right {
       padding-left: 0;
       padding-bottom: 0;

app/src/config/bazaar.ts

@@ -101,7 +101,7 @@ export const bazaar = {
             <input ${window.siyuan.config.bazaar.petalDisabled ? "" : " checked"} data-type="plugins-enable" type="checkbox" class="b3-switch fn__flex-center" style="margin-right: 8px">
             <div class="counter counter--bg fn__none fn__flex-center ariaLabel" data-position="north" aria-label="${window.siyuan.languages.total}"></div>
         </div>
-        <div id="configBazaarDownloaded" class="config-bazaar__content">
+        <div id="configBazaarDownloaded" class="config-bazaar__content b3-cards b3-cards--nowrap">
             ${loadingHTML}
         </div>
     </div>
@@ -359,7 +359,7 @@ export const bazaar = {
     <span class="fn__space"></span>
     <div class="counter counter--bg fn__flex-center ariaLabel" data-position="north" aria-label="${window.siyuan.languages.total}">${allCount}</div>
 </div>
-<div class="config-bazaar__content">${html}</div>`;
+<div class="config-bazaar__content b3-cards b3-cards--nowrap">${html}</div>`;
         });
     },
     _genMyHTML(bazaarType: TBazaarType, app: App, updateUpdate = true) {

app/src/protyle/header/Background.ts

@@ -266,7 +266,7 @@ export class Background {
                     });
                     const dialog = new Dialog({
                         title: window.siyuan.languages.builtIn,
-                        content: `<div class="b3-cards">${html}</div>`,
+                        content: `<div class="b3-cards" style="padding: 16px">${html}</div>`,
                         width: isMobile() ? "92vw" : "912px",
                         height: isMobile() ? "80vh" : "70vh",
                     });