Oliver/NGO
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: article CTA panel scrolls with content, appears below last paragraph

Browse Source
This commit is contained in:
oliver
2026-05-05 15:00:18 -03:00
parent c6d3e2516e
commit 5afda4e953
1 changed files with 52 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+52 -52
View File
@@ -2085,10 +2085,8 @@
/* ── Article CTA panel ─────────────────────────────────────────── */
#article-cta-panel {
position: absolute;
bottom: 28px;
right: 28px;
width: 234px;
width: 260px;
margin: 2.5rem 0 0 auto;
background: #fdf6ee;
border: 1px solid rgba(93, 64, 55, 0.22);
border-top: 3px solid var(--gold);
@@ -2097,7 +2095,6 @@
0 8px 32px rgba(62, 39, 35, 0.18),
0 2px 8px rgba(0, 0, 0, 0.08);
padding: 18px 16px 16px;
z-index: 10;
}
.article-cta-heading {
@@ -2175,7 +2172,7 @@
.article-cta-loc-menu {
display: none;
position: absolute;
bottom: calc(100% + 4px);
top: calc(100% + 4px);
left: 0;
right: 0;
background: #fdf6ee;
@@ -2261,7 +2258,7 @@
font-size: 0.95rem;
column-width: 280px;
}
#article-cta-panel { display: none; }
#article-cta-panel { width: 100%; margin-top: 2rem; }
}
#modal-confirm .confirm-title {
@@ -2626,51 +2623,53 @@
<h2 id="article-title"></h2>
<div class="article-date" id="article-date"></div>
</div>
<div class="article-body" id="article-body"></div>
<div class="article-body" id="article-body">
<div id="article-content"></div>
<div id="article-cta-panel">
<div id="article-cta-form-wrap">
<p class="article-cta-heading">Try ODOO Free &mdash; 4&nbsp;Weeks</p>
<p class="article-cta-sub">No credit card required</p>
<form id="article-cta-form" novalidate>
<input
type="email"
id="article-cta-email"
name="email"
class="article-cta-field"
placeholder="your@email.com"
required
/>
<div class="article-cta-loc-wrap" id="article-cta-loc-wrap">
<button
type="button"
class="article-cta-loc-btn"
id="article-cta-loc-btn"
aria-haspopup="listbox"
aria-expanded="false"
>Select server location</button>
<div
class="article-cta-loc-menu"
id="article-cta-loc-menu"
role="listbox"
>
<button type="button" class="article-cta-loc-opt" data-value="Boston, US">&#127482;&#127480; Boston</button>
<button type="button" class="article-cta-loc-opt" data-value="Manchester, UK">&#127468;&#127463; Manchester</button>
<button type="button" class="article-cta-loc-opt" data-value="Mumbai, IN">&#127470;&#127475; Mumbai</button>
<button type="button" class="article-cta-loc-opt" data-value="Sao Paulo, BR">&#127463;&#127479; S&atilde;o Paulo</button>
<button type="button" class="article-cta-loc-opt" data-value="Meppel, NL">&#127475;&#127473; Meppel</button>
<button type="button" class="article-cta-loc-opt" data-value="Sydney, AU">&#127462;&#127482; Sydney</button>
<div id="article-cta-panel">
<div id="article-cta-form-wrap">
<p class="article-cta-heading">Try ODOO Free &mdash; 4&nbsp;Weeks</p>
<p class="article-cta-sub">No credit card required</p>
<form id="article-cta-form" novalidate>
<input
type="email"
id="article-cta-email"
name="email"
class="article-cta-field"
placeholder="your@email.com"
required
/>
<div class="article-cta-loc-wrap" id="article-cta-loc-wrap">
<button
type="button"
class="article-cta-loc-btn"
id="article-cta-loc-btn"
aria-haspopup="listbox"
aria-expanded="false"
>Select server location</button>
<div
class="article-cta-loc-menu"
id="article-cta-loc-menu"
role="listbox"
>
<button type="button" class="article-cta-loc-opt" data-value="Boston, US">&#127482;&#127480; Boston</button>
<button type="button" class="article-cta-loc-opt" data-value="Manchester, UK">&#127468;&#127463; Manchester</button>
<button type="button" class="article-cta-loc-opt" data-value="Mumbai, IN">&#127470;&#127475; Mumbai</button>
<button type="button" class="article-cta-loc-opt" data-value="Sao Paulo, BR">&#127463;&#127479; S&atilde;o Paulo</button>
<button type="button" class="article-cta-loc-opt" data-value="Meppel, NL">&#127475;&#127473; Meppel</button>
<button type="button" class="article-cta-loc-opt" data-value="Sydney, AU">&#127462;&#127482; Sydney</button>
</div>
<input type="hidden" id="article-cta-location" name="server_location" value="" />
</div>
<input type="hidden" id="article-cta-location" name="server_location" value="" />
</div>
<input type="hidden" name="product" value="odoo_19" />
<input type="hidden" name="plan" value="NGO Free Trial" />
<button type="submit" class="article-cta-submit">Start Free Trial &#8594;</button>
</form>
</div>
<div id="article-cta-confirm" style="display:none">
<p class="article-cta-confirm-title">Thank you! &#127881;</p>
<p class="article-cta-confirm-sub">We&rsquo;ve received your request. A specialist will be in touch within one business day.</p>
<input type="hidden" name="product" value="odoo_19" />
<input type="hidden" name="plan" value="NGO Free Trial" />
<button type="submit" class="article-cta-submit">Start Free Trial &#8594;</button>
</form>
</div>
<div id="article-cta-confirm" style="display:none">
<p class="article-cta-confirm-title">Thank you! &#127881;</p>
<p class="article-cta-confirm-sub">We&rsquo;ve received your request. A specialist will be in touch within one business day.</p>
</div>
</div>
</div>
@@ -3535,7 +3534,8 @@
var articleTitle = document.getElementById('article-title');
var articleArea = document.getElementById('article-area');
var articleDate = document.getElementById('article-date');
var articleBody = document.getElementById('article-body');
var articleBody = document.getElementById('article-body');
var articleContent = document.getElementById('article-content');
function openArticle(index) {
var post = allPosts[index];
@@ -3543,7 +3543,7 @@
articleArea.textContent = post.area || '';
articleTitle.textContent = post.title || '';
articleDate.textContent = formatDate(post.date);
articleBody.innerHTML = post.content || '';
articleContent.innerHTML = post.content || '';
articleBody.scrollTop = 0;
articleOverlay.classList.add('is-open');
document.body.style.overflow = 'hidden';