fix(widgets): keep widget-content an unstyled structural layer #27

Merged
kate522 merged 1 commits from worktree/fix-widget-content-margin into main 2026-09-05 05:28:07 +00:00
8 changed files with 10 additions and 20 deletions
+2 -7
View File
@@ -666,13 +666,8 @@
font-size: 14px; font-size: 14px;
} }
.widget-content { /* .widget-content 是无样式结构层(对齐参考主题):小工具卡片自带内边距,
padding: var(--card-padding-lg, 20px); * 在这里加 padding 会让所有小工具与内容列宽产生左右空隙。 */
}
.widget-content--flush {
padding: 0;
}
/* Widget 链接 */ /* Widget 链接 */
.widget a { .widget a {
+1 -1
View File
File diff suppressed because one or more lines are too long
-1
View File
@@ -163,7 +163,6 @@ Full admin panel preserved (settings, OAuth, content tools, etc).
/* ===== Card density — 对齐 legacy .box-body { padding: 15px } ===== */ /* ===== Card density — 对齐 legacy .box-body { padding: 15px } ===== */
--card-padding: 15px; --card-padding: 15px;
--card-padding-sm: 10px; --card-padding-sm: 10px;
--card-padding-lg: 20px;
--card-gap: 16px; --card-gap: 16px;
--card-gap-lg: 20px; --card-gap-lg: 20px;
+1 -1
View File
File diff suppressed because one or more lines are too long
-1
View File
@@ -138,7 +138,6 @@
/* ===== Card density — 对齐 legacy .box-body { padding: 15px } ===== */ /* ===== Card density — 对齐 legacy .box-body { padding: 15px } ===== */
--card-padding: 15px; --card-padding: 15px;
--card-padding-sm: 10px; --card-padding-sm: 10px;
--card-padding-lg: 20px;
--card-gap: 16px; --card-gap: 16px;
--card-gap-lg: 20px; --card-gap-lg: 20px;
+2 -7
View File
@@ -36,13 +36,8 @@
font-size: 14px; font-size: 14px;
} }
.widget-content { /* .widget-content 是无样式结构层(对齐参考主题):小工具卡片自带内边距,
padding: var(--card-padding-lg, 20px); * 在这里加 padding 会让所有小工具与内容列宽产生左右空隙。 */
}
.widget-content--flush {
padding: 0;
}
/* Widget 链接 */ /* Widget 链接 */
.widget a { .widget a {
-1
View File
@@ -64,7 +64,6 @@
.zib-widget-wrap { padding:var(--aksrt-widget-space-top,0) var(--aksrt-widget-space-right,0) var(--aksrt-widget-space-bottom,0) var(--aksrt-widget-space-left,0); background-color:var(--aksrt-widget-bg-light,transparent); background-image:var(--aksrt-widget-bg-image-light,none); background-position:center; background-size:cover; } .zib-widget-wrap { padding:var(--aksrt-widget-space-top,0) var(--aksrt-widget-space-right,0) var(--aksrt-widget-space-bottom,0) var(--aksrt-widget-space-left,0); background-color:var(--aksrt-widget-bg-light,transparent); background-image:var(--aksrt-widget-bg-image-light,none); background-position:center; background-size:cover; }
.dark-theme .zib-widget-wrap, [data-theme="dark"] .zib-widget-wrap { background-color:var(--aksrt-widget-bg-dark,var(--aksrt-widget-bg-light,transparent)); background-image:var(--aksrt-widget-bg-image-dark,var(--aksrt-widget-bg-image-light,none)); } .dark-theme .zib-widget-wrap, [data-theme="dark"] .zib-widget-wrap { background-color:var(--aksrt-widget-bg-dark,var(--aksrt-widget-bg-light,transparent)); background-image:var(--aksrt-widget-bg-image-dark,var(--aksrt-widget-bg-image-light,none)); }
.zib-widget-wrap .widget-container { position:relative; } .zib-widget-wrap .widget-container { position:relative; }
.aksrt-user-widget-wrap > .widget-container > div > .widget-content { padding:0; }
.aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline:3px solid var(--focus-color,#ff5473) !important; outline-offset:3px; } .aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline:3px solid var(--focus-color,#ff5473) !important; outline-offset:3px; }
.dark-theme .aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible, [data-theme="dark"] .aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline-color:#ffd166 !important; } .dark-theme .aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible, [data-theme="dark"] .aksrt-user-widget-wrap :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline-color:#ffd166 !important; }
@@ -304,7 +304,10 @@ test('user profile and author widgets render the reference user-card contract',
// 后加载的 widget bundle 明确保留单层卡片并让封面贴边。 // 后加载的 widget bundle 明确保留单层卡片并让封面贴边。
assert.match(widgetCss, /\.user-card\.zib-widget\s*\{[^}]*padding:\s*0;[^}]*overflow:\s*hidden;/s) assert.match(widgetCss, /\.user-card\.zib-widget\s*\{[^}]*padding:\s*0;[^}]*overflow:\s*hidden;/s)
assert.match(legacyMainCss, /\.user-card\.widget \.user-cover \+ \.card-content\s*\{[^}]*margin-top:\s*-55px;/s) assert.match(legacyMainCss, /\.user-card\.widget \.user-cover \+ \.card-content\s*\{[^}]*margin-top:\s*-55px;/s)
assert.match(widgetCss, /\.aksrt-user-widget-wrap > \.widget-container > div > \.widget-content\s*\{\s*padding:\s*0;/) // 参考主题契约:.widget-content 是无样式结构层,小工具卡片自带内边距;
// 任何样式层都不得给 .widget-content 加 padding,否则小工具与内容列宽之间出现左右空隙。
assert.doesNotMatch(widgetCss, /\.widget-content[^{,]*\{[^}]*padding/s)
assert.doesNotMatch(read('assets/css/frontend/sidebar.css'), /\.widget-content[^{,]*\{[^}]*padding/s)
assert.doesNotMatch(widgetCss, /user-card__auth-btns/) assert.doesNotMatch(widgetCss, /user-card__auth-btns/)
assert.doesNotMatch(widgetCss, /\.aksrt-user-card\s*\{/) assert.doesNotMatch(widgetCss, /\.aksrt-user-card\s*\{/)
assert.doesNotMatch(userRenderer, /aksrt-widget-button is-ghost/) assert.doesNotMatch(userRenderer, /aksrt-widget-button is-ghost/)