Oliver
251bec598b
Replaces the navy/pink direction with the reference's own language: paper ground, black ink, hairline rules, Playfair Display for display, Inter tracked caps for labels, italic serif for dates, boxed modules, three-column card grid, black rectangular buttons. Sections in the required order: 1. Latest Tips and Tricks - three clickable cards, category band, serif headline, description, reading time, View all tips. 2. Featured Module - Inventory in a bordered plate: manifest facts, description, three benefits, Explore module CTA. 3. Latest News from the Community - three rows with date, headline, excerpt and source, pulled from the OCA repositories. Nav, welcome copy, mail form, contact address and picture credits preserved. 44px touch targets on phones, visible focus rings.
77 lines
2.7 KiB
JavaScript
77 lines
2.7 KiB
JavaScript
/* The OC Guy — page behaviour.
|
|
Everything degrades: without JS the page is a plain, readable
|
|
document with working links and a mail form. */
|
|
(function () {
|
|
'use strict';
|
|
|
|
var doc = document.documentElement;
|
|
doc.classList.add('js');
|
|
|
|
var reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
|
|
/* ---------- entrance for the blocks of each section ---------- */
|
|
var targets = document.querySelectorAll(
|
|
'.lead-caption, .box, .side-list, .section-head, .card, .feature, .news li, .ask-inner'
|
|
);
|
|
|
|
if (!reduce && 'IntersectionObserver' in window) {
|
|
var io = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (!entry.isIntersecting) return;
|
|
entry.target.classList.add('rv-in');
|
|
io.unobserve(entry.target);
|
|
});
|
|
}, { rootMargin: '0px 0px -8% 0px', threshold: 0.08 });
|
|
|
|
Array.prototype.forEach.call(targets, function (el) {
|
|
el.setAttribute('data-rv', '1');
|
|
io.observe(el);
|
|
});
|
|
} else {
|
|
Array.prototype.forEach.call(targets, function (el) { el.classList.add('rv-in'); });
|
|
}
|
|
|
|
/* ---------- the ask form: one question, by mail ---------- */
|
|
var form = document.querySelector('.ask-form');
|
|
var mail = document.getElementById('ask-mail');
|
|
|
|
if (form && mail) {
|
|
form.addEventListener('submit', function (event) {
|
|
event.preventDefault();
|
|
var addr = (mail.value || '').trim();
|
|
if (!addr || addr.indexOf('@') === -1) {
|
|
mail.setAttribute('aria-invalid', 'true');
|
|
mail.focus();
|
|
return;
|
|
}
|
|
mail.removeAttribute('aria-invalid');
|
|
var body = 'My question about Odoo Community:\n\n\n— reply to: ' + addr + '\n';
|
|
window.location.href = 'mailto:o.arnold@projektbox.de'
|
|
+ '?subject=' + encodeURIComponent('Odoo Community question')
|
|
+ '&body=' + encodeURIComponent(body);
|
|
});
|
|
}
|
|
|
|
/* ---------- which section the reader is in ---------- */
|
|
var links = Array.prototype.slice.call(document.querySelectorAll('.nav a[href^="#"]'));
|
|
var sections = links
|
|
.map(function (a) { return document.querySelector(a.getAttribute('href')); })
|
|
.filter(Boolean);
|
|
|
|
if (sections.length && 'IntersectionObserver' in window) {
|
|
var seen = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (!entry.isIntersecting) return;
|
|
links.forEach(function (a) {
|
|
if (a.getAttribute('href') === '#' + entry.target.id) {
|
|
a.setAttribute('aria-current', 'true');
|
|
} else {
|
|
a.removeAttribute('aria-current');
|
|
}
|
|
});
|
|
});
|
|
}, { rootMargin: '-45% 0px -50% 0px' });
|
|
sections.forEach(function (s) { seen.observe(s); });
|
|
}
|
|
})();
|