fix(vip): flatten panel and format membership summary
Remove the shared dashboard card around the VIP panel and render membership details as title, level, intro, and expiry rows. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Claude Fable 5
@@ -36,47 +36,60 @@
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.uc-content #panel-vip.dashboard-panel {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
background: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
.uc-vip-status {
|
.uc-vip-status {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
display: grid;
|
display: flex;
|
||||||
grid-template-columns: auto minmax(0, 1fr);
|
flex-direction: column;
|
||||||
align-items: start;
|
align-items: flex-start;
|
||||||
column-gap: 16px;
|
gap: 4px;
|
||||||
row-gap: 2px;
|
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uc-vip-status__label {
|
.uc-vip-status__label {
|
||||||
padding-top: 2px;
|
color: var(--color-ink, var(--main-color, #172033));
|
||||||
color: var(--muted-2-color, var(--color-ink-4));
|
font-size: 14px;
|
||||||
font-size: 13px;
|
font-weight: 700;
|
||||||
font-weight: 600;
|
line-height: 1.4;
|
||||||
line-height: 1.45;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.uc-vip-status__body {
|
|
||||||
min-width: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.uc-vip-status__main {
|
.uc-vip-status__main {
|
||||||
display: flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
gap: 7px;
|
||||||
gap: 6px;
|
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
font-size: 1.15em;
|
||||||
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uc-vip-status__main > .em16 {
|
.uc-vip-status__main > i {
|
||||||
margin-right: 0;
|
color: var(--focus-color, var(--color-primary, #f04494));
|
||||||
font-size: 1.2em;
|
font-size: 0.95em;
|
||||||
line-height: 1.25;
|
}
|
||||||
|
|
||||||
|
.uc-vip-status__desc,
|
||||||
|
.uc-vip-status__expiry {
|
||||||
|
min-width: 0;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uc-vip-status__desc {
|
.uc-vip-status__desc {
|
||||||
margin-top: 3px;
|
margin-top: 1px;
|
||||||
line-height: 1.4;
|
}
|
||||||
|
|
||||||
|
.uc-vip-status__expiry {
|
||||||
|
margin-top: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
|
|||||||
@@ -25,57 +25,52 @@ $expired_level = (int) get_user_meta($user_id, 'aksrt_vip_level_expired', true);
|
|||||||
$levels = is_array($vip_settings['levels'] ?? null) ? $vip_settings['levels'] : [];
|
$levels = is_array($vip_settings['levels'] ?? null) ? $vip_settings['levels'] : [];
|
||||||
$desc_top = (string) ($vip_settings['desc'] ?? '');
|
$desc_top = (string) ($vip_settings['desc'] ?? '');
|
||||||
|
|
||||||
// Status column (zibll my_vip_box).
|
// Membership summary: title → level → intro → expiry.
|
||||||
$status_html = '';
|
$status_html = '';
|
||||||
$btn_type = 'pay';
|
$btn_type = 'pay';
|
||||||
if ($level > 0) {
|
if ($level > 0) {
|
||||||
$lv_name = (string) ($levels[$level]['name'] ?? ('VIP' . $level));
|
$lv_name = (string) ($levels[$level]['name'] ?? ('VIP' . $level));
|
||||||
$lv_desc = (string) ($levels[$level]['desc'] ?? '');
|
$lv_desc = (string) ($levels[$level]['desc'] ?? '');
|
||||||
if ($expires <= 0) {
|
if ($expires <= 0) {
|
||||||
$badge = '<span class="badg c-green p2-10 em09"><i class="fas fa-clock mr3" aria-hidden="true"></i>' . esc_html__('永久会员', 'aksrt') . '</span>';
|
$expiry_text = __('到期时间：永久会员', 'aksrt');
|
||||||
|
$expiry_class = 'c-green';
|
||||||
if ($level < 2) {
|
if ($level < 2) {
|
||||||
$btn_type = 'upgrade';
|
$btn_type = 'upgrade';
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
$badge = '<span class="badg c-yellow p2-10 em09"><i class="fas fa-clock mr3" aria-hidden="true"></i>'
|
$expiry_text = sprintf(__('到期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires));
|
||||||
. esc_html(sprintf(__('到期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires))) . '</span>';
|
$expiry_class = 'c-yellow';
|
||||||
$btn_type = 'renew_' . $level;
|
$btn_type = 'renew_' . $level;
|
||||||
}
|
}
|
||||||
$status_html = '<div class="uc-vip-status">'
|
$status_html = '<div class="uc-vip-status">'
|
||||||
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
||||||
. '<div class="uc-vip-status__body">'
|
. '<div class="uc-vip-status__main"><i class="fas fa-crown" aria-hidden="true"></i><span class="font-bold">' . esc_html($lv_name) . '</span></div>'
|
||||||
. '<div class="uc-vip-status__main flex ac">'
|
. '<div class="uc-vip-status__desc muted-color">' . esc_html($lv_desc !== '' ? $lv_desc : __('尊享专属特权', 'aksrt')) . '</div>'
|
||||||
. '<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>'
|
. '<div class="uc-vip-status__expiry ' . esc_attr($expiry_class) . '">' . esc_html($expiry_text) . '</div>'
|
||||||
. $badge
|
|
||||||
. '</div>'
|
|
||||||
. '<div class="uc-vip-status__desc muted-color em09">' . esc_html($lv_desc !== '' ? $lv_desc : __('尊享专属特权', 'aksrt')) . '</div>'
|
|
||||||
. '</div>'
|
|
||||||
. '</div>';
|
. '</div>';
|
||||||
} elseif ($expired_level > 0) {
|
} elseif ($expired_level > 0) {
|
||||||
$exp_label = $expires > 0
|
$expired_name = (string) ($levels[$expired_level]['name'] ?? ('VIP' . $expired_level));
|
||||||
? sprintf(__('过期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires))
|
$expired_desc = (string) ($levels[$expired_level]['desc'] ?? '');
|
||||||
: __('已过期', 'aksrt');
|
if ($expired_desc === '') {
|
||||||
|
$expired_desc = $desc_top !== '' ? $desc_top : __('会员已过期', 'aksrt');
|
||||||
|
}
|
||||||
|
$expiry_text = $expires > 0
|
||||||
|
? sprintf(__('到期时间：%s', 'aksrt'), wp_date('Y年m月d日', $expires))
|
||||||
|
: __('到期时间：已过期', 'aksrt');
|
||||||
$status_html = '<div class="uc-vip-status">'
|
$status_html = '<div class="uc-vip-status">'
|
||||||
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
||||||
. '<div class="uc-vip-status__body">'
|
. '<div class="uc-vip-status__main c-red"><i class="fas fa-crown" aria-hidden="true"></i><span class="font-bold">' . esc_html($expired_name) . '</span></div>'
|
||||||
. '<div class="uc-vip-status__main flex ac">'
|
. '<div class="uc-vip-status__desc muted-color">' . esc_html($expired_desc) . '</div>'
|
||||||
. '<div class="em16 c-red mr10">' . esc_html__('已过期', 'aksrt') . '</div>'
|
. '<div class="uc-vip-status__expiry c-red">' . esc_html($expiry_text) . '</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="uc-vip-status__desc muted-color em09">' . esc_html($desc_top) . '</div>' : '')
|
|
||||||
. '</div>'
|
|
||||||
. '</div>';
|
. '</div>';
|
||||||
$btn_type = 'pay';
|
$btn_type = 'pay';
|
||||||
} else {
|
} else {
|
||||||
// Never opened VIP — zibll: 当前会员状态 / 未开通会员 / desc.
|
// Never opened VIP: keep the same four-line summary shape.
|
||||||
$status_html = '<div class="uc-vip-status">'
|
$status_html = '<div class="uc-vip-status">'
|
||||||
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
. '<div class="uc-vip-status__label">' . esc_html__('我的会员', 'aksrt') . '</div>'
|
||||||
. '<div class="uc-vip-status__body">'
|
. '<div class="uc-vip-status__main c-red"><i class="fas fa-crown" aria-hidden="true"></i><span class="font-bold">' . esc_html__('未开通会员', 'aksrt') . '</span></div>'
|
||||||
. '<div class="uc-vip-status__main flex ac">'
|
. '<div class="uc-vip-status__desc muted-color">' . esc_html($desc_top !== '' ? $desc_top : __('开通会员，尊享专属特权', 'aksrt')) . '</div>'
|
||||||
. '<div class="em16 c-red mr10">' . esc_html__('未开通会员', 'aksrt') . '</div>'
|
. '<div class="uc-vip-status__expiry muted-2-color">' . esc_html__('到期时间：未开通', 'aksrt') . '</div>'
|
||||||
. '</div>'
|
|
||||||
. '<div class="uc-vip-status__desc muted-color em09">' . esc_html($desc_top !== '' ? $desc_top : __('开通会员，尊享专属特权', 'aksrt')) . '</div>'
|
|
||||||
. '</div>'
|
|
||||||
. '</div>';
|
. '</div>';
|
||||||
$btn_type = 'pay';
|
$btn_type = 'pay';
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user