feat(site): centred home logo that docks on scroll, slashed nav underline, square defocused hero event
This commit is contained in:
1 parent
4f44bc1609
commit
bfbd04a2d3
4 files changed
+68
-22
No files matched your search
@@ -9,14 +9,17 @@ else
|
||||
}
|
||||
$logo = base_url($logo_rel);
|
||||
$logo_dims = svg_img_dims_attr(dirname(__DIR__, 2) . '/' . $logo_rel);
|
||||
// Home page: the logo starts big and centred over the hero (.is-top) and docks
|
||||
// back to the left of the bar once the page scrolls (script below).
|
||||
$center_logo = !empty($nav_center_logo);
|
||||
?>
|
||||
<header class="header-section lazy">
|
||||
<header class="header-section lazy<?= $center_logo ? ' has-center-logo is-top' : '' ?>">
|
||||
<nav class="navbar navbar-expand-lg navbar-light" style="padding-left:1rem; padding-top: 0; padding-bottom: 0;padding-right: 0; ">
|
||||
<a class="navbar-brand" href="<?= htmlspecialchars(gym_url(current_gym())) ?>">
|
||||
<?php if (img_fallback_rel($logo_rel) !== ''): ?>
|
||||
<?= img_tag($logo_rel, ['loading' => 'eager', 'decoding' => 'async', 'alt' => 'Logo ' . (current_gym()['name'] ?? 'FitMe 3070'), 'style' => 'width: 150px; height: auto;']) ?>
|
||||
<?= img_tag($logo_rel, ['loading' => 'eager', 'decoding' => 'async', 'alt' => 'Logo ' . (current_gym()['name'] ?? 'FitMe 3070')]) ?>
|
||||
<?php else: ?>
|
||||
<img loading="eager" decoding="async" alt="Logo <?= htmlspecialchars(current_gym()['name'] ?? 'FitMe 3070') ?>" src="<?= htmlspecialchars($logo) ?>" <?= $logo_dims ?> style="width: 150px; height: auto;">
|
||||
<img loading="eager" decoding="async" alt="Logo <?= htmlspecialchars(current_gym()['name'] ?? 'FitMe 3070') ?>" src="<?= htmlspecialchars($logo) ?>" <?= $logo_dims ?>>
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
|
||||
@@ -89,6 +92,14 @@ $logo_dims = svg_img_dims_attr(dirname(__DIR__, 2) . '/' . $logo_rel);
|
||||
// querySelector('#equipa') returns null, `sections` stays empty, and neither
|
||||
// the smooth-scroll nor the scroll-spy (active nav link) ever bind.
|
||||
function init() {
|
||||
/* ── Centred logo: docks into the bar once the page leaves the top ───── */
|
||||
var header = document.querySelector('.header-section.has-center-logo');
|
||||
if (header) {
|
||||
var dock = function() { header.classList.toggle('is-top', window.scrollY < 40); };
|
||||
window.addEventListener('scroll', dock, { passive: true });
|
||||
dock();
|
||||
}
|
||||
|
||||
/* ── Eased smooth-scroll helper ──────────────────────────────────────── */
|
||||
function smoothScrollTo(targetEl, duration) {
|
||||
var start = window.scrollY;
|
||||
|
||||
Reference in new issue
Block a user