kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'refactor(vip): simplify user center membership summary' (#376) from worktree-vip-summary into main

Browse Source 
Reviewed-on: CYL/wordpress-theme-aksrt#376
This commit is contained in:
kate522
2026-08-04 18:36:50 +08:00
parent aba5bb3b6e 480a0bb498
commit 6bf3d017f4
3 changed files with 117 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/routes/user-center.css
+1
View File
@@ -1,5 +1,6 @@
@import url("user-center/shell.css");
@import url("user-center/credits.css");
@import url("user-center/vip.css");
@import url("user-center/level.css");
@import url("user-center/settings.css");
@import url("revenue.css");
assets/css/routes/user-center/vip.css
+95
View File
@@ -0,0 +1,95 @@
/**
* User Center — compact membership summary.
*
* The VIP tab keeps one thin status surface; personal profile chrome and
* decorative stacked-card layers belong to the user-center header, not here.
*/
.uc-vip-summary {
position: relative;
min-width: 0;
margin: 0 0 16px;
padding: 12px 16px;
overflow: hidden;
border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
border-radius: var(--main-radius, var(--radius, 8px));
background: var(--surface-1, #fff);
box-shadow: none;
isolation: isolate;
}
.uc-vip-summary__watermark {
position: absolute;
top: 50%;
right: -10px;
z-index: 0;
color: currentColor;
font-size: 160px;
line-height: 1;
opacity: 0.15;
pointer-events: none;
transform: translateY(-50%);
}
.uc-vip-summary__watermark i {
font-size: inherit;
line-height: 1;
}
.uc-vip-status {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: start;
column-gap: 16px;
row-gap: 2px;
min-width: 0;
}
.uc-vip-status__label {
padding-top: 2px;
color: var(--muted-2-color, var(--color-ink-4));
font-size: 13px;
font-weight: 600;
line-height: 1.45;
white-space: nowrap;
}
.uc-vip-status__body {
min-width: 0;
}
.uc-vip-status__main {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
min-width: 0;
}
.uc-vip-status__main > .em16 {
margin-right: 0;
font-size: 1.2em;
line-height: 1.25;
}
.uc-vip-status__desc {
margin-top: 3px;
line-height: 1.4;
}
@media (max-width: 767px) {
.uc-vip-summary {
padding: 10px 12px;
}
.uc-vip-summary__watermark {
font-size: 110px;
opacity: 0.12;
}
.uc-vip-status {
column-gap: 12px;
}
}
inc/helpers/user-center-renderers/vip-tab.php
+21 -56
View File
@@ -25,33 +25,6 @@ $expired_level = (int) get_user_meta($user_id, 'aksrt_vip_level_expired', true);
$levels = is_array($vip_settings['levels'] ?? null) ? $vip_settings['levels'] : [];
$desc_top = (string) ($vip_settings['desc'] ?? '');
$user = get_userdata($user_id);
$display = $user ? $user->display_name : '';
$user_bio = $user ? trim((string) $user->description) : '';
if ($user_bio === '') {
$user_bio = __('这家伙很懒，什么都没有写…', 'aksrt');
}
// Avatar: zibll avatar-img avatar-md (55px fixed box).
$avatar = get_avatar($user_id, 110, '', $display, ['class' => 'avatar']);
// Name row with identity chips (zibll zib_get_user_name parity).
$name_html = '';
if (function_exists('aksrt_get_user_name')) {
$name_html = aksrt_get_user_name([
'id' => $user_id,
'class' => 'flex1 flex ac',
'vip' => true,
'follow' => false,
]);
}
if ($name_html === '') {
$name_html = esc_html($display);
if (function_exists('aksrt_render_user_identity_chips')) {
$name_html .= aksrt_render_user_identity_chips($user_id, 'card');
}
}
// Status column (zibll my_vip_box).
$status_html = '';
$btn_type = 'pay';
@@ -68,48 +41,45 @@ if ($level > 0) {
. esc_html(sprintf(__('到期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires))) . '</span>';
$btn_type = 'renew_' . $level;
}
$status_html = '<div class="uc-vip-status flex xx gap6">'
. '<div class="em09 muted-2-color">' . esc_html__('我的会员', 'aksrt') . '</div>'
. '<div class="flex ac">'
$status_html = '<div class="uc-vip-status">'
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
. '<div class="uc-vip-status__body">'
. '<div class="uc-vip-status__main flex ac">'
. '<div class="em16 mr10 flex ac"><i class="fas fa-crown" aria-hidden="true"></i><div class="font-bold ml6">' . esc_html($lv_name) . '</div></div>'
. $badge
. '</div>'
. '<div class="muted-color em09">' . esc_html($lv_desc !== '' ? $lv_desc : __('尊享专属特权', 'aksrt')) . '</div>'
. '<div class="uc-vip-status__desc muted-color em09">' . esc_html($lv_desc !== '' ? $lv_desc : __('尊享专属特权', 'aksrt')) . '</div>'
. '</div>'
. '</div>';
} elseif ($expired_level > 0) {
$exp_label = $expires > 0
? sprintf(__('过期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires))
: __('已过期', 'aksrt');
$status_html = '<div class="uc-vip-status flex xx gap6">'
. '<div class="em09 muted-2-color">' . esc_html__('当前会员状态', 'aksrt') . '</div>'
. '<div class="flex ac">'
$status_html = '<div class="uc-vip-status">'
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
. '<div class="uc-vip-status__body">'
. '<div class="uc-vip-status__main flex ac">'
. '<div class="em16 c-red mr10">' . esc_html__('已过期', 'aksrt') . '</div>'
. '<div class="badg c-red em09"><i class="fas fa-clock mr3" aria-hidden="true"></i>' . esc_html($exp_label) . '</div>'
. '</div>'
. ($desc_top !== '' ? '<div class="muted-color em09">' . esc_html($desc_top) . '</div>' : '')
. ($desc_top !== '' ? '<div class="uc-vip-status__desc muted-color em09">' . esc_html($desc_top) . '</div>' : '')
. '</div>'
. '</div>';
$btn_type = 'pay';
} else {
// Never opened VIP — zibll: 当前会员状态 / 未开通会员 / desc.
$status_html = '<div class="uc-vip-status flex xx gap6">'
. '<div class="em09 muted-2-color">' . esc_html__('当前会员状态', 'aksrt') . '</div>'
. '<div class="flex ac">'
$status_html = '<div class="uc-vip-status">'
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
. '<div class="uc-vip-status__body">'
. '<div class="uc-vip-status__main flex ac">'
. '<div class="em16 c-red mr10">' . esc_html__('未开通会员', 'aksrt') . '</div>'
. '</div>'
. '<div class="muted-color em09">' . esc_html($desc_top !== '' ? $desc_top : __('开通会员，尊享专属特权', 'aksrt')) . '</div>'
. '<div class="uc-vip-status__desc muted-color em09">' . esc_html($desc_top !== '' ? $desc_top : __('开通会员，尊享专属特权', 'aksrt')) . '</div>'
. '</div>'
. '</div>';
$btn_type = 'pay';
}
// Left user box (zibll user_box).
$user_box = '<div class="flex ac uc-vip-userbox">'
. '<div class="mr20 shrink0"><div class="avatar-img avatar-md">' . $avatar . '</div></div>'
. '<div class="flex1 min-w-0">'
. '<div class="name em12 font-bold">' . $name_html . '</div>'
. '<div class="desc em09 mt6 muted-2-color text-ellipsis">' . esc_html($user_bio) . '</div>'
. '</div>'
. '</div>';
// Level cards.
$cards = '';
foreach ([1, 2] as $lv) {
@@ -175,14 +145,9 @@ if ($level <= 0 && !empty($vip_settings['points_exchange']['enabled'])) {
}
?>
<div class="uc-vip-tab" data-aksrt-vip-tab>
<div class="zib-widget flex ac gap20 user-content-myvip overflow-hidden">
<div class="vip-img abs-right" aria-hidden="true"><i class="fas fa-crown"></i></div>
<div class="flex2 hide-sm uc-vip-profile">
<?php echo $user_box; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
<div class="flex4 uc-vip-state">
<?php echo $status_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
<div class="uc-vip-summary" data-aksrt-vip-summary>
<div class="uc-vip-summary__watermark" aria-hidden="true"><i class="fas fa-crown"></i></div>
<?php echo $status_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
<div class="uc-vip-level-cards">