a.andreev/gallery-for-aav
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Public: simplify desktop header and photo detail flow

Browse Source 
Hide the redundant top heading on desktop while keeping the mobile context title visible. Reorder photo detail content to show images first, then metadata and description, so the page matches the expected viewing flow.
This commit is contained in:
Alexander Andreev 2026-02-21 13:29:20 +03:00
parent 783dd51e5a
commit 3d28238994
1 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
index.php
View File

@ -343,7 +343,7 @@ function outputWatermarked(string $path, string $mime): never
<link rel="stylesheet" href="<?= h(assetUrl('style.css')) ?>"> <link rel="stylesheet" href="<?= h(assetUrl('style.css')) ?>">
<style> <style>
.note{color:#6b7280;font-size:13px} .note{color:#6b7280;font-size:13px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px} .topbar{display:none;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.topbar h1{margin:0;font-size:24px;line-height:1.2} .topbar h1{margin:0;font-size:24px;line-height:1.2}
.page{display:grid;gap:16px;grid-template-columns:300px minmax(0,1fr)} .page{display:grid;gap:16px;grid-template-columns:300px minmax(0,1fr)}
.panel{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:14px} .panel{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:14px}
@ -393,6 +393,7 @@ function outputWatermarked(string $path, string $mime): never
.sidebar-backdrop{display:none} .sidebar-backdrop{display:none}
@media (max-width:900px){ @media (max-width:900px){
.topbar{display:flex}
.topbar h1{font-size:22px} .topbar h1{font-size:22px}
.page{grid-template-columns:1fr} .page{grid-template-columns:1fr}
.sidebar{position:static;max-height:none} .sidebar{position:static;max-height:none}
@ -472,18 +473,19 @@ function outputWatermarked(string $path, string $mime): never
<main> <main>
<?php if ($activePhotoId > 0 && $photo): ?> <?php if ($activePhotoId > 0 && $photo): ?>
<section class="panel detail"> <section class="panel detail">
<div class="stack">
<?php if (!empty($photo['before_file_id'])): ?><div><div class="muted">До обработки</div><div class="img-box"><img src="?action=image&file_id=<?= (int)$photo['before_file_id'] ?>" alt="" decoding="async" fetchpriority="high"></div></div><?php endif; ?>
<?php if (!empty($photo['after_file_id'])): ?><div><div class="muted">После обработки (watermark)</div><div class="img-box"><img src="?action=image&file_id=<?= (int)$photo['after_file_id'] ?>" alt="" decoding="async" fetchpriority="high"></div></div><?php endif; ?>
</div>
<h2><?= h((string)$photo['code_name']) ?></h2> <h2><?= h((string)$photo['code_name']) ?></h2>
<p class="muted"><?= h((string)($photo['description'] ?? '')) ?></p>
<div class="detail-meta"> <div class="detail-meta">
<a class="detail-meta-link" href="?section_id=<?= (int)$detailSectionId ?><?= $viewerToken!=='' ? '&viewer=' . urlencode($viewerToken) : '' ?>">Раздел: <?= h($sectionNames[$detailSectionId] ?? ('#' . (string)$detailSectionId)) ?></a> <a class="detail-meta-link" href="?section_id=<?= (int)$detailSectionId ?><?= $viewerToken!=='' ? '&viewer=' . urlencode($viewerToken) : '' ?>">Раздел: <?= h($sectionNames[$detailSectionId] ?? ('#' . (string)$detailSectionId)) ?></a>
<?php foreach($photoTopics as $topic): ?> <?php foreach($photoTopics as $topic): ?>
<a class="detail-meta-link" href="?topic_id=<?= (int)$topic['id'] ?><?= $viewerToken!=='' ? '&viewer=' . urlencode($viewerToken) : '' ?>">Тематика: <?= h((string)$topic['full_name']) ?></a> <a class="detail-meta-link" href="?topic_id=<?= (int)$topic['id'] ?><?= $viewerToken!=='' ? '&viewer=' . urlencode($viewerToken) : '' ?>">Тематика: <?= h((string)$topic['full_name']) ?></a>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
<div class="stack"> <p class="muted"><?= h((string)($photo['description'] ?? '')) ?></p>
<?php if (!empty($photo['before_file_id'])): ?><div><div class="muted">До обработки</div><div class="img-box"><img src="?action=image&file_id=<?= (int)$photo['before_file_id'] ?>" alt="" decoding="async" fetchpriority="high"></div></div><?php endif; ?>
<?php if (!empty($photo['after_file_id'])): ?><div><div class="muted">После обработки (watermark)</div><div class="img-box"><img src="?action=image&file_id=<?= (int)$photo['after_file_id'] ?>" alt="" decoding="async" fetchpriority="high"></div></div><?php endif; ?>
</div>
<h3 style="margin-top:16px">Комментарии</h3> <h3 style="margin-top:16px">Комментарии</h3>
<?php if ($viewer): ?> <?php if ($viewer): ?>