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

Merge pull request 'fix(frontend): unbreak single post layout cascade' (#136) from worktree-fix-single-page-layout into main

Browse Source 
Reviewed-on: CYL/wordpress-theme-aksrt#136
This commit is contained in:
kate522
2026-07-14 23:39:50 +08:00
parent ffd3d0f6c5 db361fcc3f
commit 2c38a0e9ea
7 changed files with 169 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/frontend/single-post.css
+1
View File
@@ -1,3 +1,4 @@
@import url("zibll-utilities.css");
@import url("single-post/shell.css");
@import url("single-post/content.css");
@import url("single-post/code-blocks.css");
assets/css/frontend/single-post/author-actions.css
+15 -1
View File
@@ -98,6 +98,12 @@
}
/* ===== Action Buttons Card ===== */
.post-actions-wrap {
position: relative;
text-align: center;
margin-bottom: 16px;
}
.post-actions-card,
.post-actions {
position: relative;
@@ -105,6 +111,10 @@
margin-bottom: 16px;
}
.post-actions-wrap > .post-actions {
margin-bottom: 0;
}
.post-actions-card__hint {
font-size: 13px;
color: var(--color-ink-4, var(--color-ink-4));
@@ -482,9 +492,13 @@ html.dark .post-drop-meta__item:hover {
gap: 0;
}
.single-metabox .post-metas item {
.single-metabox .post-metas item,
.single-metabox .post-metas .item {
margin: 0 6px;
font-size: 13px;
display: inline-flex;
align-items: center;
gap: 4px;
}
.single-metabox .post-drop-meta {
assets/css/frontend/single-post/shell.css
+20
View File
@@ -9,6 +9,26 @@ body.single .content-wrap {
width: 100%;
}
/*
* Global layout.css turns .content-layout into a 2-col grid that expects
* .content-layout__primary + .content-layout__aside children.
* Single posts put breadcrumb / article / author / related / comments as
* direct children and float the sidebar outside — so the grid must be
* disabled here or those sections tile left/right and look "broken".
*/
body.single main.container .content-layout {
display: block;
grid-template-columns: none;
gap: 0;
width: 100%;
min-width: 0;
}
body.single main.container .content-layout > * {
min-width: 0;
max-width: 100%;
}
/* Clear floats after main dual-column shell */
body.single main.container::after {
content: "";
assets/css/frontend/zibll-utilities.css
+116
View File
@@ -0,0 +1,116 @@
/**
* Zibll utility class bridge
*
* Single / author / meta markup still uses Zibll utility class names
* (.flex / .ac / .jsb / .abs-right / .muted-2-color / …). Without these
* helpers the author bar and meta row collapse into a vertical mess.
*
* Keep this file tiny and pure utility — domain styles stay in single-post/*.
*/
/* Layout helpers */
.relative { position: relative; }
.flex { display: flex; }
.flex.ac,
.ac { align-items: center; }
.flex.jc,
.jc { justify-content: center; }
.flex.jsb,
.jsb { justify-content: space-between; }
.flex.at,
.at { align-items: flex-start; }
.flex.ae,
.ae { align-items: flex-end; }
.flex0 { flex: 0 0 auto; }
.flex1 { flex: 1 1 auto; min-width: 0; }
.flex.column { flex-direction: column; }
.flex.wrap { flex-wrap: wrap; }
.clearfix::before,
.clearfix::after {
content: "";
display: table;
}
.clearfix::after {
clear: both;
}
.abs-right {
position: absolute;
right: 0;
top: 0;
}
.abs-center {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
/* Typography / color helpers */
.muted-color { color: var(--muted-color, var(--color-ink-3)); }
.muted-2-color { color: var(--muted-2-color, var(--color-ink-4)); }
.muted-3-color { color: var(--muted-3-color, #b1b1b1); }
.muted-4-color { color: var(--muted-4-color, #d2d2d2); }
.text-center { text-align: center; }
.em09 { font-size: 0.9em; }
.em12 { font-size: 1.2em; }
.px12-sm { font-size: 12px; }
.ml3 { margin-left: 3px; }
.ml6 { margin-left: 6px; }
.ml10 { margin-left: 10px; }
.mr3 { margin-right: 3px; }
.mr6 { margin-right: 6px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 100%;
}
.text-ellipsis-2 {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-word;
}
/* Surfaces used by single article shell */
.main-bg {
background-color: var(--main-bg-color, var(--surface-1));
}
.separator {
position: relative;
letter-spacing: 0.08em;
}
/* Compact inline separators inside meta/time rows */
.icon-circle + .icon-circle::before {
content: "·";
display: inline-block;
margin: 0 0.45em;
opacity: 0.55;
}
/* Author name row (was a non-standard <name> element) */
.article-avatar name,
.article-avatar .name,
.user-name {
display: inline-flex;
align-items: center;
gap: 4px;
min-width: 0;
max-width: 100%;
}
.pull-right { float: right; }
.pull-left { float: left; }
inc/helpers/aksrt-single-components.php
+8 -8
View File
@@ -73,13 +73,13 @@ if (!function_exists('aksrt_get_posts_meta_items_html')) :
? 'javascript:(typeof scrollTopTo===\'function\'?scrollTopTo(\'#comments\'):void(0));'
: get_comments_link($post_id);
$count = (int) get_comments_number($post_id);
$html .= '<item class="meta-comm"><a rel="nofollow" href="' . esc_attr($href) . '" title="' . esc_attr__('去评论', 'aksrt') . '">'
. '<i class="fa fa-comment-o" aria-hidden="true"></i> ' . esc_html((string) $count) . '</a></item>';
$html .= '<span class="item meta-comm"><a rel="nofollow" href="' . esc_attr($href) . '" title="' . esc_attr__('去评论', 'aksrt') . '">'
. '<i class="fa fa-comment-o" aria-hidden="true"></i> ' . esc_html((string) $count) . '</a></span>';
}
$views = function_exists('aksrt_get_post_views') ? (int) aksrt_get_post_views($post_id) : 0;
$views_label = function_exists('aksrt_format_number') ? aksrt_format_number($views) : number_format_i18n($views);
$html .= '<item class="meta-view"><i class="fa fa-eye" aria-hidden="true"></i> ' . esc_html((string) $views_label) . '</item>';
$html .= '<span class="item meta-view"><i class="fa fa-eye" aria-hidden="true"></i> ' . esc_html((string) $views_label) . '</span>';
$like_on = true;
if (class_exists('AKSRT_Settings')) {
@@ -88,7 +88,7 @@ if (!function_exists('aksrt_get_posts_meta_items_html')) :
}
if ($like_on && $post->post_type === 'post') {
$likes = function_exists('aksrt_get_post_likes') ? (int) aksrt_get_post_likes($post_id) : 0;
$html .= '<item class="meta-like"><i class="fa fa-heart-o" aria-hidden="true"></i> ' . esc_html((string) $likes) . '</item>';
$html .= '<span class="item meta-like"><i class="fa fa-heart-o" aria-hidden="true"></i> ' . esc_html((string) $likes) . '</span>';
}
return $html;
@@ -154,8 +154,8 @@ if (!function_exists('aksrt_get_post_status_badge')) :
if (!isset($map[$status])) {
return '';
}
return '<badge class="img-badge right ' . esc_attr($map[$status]['class']) . '">'
. esc_html($map[$status]['label']) . '</badge>';
return '<span class="badge img-badge right ' . esc_attr($map[$status]['class']) . '">'
. esc_html($map[$status]['label']) . '</span>';
}
endif;
@@ -504,8 +504,8 @@ if (!function_exists('aksrt_render_related_graphic_card')) :
$html .= '<img ' . $img_attrs . ' alt="' . esc_attr($title) . '">';
$html .= '<div class="abs-center left-bottom graphic-text">';
$html .= '<div class="text1 text-ellipsis">' . esc_html($title) . '</div>';
$html .= '<div class="text3 muted-2-color em09"><item>' . esc_html($time) . '</item>';
$html .= '<item class="pull-right"><i class="fa fa-eye" aria-hidden="true"></i> ' . esc_html((string) $views_label) . '</item></div>';
$html .= '<div class="text3 muted-2-color em09"><span class="item">' . esc_html($time) . '</span>';
$html .= '<span class="item pull-right"><i class="fa fa-eye" aria-hidden="true"></i> ' . esc_html((string) $views_label) . '</span></div>';
$html .= '</div></div></a></div></div>';
return $html;
}
inc/helpers/aksrt-single.php
+6 -4
View File
@@ -363,7 +363,8 @@ if (!function_exists('aksrt_single_render_actions')) :
$is_favorited = !empty($ctx['is_favorited']);
?>
<div class="text-center muted-3-color box-body em09"><?php echo esc_html($settings['button_toptext'] ?? __('喜欢就支持一下吧', 'aksrt')); ?></div>
<div class="text-center post-actions">
<div class="post-actions-wrap relative">
<div class="text-center post-actions">
<?php if (!empty($settings['like_enabled'])) : ?>
<button type="button" class="action action-like<?php echo $is_liked ? ' is-active' : ''; ?>" id="action-like" data-post-id="<?php echo esc_attr((string) $post_id); ?>" data-initial-active="<?php echo $is_liked ? '1' : '0'; ?>">
<i class="<?php echo $is_liked ? 'fas' : 'far'; ?> fa-heart" aria-hidden="true"></i>
@@ -391,9 +392,9 @@ if (!function_exists('aksrt_single_render_actions')) :
<span class="action-btn__count" data-stat-count="favorites" data-base-count="<?php echo esc_attr((string) $favorite_count); ?>"><?php echo esc_html((string) $favorite_count); ?></span>
</button>
<?php endif; ?>
</div>
</div>
<?php if (!empty($settings['share_enabled'])) : ?>
<?php if (!empty($settings['share_enabled'])) : ?>
<div class="share-dropdown" id="share-dropdown" aria-hidden="true">
<div class="share-dropdown__grid">
<button type="button" class="share-item" data-platform="qq"><i class="fab fa-qq"></i><span>QQ</span></button>
@@ -404,7 +405,8 @@ if (!function_exists('aksrt_single_render_actions')) :
</div>
<div id="share-qrcode-box" aria-hidden="true"><img id="share-qrcode-image" src="" alt="QR Code"></div>
</div>
<?php endif; ?>
<?php endif; ?>
</div>
<?php if (!empty($settings['rewards_enabled']) && !empty($settings['rewards_image'])) : ?>
<div class="reward-modal" id="reward-modal" aria-hidden="true">
templates/parts/single-author-bar.php
+3 -3
View File
@@ -69,7 +69,7 @@ if (class_exists('AKSRT_User_Home')) {
<?php endif; ?>
<div class="user-right flex flex1 ac jsb ml10">
<div class="flex1">
<name class="flex ac flex1">
<span class="name flex ac flex1">
<a class="display-name text-ellipsis" href="<?php echo esc_url($author_url); ?>"><?php echo esc_html($author_name); ?></a>
<?php if ($vip_badge !== '') : ?>
<?php echo $vip_badge; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
@@ -80,7 +80,7 @@ if (class_exists('AKSRT_User_Home')) {
<?php echo esc_html((string) ($signal['label'] ?? '')); ?>
</span>
<?php endforeach; ?>
</name>
</span>
<div class="px12-sm muted-2-color text-ellipsis">
<?php if ($show_time) : ?>
<span class="icon-circle" title="<?php echo esc_attr($abs_fmt); ?>" data-toggle="tooltip"><?php echo esc_html($time_text); ?></span>
@@ -132,7 +132,7 @@ if (class_exists('AKSRT_User_Home')) {
continue;
}
?>
<item class="meta-view"><?php if ($meta_icon !== '') : ?><i class="<?php echo esc_attr($meta_icon); ?>" aria-hidden="true"></i> <?php endif; ?><?php echo esc_html($meta_text); ?></item>
<span class="item meta-view"><?php if ($meta_icon !== '') : ?><i class="<?php echo esc_attr($meta_icon); ?>" aria-hidden="true"></i> <?php endif; ?><?php echo esc_html($meta_text); ?></span>
<?php endforeach; ?>
</div>
</div>