interlope/bludit-blowfish
1
0 Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Refactor sidebar profile to author card with enhanced styling and social links

Browse Source
This commit is contained in:
interlope committed 2026-06-01 21:26:45 +02:00
1 parent 7f2ed60a89
commit 824cd6ffa0
3 files changed
+74 -22
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

css/style.css
+51 -14
View File
@@ -977,38 +977,75 @@ img.nav-svg-icon {
font-size: 0.9rem;
}
/* Compact profile card inside the sidebar (article view) */
.sidebar-profile {
/* Author card inside the sidebar (article view) */
.sidebar-author {
padding-bottom: 1.2rem;
margin-bottom: 1.2rem;
border-bottom: 1px solid var(--border-subtle);
}
.sidebar-profile-avatar {
width: 84px;
height: 84px;
.sidebar-author-label {
display: block;
font-size: var(--font-size-xs);
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--text-muted);
margin-bottom: 0.6rem;
}
.sidebar-author-identity {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.sidebar-author-avatar {
width: 52px;
height: 52px;
border-radius: 50%;
object-fit: cover;
border: 3px solid var(--bg-surface);
box-shadow: var(--shadow-sm);
margin-bottom: var(--space-sm);
flex-shrink: 0;
border: 2px solid var(--border-color);
transition: transform 0.2s ease;
}
.sidebar-profile-avatar:hover {
.sidebar-author-avatar:hover {
transform: translateY(-2px);
}
.sidebar-profile-name {
.sidebar-author-name {
font-weight: 700;
font-size: 1rem;
font-size: 0.95rem;
color: var(--text-primary);
line-height: 1.3;
}
.sidebar-profile-bio {
.sidebar-author-bio {
color: var(--text-secondary);
font-size: var(--font-size-sm);
margin: 0.35rem 0 0;
font-size: var(--font-size-xs);
margin: 0.2rem 0 0;
line-height: 1.4;
}
.sidebar-author-social {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.sidebar-social-icon {
width: 1.1rem;
height: 1.1rem;
opacity: 0.55;
transition: opacity 0.2s ease, transform 0.2s ease;
filter: var(--social-icon-filter);
}
.sidebar-author-social a:hover .sidebar-social-icon {
opacity: 1;
transform: translateY(-2px);
}
.plugin {
php/head.php
+1 -1
View File
@@ -5,7 +5,7 @@
<!-- Set the colour theme as early as possible to avoid a white flash.
Sets data-theme AND paints the html background/color-scheme inline, so the
very first frame (before style.css loads) already uses the theme colour. -->
<script>
<script data-cfasync="false">
window.BLOWDIT_THEME_BG = {
light: '#ffffff',
dark: '#171717',
php/sidebar.php
+22 -7
View File
@@ -6,13 +6,28 @@
$isArticle = ($WHERE_AM_I === 'page' && isset($page) && !$page->isStatic() && !$url->notFound());
?>
<?php if ($isArticle) : ?>
<div class="sidebar-profile text-center">
<a href="<?php echo Theme::siteUrl() ?>">
<img class="sidebar-profile-avatar" src="<?php echo DOMAIN_THEME . 'img/spleenftw.jpeg' ?>" alt="<?php echo htmlspecialchars($site->title(), ENT_QUOTES, 'UTF-8') ?>" />
</a>
<div class="sidebar-profile-name"><?php echo htmlspecialchars($site->title(), ENT_QUOTES, 'UTF-8') ?></div>
<?php if ($site->slogan()) : ?>
<p class="sidebar-profile-bio"><?php echo htmlspecialchars($site->slogan(), ENT_QUOTES, 'UTF-8') ?></p>
<div class="sidebar-author">
<span class="sidebar-author-label">Author</span>
<div class="sidebar-author-identity">
<a href="<?php echo Theme::siteUrl() ?>">
<img class="sidebar-author-avatar" src="<?php echo DOMAIN_THEME . 'img/spleenftw.jpeg' ?>" alt="<?php echo htmlspecialchars($page->username(), ENT_QUOTES, 'UTF-8') ?>" />
</a>
<div>
<div class="sidebar-author-name"><?php echo htmlspecialchars($page->username(), ENT_QUOTES, 'UTF-8') ?></div>
<?php if ($site->slogan()) : ?>
<p class="sidebar-author-bio"><?php echo htmlspecialchars($site->slogan(), ENT_QUOTES, 'UTF-8') ?></p>
<?php endif ?>
</div>
</div>
<?php $networks = Theme::socialNetworks(); ?>
<?php if (!empty($networks)) : ?>
<div class="sidebar-author-social">
<?php foreach ($networks as $key => $label) : ?>
<a href="<?php echo $site->{$key}(); ?>" target="_blank" rel="noopener" title="<?php echo htmlspecialchars($label, ENT_QUOTES, 'UTF-8') ?>">
<img class="sidebar-social-icon" src="<?php echo DOMAIN_THEME . 'img/' . $key . '.svg' ?>" alt="<?php echo htmlspecialchars($label, ENT_QUOTES, 'UTF-8') ?>" />
</a>
<?php endforeach ?>
</div>
<?php endif ?>
</div>
<?php endif ?>