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

Merge pull request 'feat(frontend): Zibll-like header user box with VIP and admin shortcuts' (#61) from worktree-frontend-header-userbox into main

Browse Source 
Reviewed-on: CYL/wordpress-theme-aksrt#61
This commit is contained in:
kate522
2026-07-11 21:02:17 +08:00
parent b155936868 2d9ee12ef6
commit fd0eb52e10
2 changed files with 241 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/frontend/nav/mobile-toggle.css
+131
View File
@@ -669,3 +669,134 @@
gap: 8px;
}
/* ============================================================
* Header user box (Zibll-like sub-user-box grid)
* ============================================================ */
.nav-user__toggle {
position: relative;
}
.nav-user__dot {
position: absolute;
top: 0;
right: 0;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--color-error, #ef4444);
border: 2px solid var(--surface-1, #fff);
}
.nav-user__guest-avatar {
width: 36px;
height: 36px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--surface-2);
color: var(--color-ink-3);
}
.user-dropdown {
width: 300px;
padding: 14px 12px 12px;
}
.user-dropdown__profile.user-info {
position: relative;
padding-right: 42px;
}
.user-dropdown__meta {
min-width: 0;
flex: 1;
}
.user-dropdown__name {
display: flex;
align-items: center;
gap: 6px;
flex-wrap: wrap;
}
.user-dropdown__msg {
position: absolute;
top: 8px;
right: 8px;
width: 34px;
height: 34px;
border-radius: 50%;
display: inline-flex !important;
align-items: center;
justify-content: center;
padding: 0 !important;
background: var(--surface-2);
color: var(--color-ink-3);
}
.user-dropdown__msg:hover {
background: var(--surface-3);
color: var(--color-primary);
}
.user-dropdown__msg .user-dropdown__badge {
position: absolute;
top: -4px;
right: -4px;
margin: 0;
}
.user-dropdown__guest-title {
padding: 4px 8px 12px;
text-align: center;
font-weight: 700;
color: var(--color-ink);
}
.user-dropdown__actions {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 8px 4px;
padding: 4px 2px 2px;
}
.user-dropdown__actions--admin {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.user-dropdown__action {
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap: 6px !important;
width: auto !important;
height: auto !important;
min-height: 0;
padding: 6px 4px !important;
text-align: center !important;
font-size: 12px !important;
line-height: 1.25;
color: var(--color-ink-3) !important;
background: transparent !important;
}
.user-dropdown__action:hover {
background: transparent !important;
color: var(--color-primary) !important;
}
.user-dropdown__action-icon {
width: 40px;
height: 40px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 15px;
color: #fff;
}
.user-dropdown__action-icon.is-blue { background: linear-gradient(135deg, #60a5fa, #3b82f6); }
.user-dropdown__action-icon.is-purple { background: linear-gradient(135deg, #a78bfa, #8b5cf6); }
.user-dropdown__action-icon.is-green { background: linear-gradient(135deg, #34d399, #10b981); }
.user-dropdown__action-icon.is-red { background: linear-gradient(135deg, #f87171, #ef4444); }
.user-dropdown__action-icon.is-yellow { background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #1f2937; }
.user-dropdown__action.is-danger {
color: var(--color-error, #ef4444) !important;
}
.user-dropdown__credits {
margin-top: 2px;
border-radius: 12px;
background: var(--surface-2);
margin-left: 4px;
margin-right: 4px;
width: auto;
}
header.php
+110 -28
View File
@@ -142,6 +142,22 @@ if (!empty($aksrt_bg_styles)) {
$aksrt_currency_name = class_exists('AKSRT_Settings') ? AKSRT_Settings::get_currency_name() : __('积分', 'aksrt');
$aksrt_orders_url = home_url('/orders/');
$aksrt_publish_url = admin_url('post-new.php');
$aksrt_messages_url = function_exists('aksrt_get_user_center_url') ? aksrt_get_user_center_url('notif') : home_url('/');
$aksrt_unread_count = (is_user_logged_in() && function_exists('aksrt_get_user_unread_notification_count'))
? (int) aksrt_get_user_unread_notification_count(get_current_user_id())
: 0;
$aksrt_user_desc = is_user_logged_in()
? (string) get_user_meta(get_current_user_id(), 'description', true)
: '';
if ($aksrt_user_desc === '' && is_user_logged_in()) {
$aksrt_user_desc = (string) $aksrt_current_user->user_email;
}
$aksrt_vip_badge_html = (is_user_logged_in() && function_exists('aksrt_render_vip_badge'))
? aksrt_render_vip_badge(get_current_user_id(), 'sm')
: '';
$aksrt_theme_settings_url = function_exists('aksrt_get_admin_settings_url')
? aksrt_get_admin_settings_url('')
: admin_url('admin.php?page=aksrt-settings');
$aksrt_theme_toggle_positions = class_exists('AKSRT_Settings')
? AKSRT_Settings::get_theme_mode_button_positions()
: ['pc_nav', 'm_menu'];
@@ -258,39 +274,105 @@ if (!empty($aksrt_bg_styles)) {
</div>
<?php if ($aksrt_show_user_entry) : ?>
<?php if (is_user_logged_in()) : ?>
<div class="nav-user">
<button type="button" class="nav-user__toggle navbar-avatar" id="user-menu-toggle" aria-expanded="false" aria-controls="user-dropdown">
<?php echo get_avatar(get_current_user_id(), 36, '', esc_attr($aksrt_current_user->display_name), ['loading' => 'lazy']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</button>
<div class="user-dropdown sub-user-box" id="user-dropdown">
<div class="user-dropdown__profile">
<?php echo get_avatar(get_current_user_id(), 44, '', esc_attr($aksrt_current_user->display_name), ['loading' => 'lazy']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
<div>
<div class="user-dropdown__name"><?php echo esc_html($aksrt_current_user->display_name ?: $aksrt_current_user->user_login); ?></div>
<div class="user-dropdown__email"><?php echo esc_html($aksrt_current_user->user_email); ?></div>
<?php if (is_user_logged_in()) : ?>
<div class="nav-user">
<button type="button" class="nav-user__toggle navbar-avatar" id="user-menu-toggle" aria-expanded="false" aria-controls="user-dropdown">
<?php echo get_avatar(get_current_user_id(), 36, '', esc_attr($aksrt_current_user->display_name), ['loading' => 'lazy']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
<?php if ($aksrt_unread_count > 0) : ?>
<span class="nav-user__dot aksrt-notification-badge" aria-hidden="true"></span>
<?php endif; ?>
</button>
<div class="user-dropdown sub-user-box" id="user-dropdown">
<div class="user-dropdown__profile user-info">
<?php echo get_avatar(get_current_user_id(), 44, '', esc_attr($aksrt_current_user->display_name), ['loading' => 'lazy']); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
<div class="user-dropdown__meta">
<div class="user-dropdown__name">
<?php echo esc_html($aksrt_current_user->display_name ?: $aksrt_current_user->user_login); ?>
<?php echo $aksrt_vip_badge_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
<div class="user-dropdown__email muted-2-color text-ellipsis"><?php echo esc_html($aksrt_user_desc); ?></div>
</div>
<a class="user-dropdown__msg" href="<?php echo esc_url($aksrt_messages_url); ?>" title="<?php esc_attr_e('消息中心', 'aksrt'); ?>" aria-label="<?php esc_attr_e('消息中心', 'aksrt'); ?>">
<i class="fas fa-bell" aria-hidden="true"></i>
<?php if ($aksrt_unread_count > 0) : ?>
<span class="user-dropdown__badge aksrt-notification-badge"><?php echo esc_html((string) min(99, $aksrt_unread_count)); ?></span>
<?php endif; ?>
</a>
</div>
<div class="user-dropdown__credits">
<i class="fas fa-coins" aria-hidden="true"></i>
<span class="user-dropdown__credits-label"><?php echo esc_html($aksrt_currency_name); ?></span>
<span class="user-dropdown__credits-value"><?php echo esc_html(number_format_i18n($aksrt_user_credit)); ?></span>
</div>
<div class="user-dropdown__sep"></div>
<div class="user-dropdown__actions header-user-href">
<a class="user-dropdown__action" href="<?php echo esc_url(aksrt_get_user_center_url()); ?>">
<span class="user-dropdown__action-icon is-blue"><i class="fas fa-user" aria-hidden="true"></i></span>
<span><?php esc_html_e('用户中心', 'aksrt'); ?></span>
</a>
<a class="user-dropdown__action" href="<?php echo esc_url($aksrt_orders_url); ?>">
<span class="user-dropdown__action-icon is-purple"><i class="fas fa-shopping-bag" aria-hidden="true"></i></span>
<span><?php esc_html_e('我的订单', 'aksrt'); ?></span>
</a>
<?php if ($aksrt_can_publish) : ?>
<a class="user-dropdown__action" href="<?php echo esc_url($aksrt_publish_url); ?>">
<span class="user-dropdown__action-icon is-green"><i class="fas fa-pen" aria-hidden="true"></i></span>
<span><?php esc_html_e('发布内容', 'aksrt'); ?></span>
</a>
<?php endif; ?>
<a class="user-dropdown__action is-danger" href="<?php echo esc_url(wp_logout_url(home_url('/'))); ?>">
<span class="user-dropdown__action-icon is-red"><i class="fas fa-sign-out-alt" aria-hidden="true"></i></span>
<span><?php esc_html_e('退出登录', 'aksrt'); ?></span>
</a>
</div>
<?php if (current_user_can('manage_options')) : ?>
<div class="user-dropdown__sep"></div>
<div class="user-dropdown__actions header-user-href user-dropdown__actions--admin">
<a class="user-dropdown__action" href="<?php echo esc_url($aksrt_theme_settings_url); ?>">
<span class="user-dropdown__action-icon is-yellow"><i class="fas fa-sliders-h" aria-hidden="true"></i></span>
<span><?php esc_html_e('主题设置', 'aksrt'); ?></span>
</a>
<a class="user-dropdown__action" href="<?php echo esc_url(admin_url()); ?>">
<span class="user-dropdown__action-icon is-yellow"><i class="fas fa-cog" aria-hidden="true"></i></span>
<span><?php esc_html_e('后台管理', 'aksrt'); ?></span>
</a>
</div>
<?php endif; ?>
</div>
</div>
<?php else : ?>
<div class="nav-user nav-user--guest">
<button type="button" class="nav-user__toggle navbar-avatar signin-loader" id="user-menu-toggle" aria-expanded="false" aria-controls="user-dropdown">
<span class="nav-user__guest-avatar" aria-hidden="true"><i class="fas fa-user"></i></span>
</button>
<div class="user-dropdown sub-user-box" id="user-dropdown">
<div class="user-dropdown__guest-title"><?php esc_html_e('欢迎来到本站', 'aksrt'); ?></div>
<div class="user-dropdown__actions header-user-href">
<a class="user-dropdown__action signin-loader" href="javascript:;">
<span class="user-dropdown__action-icon is-blue"><i class="fas fa-sign-in-alt" aria-hidden="true"></i></span>
<span><?php esc_html_e('登录', 'aksrt'); ?></span>
</a>
<?php if (get_option('users_can_register')) : ?>
<a class="user-dropdown__action signup-loader" href="javascript:;">
<span class="user-dropdown__action-icon is-green"><i class="fas fa-user-plus" aria-hidden="true"></i></span>
<span><?php esc_html_e('注册', 'aksrt'); ?></span>
</a>
<?php endif; ?>
<a class="user-dropdown__action" href="<?php echo esc_url(wp_lostpassword_url(home_url('/'))); ?>">
<span class="user-dropdown__action-icon is-purple"><i class="fas fa-key" aria-hidden="true"></i></span>
<span><?php esc_html_e('找回密码', 'aksrt'); ?></span>
</a>
</div>
</div>
<div class="user-dropdown__credits">
<i class="fas fa-coins" aria-hidden="true"></i>
<span class="user-dropdown__credits-label"><?php echo esc_html($aksrt_currency_name); ?></span>
<span class="user-dropdown__credits-value"><?php echo esc_html(number_format_i18n($aksrt_user_credit)); ?></span>
</div>
<div class="user-dropdown__sep"></div>
<a class="user-dropdown__item header-user-href" href="<?php echo esc_url(aksrt_get_user_center_url()); ?>"><span><?php esc_html_e('用户中心', 'aksrt'); ?></span></a>
<a class="user-dropdown__item header-user-href" href="<?php echo esc_url($aksrt_orders_url); ?>"><span><?php esc_html_e('我的订单', 'aksrt'); ?></span></a>
<?php if ($aksrt_can_publish) : ?>
<a class="user-dropdown__item header-user-href" href="<?php echo esc_url($aksrt_publish_url); ?>"><span><?php esc_html_e('发布内容', 'aksrt'); ?></span></a>
<?php endif; ?>
<a class="user-dropdown__item user-dropdown__logout header-user-href" href="<?php echo esc_url(wp_logout_url(home_url('/'))); ?>"><span><?php esc_html_e('退出登录', 'aksrt'); ?></span></a>
</div>
</div>
<?php else : ?>
<a class="btn-outline" href="<?php echo esc_url(aksrt_get_login_url()); ?>"><?php esc_html_e('登录', 'aksrt'); ?></a>
<?php endif; ?>
<?php endif; ?>
<?php endif; ?>
<?php if (!empty($aksrt_header_settings['mobile_drawer'])) : ?>
<?php if (!empty($aksrt_header_settings['mobile_drawer'])) : ?>
<button type="button" class="icon-btn nav-toggle" id="nav-toggle" aria-expanded="false" aria-controls="nav-drawer">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 12h18"/><path d="M3 6h18"/><path d="M3 18h18"/></svg>
</button>