Compare commits
25 Commits
77aaa9989e
..
main
| Author | SHA1 | Date | |
|---|---|---|---|
| d4c8760007 | |||
| b8fc96ea0a | |||
| 966441e6aa | |||
| 43d66fd295 | |||
| 5afda4e953 | |||
| c6d3e2516e | |||
| 3ac4e9bb4a | |||
| eb2f6802fd | |||
| 8bb70a9af0 | |||
| 8755db3305 | |||
| 2fa1a5eb3a | |||
| 75fc2ccc3b | |||
| e44d99c7e7 | |||
| dedec93e23 | |||
| 9a120ab0d6 | |||
| 6079039f21 | |||
| 2cf4dcbdae | |||
| e9dc4a6a0d | |||
| f488a103c8 | |||
| df5eeeb00c | |||
| b581601064 | |||
| 77bc63de24 | |||
| a86684f6d1 | |||
| b82c04ce51 | |||
| df20b2fb51 |
+593
-11
@@ -89,6 +89,28 @@
|
|||||||
--white: #3e2723;
|
--white: #3e2723;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
article {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Move iframe to right side of first paragraphs */
|
||||||
|
article iframe.article {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 1120px;
|
||||||
|
height: 630px;
|
||||||
|
margin: 0;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Clear float after iframe */
|
||||||
|
article iframe + p {
|
||||||
|
position: relative;
|
||||||
|
z-index: 20;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background: var(--bg);
|
background: var(--bg);
|
||||||
color: var(--light);
|
color: var(--light);
|
||||||
@@ -1227,6 +1249,8 @@
|
|||||||
border-radius: 24px;
|
border-radius: 24px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: var(--card);
|
background: var(--card);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.news-card-image {
|
.news-card-image {
|
||||||
@@ -1238,8 +1262,7 @@
|
|||||||
.news-card-body {
|
.news-card-body {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: space-between;
|
flex: 1;
|
||||||
min-height: 210px;
|
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
background: var(--lift);
|
background: var(--lift);
|
||||||
}
|
}
|
||||||
@@ -2060,6 +2083,314 @@
|
|||||||
color: var(--gold);
|
color: var(--gold);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#article-copy-link {
|
||||||
|
position: absolute;
|
||||||
|
top: 14px;
|
||||||
|
right: 58px;
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: none;
|
||||||
|
background: rgba(93, 64, 55, 0.08);
|
||||||
|
color: #8d6e63;
|
||||||
|
font-size: 1rem;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
transition: background 0.2s, color 0.2s;
|
||||||
|
z-index: 2;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#article-copy-link:hover {
|
||||||
|
background: rgba(230, 81, 0, 0.12);
|
||||||
|
color: var(--gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
#article-copy-link.copied {
|
||||||
|
color: var(--gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Article actions row (schedule + trial) ──────────────────── */
|
||||||
|
#article-actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: stretch;
|
||||||
|
gap: 12px;
|
||||||
|
margin: 2.5rem 0 0 auto;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-schedule-btn {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 6px;
|
||||||
|
width: 150px;
|
||||||
|
background: #fdf6ee;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
border-top: 3px solid #8d6e63;
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow:
|
||||||
|
0 8px 32px rgba(62, 39, 35, 0.18),
|
||||||
|
0 2px 8px rgba(0, 0, 0, 0.08);
|
||||||
|
padding: 18px 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: border-top-color 0.2s, box-shadow 0.2s;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-schedule-btn:hover {
|
||||||
|
border-top-color: var(--gold);
|
||||||
|
box-shadow:
|
||||||
|
0 12px 40px rgba(62, 39, 35, 0.22),
|
||||||
|
0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-schedule-icon {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-schedule-label {
|
||||||
|
font-family: Georgia, "Times New Roman", serif;
|
||||||
|
font-size: 0.83rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #3e2723;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-schedule-sub {
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.68rem;
|
||||||
|
color: #8d6e63;
|
||||||
|
font-style: italic;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Calendar modal ──────────────────────────────────────────────── */
|
||||||
|
#cal-overlay {
|
||||||
|
position: fixed;
|
||||||
|
inset: 0;
|
||||||
|
z-index: 9600;
|
||||||
|
display: none;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 20px;
|
||||||
|
background: rgba(62, 39, 35, 0.88);
|
||||||
|
backdrop-filter: blur(18px);
|
||||||
|
-webkit-backdrop-filter: blur(18px);
|
||||||
|
}
|
||||||
|
|
||||||
|
#cal-overlay.is-open {
|
||||||
|
display: flex;
|
||||||
|
animation: articleOverlayIn 0.3s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cal-box {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 820px;
|
||||||
|
height: 80vh;
|
||||||
|
background: #fdf6ee;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
box-shadow:
|
||||||
|
0 40px 100px rgba(0, 0, 0, 0.35),
|
||||||
|
0 0 0 1px rgba(255, 243, 224, 0.15);
|
||||||
|
overflow: hidden;
|
||||||
|
animation: articleFlyIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cal-box iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cal-close {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: none;
|
||||||
|
background: rgba(93, 64, 55, 0.12);
|
||||||
|
color: #8d6e63;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
transition: background 0.2s, color 0.2s;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cal-close:hover {
|
||||||
|
background: rgba(230, 81, 0, 0.12);
|
||||||
|
color: var(--gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Article CTA panel ─────────────────────────────────────────── */
|
||||||
|
#article-cta-panel {
|
||||||
|
width: 260px;
|
||||||
|
background: #fdf6ee;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
border-top: 3px solid var(--gold);
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow:
|
||||||
|
0 8px 32px rgba(62, 39, 35, 0.18),
|
||||||
|
0 2px 8px rgba(0, 0, 0, 0.08);
|
||||||
|
padding: 18px 16px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-heading {
|
||||||
|
font-family: Georgia, "Times New Roman", serif;
|
||||||
|
font-size: 0.83rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #3e2723;
|
||||||
|
margin: 0 0 3px;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-sub {
|
||||||
|
font-size: 0.71rem;
|
||||||
|
color: #8d6e63;
|
||||||
|
font-style: italic;
|
||||||
|
margin: 0 0 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-field {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #fff8f0;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 8px 10px;
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #3e2723;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
outline: none;
|
||||||
|
transition: border-color 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-field::placeholder { color: #a1887f; }
|
||||||
|
.article-cta-field:focus { border-color: var(--gold); }
|
||||||
|
|
||||||
|
.article-cta-loc-wrap {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-loc-btn {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #fff8f0;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 8px 28px 8px 10px;
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #a1887f;
|
||||||
|
text-align: left;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
transition: border-color 0.2s;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-loc-btn.has-value { color: #3e2723; }
|
||||||
|
.article-cta-loc-btn:focus { border-color: var(--gold); }
|
||||||
|
|
||||||
|
.article-cta-loc-btn::after {
|
||||||
|
content: "\25BE";
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
color: #8d6e63;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-loc-menu {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
top: calc(100% + 4px);
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background: #fdf6ee;
|
||||||
|
border: 1px solid rgba(93, 64, 55, 0.22);
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0 4px 16px rgba(62, 39, 35, 0.15);
|
||||||
|
z-index: 30;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-loc-wrap.open .article-cta-loc-menu { display: block; }
|
||||||
|
|
||||||
|
.article-cta-loc-opt {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
text-align: left;
|
||||||
|
padding: 8px 12px;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #4e342e;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.15s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-loc-opt:hover,
|
||||||
|
.article-cta-loc-opt.is-selected {
|
||||||
|
background: rgba(230, 81, 0, 0.08);
|
||||||
|
color: var(--gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-submit {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
padding: 9px 12px;
|
||||||
|
background: var(--gold);
|
||||||
|
color: #fff;
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 0.04em;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-submit:hover { background: var(--gold-hi); }
|
||||||
|
.article-cta-submit:disabled { opacity: 0.65; cursor: default; }
|
||||||
|
|
||||||
|
#article-cta-confirm { text-align: center; }
|
||||||
|
|
||||||
|
.article-cta-confirm-title {
|
||||||
|
font-family: Georgia, "Times New Roman", serif;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
color: #3e2723;
|
||||||
|
margin: 0 0 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-cta-confirm-sub {
|
||||||
|
font-family: "Segoe UI", system-ui, sans-serif;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
color: #8d6e63;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 860px) {
|
@media (max-width: 860px) {
|
||||||
#article-box {
|
#article-box {
|
||||||
height: 90vh;
|
height: 90vh;
|
||||||
@@ -2077,6 +2408,13 @@
|
|||||||
font-size: 0.95rem;
|
font-size: 0.95rem;
|
||||||
column-width: 280px;
|
column-width: 280px;
|
||||||
}
|
}
|
||||||
|
#article-actions {
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
#article-schedule-btn,
|
||||||
|
#article-cta-panel { width: 100%; }
|
||||||
}
|
}
|
||||||
|
|
||||||
#modal-confirm .confirm-title {
|
#modal-confirm .confirm-title {
|
||||||
@@ -2199,8 +2537,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="nav-right">
|
<div class="nav-right">
|
||||||
<a
|
<a
|
||||||
class="nav-cta-book plausible-event-name=Meeting"
|
class="nav-cta-book open-cal plausible-event-name=Meeting"
|
||||||
href="#story"
|
href="#"
|
||||||
>Book Meeting</a
|
>Book Meeting</a
|
||||||
>
|
>
|
||||||
<div class="nav-chat" id="nav-chat">
|
<div class="nav-chat" id="nav-chat">
|
||||||
@@ -2435,13 +2773,79 @@
|
|||||||
<div id="article-overlay">
|
<div id="article-overlay">
|
||||||
<div id="article-box">
|
<div id="article-box">
|
||||||
<button id="article-close" aria-label="Close article">×</button>
|
<button id="article-close" aria-label="Close article">×</button>
|
||||||
|
<button id="article-copy-link" aria-label="Copy link to article" title="Copy link to this article">🔗</button>
|
||||||
<div class="article-rule"></div>
|
<div class="article-rule"></div>
|
||||||
<div class="article-header">
|
<div class="article-header">
|
||||||
<div class="article-area" id="article-area"></div>
|
<div class="article-area" id="article-area"></div>
|
||||||
<h2 id="article-title"></h2>
|
<h2 id="article-title"></h2>
|
||||||
<div class="article-date" id="article-date"></div>
|
<div class="article-date" id="article-date"></div>
|
||||||
</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-actions">
|
||||||
|
<button id="article-schedule-btn" class="article-schedule-btn" type="button">
|
||||||
|
<span class="article-schedule-icon">📅</span>
|
||||||
|
<span class="article-schedule-label">Schedule a Meeting</span>
|
||||||
|
<span class="article-schedule-sub">Pick a time that works for you</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div id="article-cta-panel">
|
||||||
|
<div id="article-cta-form-wrap">
|
||||||
|
<p class="article-cta-heading">Try ODOO Free — 4 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">🇺🇸 Boston</button>
|
||||||
|
<button type="button" class="article-cta-loc-opt" data-value="Manchester, UK">🇬🇧 Manchester</button>
|
||||||
|
<button type="button" class="article-cta-loc-opt" data-value="Mumbai, IN">🇮🇳 Mumbai</button>
|
||||||
|
<button type="button" class="article-cta-loc-opt" data-value="Sao Paulo, BR">🇧🇷 São Paulo</button>
|
||||||
|
<button type="button" class="article-cta-loc-opt" data-value="Meppel, NL">🇳🇱 Meppel</button>
|
||||||
|
<button type="button" class="article-cta-loc-opt" data-value="Sydney, AU">🇦🇺 Sydney</button>
|
||||||
|
</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 →</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div id="article-cta-confirm" style="display:none">
|
||||||
|
<p class="article-cta-confirm-title">Thank you! 🎉</p>
|
||||||
|
<p class="article-cta-confirm-sub">We’ve received your request. A specialist will be in touch within one business day.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="cal-overlay">
|
||||||
|
<div id="cal-box">
|
||||||
|
<button id="cal-close" aria-label="Close calendar">×</button>
|
||||||
|
<iframe id="cal-iframe" src="" frameborder="0" allowfullscreen></iframe>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -2501,8 +2905,8 @@
|
|||||||
style="margin-top: auto; justify-content: flex-end"
|
style="margin-top: auto; justify-content: flex-end"
|
||||||
>
|
>
|
||||||
<a
|
<a
|
||||||
class="btn-secondary plausible-event-name=Meeting"
|
class="btn-secondary open-cal plausible-event-name=Meeting"
|
||||||
href="#pricing"
|
href="#"
|
||||||
>Book Meeting</a
|
>Book Meeting</a
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
@@ -2721,7 +3125,7 @@
|
|||||||
stack and can ship practical improvements without drama.
|
stack and can ship practical improvements without drama.
|
||||||
</p>
|
</p>
|
||||||
<a
|
<a
|
||||||
class="custom-link open-modal plausible-event-name=Trial"
|
class="custom-link open-cal plausible-event-name=Meeting"
|
||||||
href="#"
|
href="#"
|
||||||
>Request scoped help →</a
|
>Request scoped help →</a
|
||||||
>
|
>
|
||||||
@@ -3199,7 +3603,7 @@
|
|||||||
post.title.replace(/"/g, """) +
|
post.title.replace(/"/g, """) +
|
||||||
'">' : '',
|
'">' : '',
|
||||||
'<div class="news-card-body">',
|
'<div class="news-card-body">',
|
||||||
"<div>",
|
'<div style="flex: 1; display: flex; flex-direction: column;">',
|
||||||
'<div class="news-card-header">',
|
'<div class="news-card-header">',
|
||||||
'<div class="news-area">' + post.area + "</div>",
|
'<div class="news-area">' + post.area + "</div>",
|
||||||
'<span class="news-date">' + formatDate(post.date) + "</span>",
|
'<span class="news-date">' + formatDate(post.date) + "</span>",
|
||||||
@@ -3300,10 +3704,27 @@
|
|||||||
|
|
||||||
var articleOverlay = document.getElementById('article-overlay');
|
var articleOverlay = document.getElementById('article-overlay');
|
||||||
var articleClose = document.getElementById('article-close');
|
var articleClose = document.getElementById('article-close');
|
||||||
|
var articleCopyLink = document.getElementById('article-copy-link');
|
||||||
var articleTitle = document.getElementById('article-title');
|
var articleTitle = document.getElementById('article-title');
|
||||||
var articleArea = document.getElementById('article-area');
|
var articleArea = document.getElementById('article-area');
|
||||||
var articleDate = document.getElementById('article-date');
|
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 slugify(title) {
|
||||||
|
return (title || '').toLowerCase()
|
||||||
|
.replace(/[^a-z0-9\s-]/g, '')
|
||||||
|
.replace(/\s+/g, '-')
|
||||||
|
.replace(/-+/g, '-')
|
||||||
|
.replace(/^-|-$/g, '');
|
||||||
|
}
|
||||||
|
|
||||||
|
function findPostIndexBySlug(slug) {
|
||||||
|
for (var i = 0; i < allPosts.length; i++) {
|
||||||
|
if (slugify(allPosts[i].title) === slug) return i;
|
||||||
|
}
|
||||||
|
return -1;
|
||||||
|
}
|
||||||
|
|
||||||
function openArticle(index) {
|
function openArticle(index) {
|
||||||
var post = allPosts[index];
|
var post = allPosts[index];
|
||||||
@@ -3311,15 +3732,21 @@
|
|||||||
articleArea.textContent = post.area || '';
|
articleArea.textContent = post.area || '';
|
||||||
articleTitle.textContent = post.title || '';
|
articleTitle.textContent = post.title || '';
|
||||||
articleDate.textContent = formatDate(post.date);
|
articleDate.textContent = formatDate(post.date);
|
||||||
articleBody.innerHTML = post.content || '';
|
articleContent.innerHTML = post.content || '';
|
||||||
articleBody.scrollTop = 0;
|
articleBody.scrollTop = 0;
|
||||||
articleOverlay.classList.add('is-open');
|
articleOverlay.classList.add('is-open');
|
||||||
document.body.style.overflow = 'hidden';
|
document.body.style.overflow = 'hidden';
|
||||||
|
history.replaceState(null, '', '#post-' + slugify(post.title));
|
||||||
|
if (articleCopyLink) {
|
||||||
|
articleCopyLink.innerHTML = '🔗';
|
||||||
|
articleCopyLink.classList.remove('copied');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeArticle() {
|
function closeArticle() {
|
||||||
articleOverlay.classList.remove('is-open');
|
articleOverlay.classList.remove('is-open');
|
||||||
document.body.style.overflow = '';
|
document.body.style.overflow = '';
|
||||||
|
history.replaceState(null, '', window.location.pathname + window.location.search);
|
||||||
}
|
}
|
||||||
|
|
||||||
articleClose.addEventListener('click', closeArticle);
|
articleClose.addEventListener('click', closeArticle);
|
||||||
@@ -3330,6 +3757,32 @@
|
|||||||
if (e.key === 'Escape' && articleOverlay.classList.contains('is-open')) closeArticle();
|
if (e.key === 'Escape' && articleOverlay.classList.contains('is-open')) closeArticle();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (articleCopyLink) {
|
||||||
|
articleCopyLink.addEventListener('click', function() {
|
||||||
|
var url = window.location.href;
|
||||||
|
function showCopied() {
|
||||||
|
articleCopyLink.textContent = '\u2713';
|
||||||
|
articleCopyLink.classList.add('copied');
|
||||||
|
setTimeout(function() {
|
||||||
|
articleCopyLink.innerHTML = '🔗';
|
||||||
|
articleCopyLink.classList.remove('copied');
|
||||||
|
}, 2000);
|
||||||
|
}
|
||||||
|
if (navigator.clipboard && navigator.clipboard.writeText) {
|
||||||
|
navigator.clipboard.writeText(url).then(showCopied, showCopied);
|
||||||
|
} else {
|
||||||
|
var ta = document.createElement('textarea');
|
||||||
|
ta.value = url;
|
||||||
|
ta.style.cssText = 'position:fixed;opacity:0;pointer-events:none';
|
||||||
|
document.body.appendChild(ta);
|
||||||
|
ta.select();
|
||||||
|
try { document.execCommand('copy'); } catch(e) {}
|
||||||
|
document.body.removeChild(ta);
|
||||||
|
showCopied();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
grid.addEventListener('click', function(e) {
|
grid.addEventListener('click', function(e) {
|
||||||
var btn = e.target.closest('.news-read-btn');
|
var btn = e.target.closest('.news-read-btn');
|
||||||
if (!btn) return;
|
if (!btn) return;
|
||||||
@@ -3345,6 +3798,12 @@
|
|||||||
allPosts = Array.isArray(posts) ? posts : [];
|
allPosts = Array.isArray(posts) ? posts : [];
|
||||||
filteredPosts = allPosts.slice();
|
filteredPosts = allPosts.slice();
|
||||||
render();
|
render();
|
||||||
|
var hash = window.location.hash;
|
||||||
|
if (hash && hash.indexOf('#post-') === 0) {
|
||||||
|
var slug = hash.slice(6);
|
||||||
|
var idx = findPostIndexBySlug(slug);
|
||||||
|
if (idx !== -1) openArticle(idx);
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.catch(function () {
|
.catch(function () {
|
||||||
grid.innerHTML = emptyMarkup(
|
grid.innerHTML = emptyMarkup(
|
||||||
@@ -4015,6 +4474,129 @@
|
|||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
(function () {
|
||||||
|
var WEBHOOK = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c25169c6-4234-4b47-8e74-612b9539da0a";
|
||||||
|
var form = document.getElementById('article-cta-form');
|
||||||
|
var formWrap = document.getElementById('article-cta-form-wrap');
|
||||||
|
var confirmDiv = document.getElementById('article-cta-confirm');
|
||||||
|
var locWrap = document.getElementById('article-cta-loc-wrap');
|
||||||
|
var locBtn = document.getElementById('article-cta-loc-btn');
|
||||||
|
var locMenu = document.getElementById('article-cta-loc-menu');
|
||||||
|
var locField = document.getElementById('article-cta-location');
|
||||||
|
if (!form) return;
|
||||||
|
|
||||||
|
function closeLoc() {
|
||||||
|
locWrap.classList.remove('open');
|
||||||
|
locBtn.setAttribute('aria-expanded', 'false');
|
||||||
|
}
|
||||||
|
function openLoc() {
|
||||||
|
locWrap.classList.add('open');
|
||||||
|
locBtn.setAttribute('aria-expanded', 'true');
|
||||||
|
}
|
||||||
|
|
||||||
|
locBtn.addEventListener('click', function () {
|
||||||
|
locWrap.classList.contains('open') ? closeLoc() : openLoc();
|
||||||
|
});
|
||||||
|
|
||||||
|
locMenu.querySelectorAll('.article-cta-loc-opt').forEach(function (opt) {
|
||||||
|
opt.addEventListener('click', function () {
|
||||||
|
var val = opt.getAttribute('data-value') || '';
|
||||||
|
locField.value = val;
|
||||||
|
locMenu.querySelectorAll('.article-cta-loc-opt').forEach(function (o) {
|
||||||
|
o.classList.toggle('is-selected', o === opt);
|
||||||
|
});
|
||||||
|
locBtn.textContent = opt.textContent.trim();
|
||||||
|
locBtn.classList.add('has-value');
|
||||||
|
closeLoc();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
document.addEventListener('click', function (e) {
|
||||||
|
if (!locWrap.contains(e.target)) closeLoc();
|
||||||
|
});
|
||||||
|
|
||||||
|
form.addEventListener('submit', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var btn = form.querySelector('.article-cta-submit');
|
||||||
|
var fd = new FormData(form);
|
||||||
|
if (window._mbsTracking) fd = window._mbsTracking.appendToFormData(fd);
|
||||||
|
btn.textContent = 'Sending…';
|
||||||
|
btn.disabled = true;
|
||||||
|
fetch(WEBHOOK, { method: 'POST', body: fd })
|
||||||
|
.then(function () {
|
||||||
|
formWrap.style.display = 'none';
|
||||||
|
confirmDiv.style.display = 'block';
|
||||||
|
})
|
||||||
|
.catch(function () {
|
||||||
|
formWrap.style.display = 'none';
|
||||||
|
confirmDiv.style.display = 'block';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
var articleOverlay = document.getElementById('article-overlay');
|
||||||
|
if (articleOverlay) {
|
||||||
|
var observer = new MutationObserver(function () {
|
||||||
|
if (!articleOverlay.classList.contains('is-open')) {
|
||||||
|
setTimeout(function () {
|
||||||
|
formWrap.style.display = '';
|
||||||
|
confirmDiv.style.display = 'none';
|
||||||
|
form.reset();
|
||||||
|
locField.value = '';
|
||||||
|
locBtn.textContent = 'Select server location';
|
||||||
|
locBtn.classList.remove('has-value');
|
||||||
|
locMenu.querySelectorAll('.article-cta-loc-opt').forEach(function (o) {
|
||||||
|
o.classList.remove('is-selected');
|
||||||
|
});
|
||||||
|
var btn = form.querySelector('.article-cta-submit');
|
||||||
|
btn.textContent = 'Start Free Trial \u2192';
|
||||||
|
btn.disabled = false;
|
||||||
|
}, 300);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
observer.observe(articleOverlay, { attributes: true, attributeFilter: ['class'] });
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Calendar modal ───────────────────────────────────────── */
|
||||||
|
var CAL_URL = 'https://calendar.google.com/calendar/u/0/appointments/schedules/AcZssZ3DDbaiHFlhNhWySszAQoPXE_H73QLqYT3w7H9IYWC76RA_TgNIhLESjb4N7ep_D2D_OyW9q4-c';
|
||||||
|
var calOverlay = document.getElementById('cal-overlay');
|
||||||
|
var calIframe = document.getElementById('cal-iframe');
|
||||||
|
var calClose = document.getElementById('cal-close');
|
||||||
|
var schedBtn = document.getElementById('article-schedule-btn');
|
||||||
|
|
||||||
|
function openCal() {
|
||||||
|
calIframe.src = CAL_URL;
|
||||||
|
calOverlay.classList.add('is-open');
|
||||||
|
document.body.style.overflow = 'hidden';
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeCal() {
|
||||||
|
calOverlay.classList.remove('is-open');
|
||||||
|
document.body.style.overflow = '';
|
||||||
|
setTimeout(function () { calIframe.src = ''; }, 300);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelectorAll('.open-cal').forEach(function (el) {
|
||||||
|
el.addEventListener('click', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
openCal();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
if (calClose) calClose.addEventListener('click', closeCal);
|
||||||
|
if (calOverlay) {
|
||||||
|
calOverlay.addEventListener('click', function (e) {
|
||||||
|
if (e.target === calOverlay) closeCal();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('keydown', function (e) {
|
||||||
|
if (e.key === 'Escape' && calOverlay && calOverlay.classList.contains('is-open')) {
|
||||||
|
closeCal();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/@slicemypage/motionflow@latest/dist/motionflow.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/@slicemypage/motionflow@latest/dist/motionflow.min.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
+43
-17
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
|||||||
|
{"area": "CRM", "Vertical": "NGO", "date": "2026-05-04", "title": "Impact Reporting in Minutes", "teaser": "Small NGOs waste countless hours turning donor data into reports—instead of serving those they’re meant to help.", "content": "<article>\n<h2>Impact Reporting in Minutes</h2>\n<p style=\"margin: 0; color: #374151;\">— \"Maria stared at her screen at 11 p.m., three days before the grant deadline. Her donor database had 872 entries. Excel had 14 tabs. She hadnt slept in 36 hours. Every email from a donor—How was the clean water project?—demanded a new report. She couldnt tell them. Not without weeks of work. <strong>Spreadsheets</strong> were drowning her. <strong>Manual reporting</strong> was stealing her purpose. And worst of all—she knew donors were slipping away, not because her work wasn’t impactful, but because she couldn’t prove it.\" —</p>\n\n<p style=\"margin: 0; color: #374151;\">Modern digital tools can transform how NGOs capture and communicate impact. Automated systems can pull data from donations, program logs, and field reports into unified dashboards. Reports once built by hand can now be generated with a single click, reducing errors, saving weeks of labor, and preserving the emotional integrity of the stories behind the numbers.</p>\n\n<h3>Stop drowning in spreadsheets. Start telling stories.</h3>\n<p style=\"margin: 0; color: #374151;\">When your team spends 20 hours a week just compiling donor data, you’re not serving beneficiaries—you’re serving Excel. Automated reporting tools reset that balance. They sync with your existing donation platforms, track program outcomes across locations, and turn fragmented inputs into cohesive, real-time narratives that donors actually read.</p>\n\n<h3>Trust isn’t built with PDFs. It’s built with clarity.</h3>\n<p style=\"margin: 0; color: #374151;\">Donors don’t want line items. They want to know lives changed. A clean, automated dashboard shows a child’s progress in school, not just the $50 spent on textbooks. When you can show, not tell, donors see their values reflected in real results. That’s how <strong>retention grows</strong>—not through emails begging for more, but through transparency that feels genuine.</p>\n\n<h3>Proof that matters. Without the panic.</h3>\n<p style=\"margin: 0; color: #374151;\">Grant applications and board reviews require compliance—not creativity. When audit season rolls around, having pre-built, audit-ready templates means your finance lead isn’t working through the night. No more frantic last-minute data fixes. Just a few clicks, and your compliance is done. That peace of mind? It’s priceless.</p>\n\n<div class=\"video-container\" style=\"display: flex; margin: 2rem 0; gap: 2rem;\">\n <div class=\"video-text\" style=\"flex: 1;\">\n <p style=\"margin: 0; color: #374151;\">This is how you generate an impact report for your donors—no more spreadsheets, no more stress. Just one click, and your story goes live.</p>\n </div>\n <div class=\"video-player\" style=\"flex: 1; min-width: 300px; height: 300px;\">\n <iframe width=\"100%\" height=\"100%\"\n src=\"https://www.youtube.com/embed/huVrXvkCAqg\"\n title=\"YouTube video player\"\n frameborder=\"0\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n allowfullscreen\n style=\"width: 100%; height: 100%; border-radius: 8px;\">\n </iframe>\n </div>\n</div>\n\n<p style=\"margin: 0; color: #374151;\"><em>Remember: Every hour you spend wrestling with data is an hour taken from the field, the classroom, the clinic.</em></p>\n\n<a class=\"cta\" href=\"https://calendar.google.com/calendar/u/0/appointments/schedules/AcZssZ3DDbaiHFlhNhWySszAQoPXE_H73QLqYT3w7H9IYWC76RA_TgNIhLESjb4N7ep_D2D_OyW9q4-c\">When you want to explore how this could work for your organization, you can book a meeting here:</a>\n</article>", "image": "ngo_office3"}
|
||||||
Reference in New Issue
Block a user