nice
This commit is contained in:
oliver
+462
-123
@@ -91,6 +91,7 @@
|
||||
h1 { font-size: clamp(2.8rem, 7vw, 5rem); max-width: 80%; margin-top: 18px; }
|
||||
.lead { max-width: 62ch; margin-top: 18px; color: var(--silver); font-size: 1rem; }
|
||||
.grid-2 { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 24px; }
|
||||
.grid-2-equal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
|
||||
.panel {
|
||||
background: rgba(255, 243, 224, 0.84);
|
||||
border: 1px solid rgba(93, 64, 55, 0.12);
|
||||
@@ -103,70 +104,210 @@
|
||||
.info-list { display: grid; gap: 16px; }
|
||||
.info-item { padding: 18px; border-radius: 22px; background: var(--lift); border: 1px solid rgba(93, 64, 55, 0.1); }
|
||||
.info-item h3 { font-size: 1.2rem; margin-bottom: 8px; }
|
||||
.faq-wrap { display: grid; gap: 14px; }
|
||||
.faq-item {
|
||||
border-radius: 24px;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(93, 64, 55, 0.12);
|
||||
.story-card {
|
||||
background: rgba(255, 243, 224, 0.88);
|
||||
border: 1px solid rgba(93, 64, 55, 0.12);
|
||||
border-radius: 28px;
|
||||
padding: 28px;
|
||||
box-shadow: 0 18px 44px rgba(62, 39, 35, 0.08);
|
||||
}
|
||||
.faq-button {
|
||||
.story-card h3 {
|
||||
font-size: clamp(1.5rem, 3vw, 2.2rem);
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
.story-card p { color: var(--silver); }
|
||||
.pairing-type {
|
||||
margin-top: 16px;
|
||||
color: var(--gold);
|
||||
font-weight: 700;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.pairing-type [data-mf-text-type="typing"] {
|
||||
display: inline-block;
|
||||
min-width: 14ch;
|
||||
}
|
||||
.career-form {
|
||||
margin-top: 24px;
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
}
|
||||
.career-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
}
|
||||
.career-field.full {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
.career-field label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: var(--gold);
|
||||
font-size: 0.68rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.14em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.career-input,
|
||||
.career-textarea {
|
||||
width: 100%;
|
||||
padding: 20px 22px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
padding: 14px 16px;
|
||||
border: 1px solid rgba(230, 81, 0, 0.18);
|
||||
border-radius: 16px;
|
||||
background: rgba(93, 64, 55, 0.05);
|
||||
color: var(--white);
|
||||
font: inherit;
|
||||
}
|
||||
.faq-button strong {
|
||||
font-family: Georgia, "Times New Roman", serif;
|
||||
font-size: 1.2rem;
|
||||
text-align: left;
|
||||
.career-input:focus,
|
||||
.career-textarea:focus {
|
||||
outline: none;
|
||||
border-color: var(--gold);
|
||||
box-shadow: 0 0 0 3px var(--gold-glow);
|
||||
}
|
||||
.faq-icon { color: var(--gold); font-size: 1rem; }
|
||||
.faq-panel {
|
||||
display: none;
|
||||
padding: 0 22px 22px;
|
||||
color: var(--silver);
|
||||
.career-textarea {
|
||||
min-height: 140px;
|
||||
resize: vertical;
|
||||
}
|
||||
.faq-panel.open { display: block; }
|
||||
.faq-panel ul { list-style: none; display: grid; gap: 10px; }
|
||||
.faq-panel li { padding-left: 18px; position: relative; }
|
||||
.faq-panel li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0.65em;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(135deg, var(--gold-lo), var(--gold), var(--gold-hi));
|
||||
.career-submit {
|
||||
border: none;
|
||||
border-radius: 999px;
|
||||
padding: 14px 18px;
|
||||
font: inherit;
|
||||
font-weight: 700;
|
||||
color: var(--card);
|
||||
cursor: pointer;
|
||||
background: linear-gradient(135deg, var(--gold-lo) 0%, var(--gold) 38%, var(--gold-hi) 55%, var(--gold) 75%, var(--gold-lo) 100%);
|
||||
transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
|
||||
}
|
||||
.career-submit:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 12px 24px var(--gold-glow);
|
||||
}
|
||||
.career-submit:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.career-status {
|
||||
color: var(--grey);
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
footer {
|
||||
background: var(--bg-deep);
|
||||
border-top: 3px solid var(--gold);
|
||||
padding: 72px 8vw 40px;
|
||||
}
|
||||
.footer-row {
|
||||
.footer-top {
|
||||
max-width: 1120px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 18px;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
display: grid;
|
||||
grid-template-columns: 1.4fr 1.1fr 0.8fr 0.8fr;
|
||||
gap: 28px;
|
||||
align-items: start;
|
||||
}
|
||||
.footer-brand p {
|
||||
color: var(--grey);
|
||||
max-width: 28ch;
|
||||
margin-top: 14px;
|
||||
font-size: 0.88rem;
|
||||
}
|
||||
.footer-logo img { height: 34px; width: auto; }
|
||||
.footer-links { display: flex; gap: 16px; flex-wrap: wrap; }
|
||||
.footer-links a, .footer-row span { color: var(--grey); font-size: 0.84rem; }
|
||||
.footer-contact-shell {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
.footer-contact-form {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
.footer-contact-form textarea,
|
||||
.footer-contact-form input {
|
||||
width: 100%;
|
||||
border: 1px solid rgba(161, 136, 127, 0.2);
|
||||
border-radius: 18px;
|
||||
background: rgba(255, 243, 224, 0.06);
|
||||
color: var(--card);
|
||||
font: inherit;
|
||||
padding: 14px 16px;
|
||||
}
|
||||
.footer-contact-form textarea {
|
||||
min-height: 110px;
|
||||
resize: vertical;
|
||||
padding-right: 60px;
|
||||
}
|
||||
.footer-contact-message-wrap {
|
||||
position: relative;
|
||||
}
|
||||
.footer-contact-message-wrap .footer-contact-send {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
min-height: 40px;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
padding: 0;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
background: rgba(255, 243, 224, 0.9);
|
||||
color: var(--gold);
|
||||
cursor: pointer;
|
||||
}
|
||||
.footer-contact-form input::placeholder,
|
||||
.footer-contact-form textarea::placeholder {
|
||||
color: var(--grey);
|
||||
}
|
||||
.footer-contact-form input:focus,
|
||||
.footer-contact-form textarea:focus {
|
||||
outline: none;
|
||||
border-color: var(--gold);
|
||||
box-shadow: 0 0 0 3px rgba(230, 81, 0, 0.12);
|
||||
}
|
||||
.footer-contact-status {
|
||||
color: var(--grey);
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.footer-col h4 {
|
||||
margin-bottom: 16px;
|
||||
color: var(--gold);
|
||||
font-size: 0.65rem;
|
||||
letter-spacing: 0.16em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.footer-col ul {
|
||||
list-style: none;
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
}
|
||||
.footer-col a,
|
||||
.footer-bottom span,
|
||||
.footer-legal a {
|
||||
color: var(--grey);
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
.footer-col a:hover,
|
||||
.footer-legal a:hover {
|
||||
color: var(--gold-hi);
|
||||
}
|
||||
.footer-bottom {
|
||||
max-width: 1120px;
|
||||
margin: 24px auto 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
flex-wrap: wrap;
|
||||
padding-top: 24px;
|
||||
border-top: 1px solid rgba(161, 136, 127, 0.18);
|
||||
}
|
||||
.footer-legal {
|
||||
display: flex;
|
||||
gap: 18px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@media (max-width: 900px) {
|
||||
.grid-2 { grid-template-columns: 1fr; }
|
||||
.grid-2, .grid-2-equal, .career-grid { grid-template-columns: 1fr; }
|
||||
nav, .hero, section, footer { padding-left: 5vw; padding-right: 5vw; }
|
||||
h1 { max-width: 100%; }
|
||||
.footer-top { grid-template-columns: 1fr; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
@@ -216,106 +357,304 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="faq">
|
||||
<div class="wrap panel">
|
||||
<span class="eyebrow">FAQ</span>
|
||||
<h2 style="margin-top: 16px;">Questions people ask before they commit.</h2>
|
||||
<div class="faq-wrap" style="margin-top: 24px;">
|
||||
<div class="faq-item">
|
||||
<button class="faq-button" type="button"><strong>Commercial and Planning</strong><span class="faq-icon">+</span></button>
|
||||
<div class="faq-panel">
|
||||
<ul>
|
||||
<li>How pricing works across different stages of growth.</li>
|
||||
<li>When to start with the base plan versus a broader rollout.</li>
|
||||
<li>How to think about long-term ownership and platform flexibility.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-button" type="button"><strong>Setup and First Steps</strong><span class="faq-icon">+</span></button>
|
||||
<div class="faq-panel">
|
||||
<ul>
|
||||
<li>What information is needed to get the first instance ready.</li>
|
||||
<li>How teams choose modules, server location, and initial workflows.</li>
|
||||
<li>What a sensible first phase looks like for a new client.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-button" type="button"><strong>Managing My Instance</strong><span class="faq-icon">+</span></button>
|
||||
<div class="faq-panel">
|
||||
<ul>
|
||||
<li>How to keep data clean and users aligned after launch.</li>
|
||||
<li>What ongoing maintenance and governance can look like.</li>
|
||||
<li>How permissions, updates, and operational routines are handled.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<button class="faq-button" type="button"><strong>Professional Growth and Advanced Use</strong><span class="faq-icon">+</span></button>
|
||||
<div class="faq-panel">
|
||||
<ul>
|
||||
<li>How custom modules and integrations fit into a mature setup.</li>
|
||||
<li>When to bring in specialist developers or internal teams.</li>
|
||||
<li>How the system supports more demanding operational use cases.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<section>
|
||||
<div class="wrap grid-2-equal">
|
||||
<div class="story-card">
|
||||
<span class="eyebrow">Coffee Theme</span>
|
||||
<h3 style="margin-top: 16px;">Why the coffee theme and the coffee bean in the logo?</h3>
|
||||
<p>
|
||||
Out of our own experience: business and coffee belong together. The work is rarely clean, linear, or glamorous. It is early starts, sharp conversations, second drafts, and getting one more useful thing done before the day closes.
|
||||
</p>
|
||||
<div class="pairing-type">
|
||||
Business and coffee go together like
|
||||
<span
|
||||
data-mf-text-type="typing"
|
||||
data-mf-text-typing-speed="55"
|
||||
data-mf-text-typing-delete-speed="28"
|
||||
data-mf-text-typing-interval="1600"
|
||||
data-mf-text-typing-cursor="true"
|
||||
data-mf-text-typing-cursor-char="|"
|
||||
><span>Menthos and Coca Cola.</span
|
||||
><span>Tom and Jerry.</span
|
||||
><span>peanut butter and jelly.</span
|
||||
><span>Batman and Robin.</span
|
||||
><span>thunder and lightning.</span
|
||||
><span>late nights and pitch decks.</span></span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="story-card">
|
||||
<span class="eyebrow">Guild Counsel</span>
|
||||
<h3 style="margin-top: 16px;">Why Guild Counsel?</h3>
|
||||
<p>
|
||||
Because we love startups, builders, and teams that are actually trying to make something work. We are fed up with business BS bingo, inflated consulting theater, and polished nonsense that sounds smart while saying nothing.
|
||||
</p>
|
||||
<p style="margin-top: 16px;">
|
||||
Guild stands for craft, shared standards, and people who know their trade. Counsel stands for practical guidance, not buzzwords. Put together, it means advice for operators who need useful decisions, cleaner systems, and less corporate performance art.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="careers">
|
||||
<div class="wrap panel">
|
||||
<span class="eyebrow">Careers</span>
|
||||
<h2 style="margin-top: 16px;">We work with people who care about useful systems.</h2>
|
||||
<h2 style="margin-top: 16px;">We permanently start new guilds and are looking for guild managers.</h2>
|
||||
<p style="margin-top: 16px; color: var(--silver);">
|
||||
This area is ready for your careers content. Use it to describe open roles, how you like to work, and what kind of people thrive in your environment.
|
||||
We expect profound expertise in the guild itself, not generic management language. If you want to lead a guild, tell us which guild you want to build, why you fit, and what practical depth you bring.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="partners">
|
||||
<div class="wrap panel">
|
||||
<span class="eyebrow">Partners</span>
|
||||
<h2 style="margin-top: 16px;">Built to collaborate with specialists and trusted operators.</h2>
|
||||
<p style="margin-top: 16px; color: var(--silver);">
|
||||
This area is ready for partner content. Use it to explain agency partnerships, implementation support, referrals, ecosystem relationships, or co-delivery models.
|
||||
An application with the guild, language, an explanation of why you fit, what you bring to the table, and your commercial expectations is expected.
|
||||
</p>
|
||||
<form class="career-form" id="career-form">
|
||||
<div class="career-grid">
|
||||
<div class="career-field">
|
||||
<label for="career-name">Name</label>
|
||||
<input class="career-input" id="career-name" name="name" type="text" placeholder="Your full name" required />
|
||||
</div>
|
||||
<div class="career-field">
|
||||
<label for="career-email">Email</label>
|
||||
<input class="career-input" id="career-email" name="email" type="email" placeholder="you@example.com" required />
|
||||
</div>
|
||||
<div class="career-field full">
|
||||
<label for="career-guild">Guild interested in</label>
|
||||
<input class="career-input" id="career-guild" name="guild" type="text" placeholder="Example: Manufacturing Systems Guild" required />
|
||||
</div>
|
||||
<div class="career-field full">
|
||||
<label for="career-explanation">Explanation: why you fit and what you bring to the table</label>
|
||||
<textarea class="career-textarea" id="career-explanation" name="explanation" placeholder="Describe your expertise, language skills, operator experience, and why you should lead this guild." required></textarea>
|
||||
</div>
|
||||
<div class="career-field full">
|
||||
<label for="career-commercial">Commercial expectations</label>
|
||||
<textarea class="career-textarea" id="career-commercial" name="commercial_expectations" placeholder="Share your preferred model, compensation expectations, and anything commercial we should know." required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<button class="career-submit" type="submit">Apply for Guild Leadership</button>
|
||||
<div class="career-status" id="career-status"></div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<div class="footer-row">
|
||||
<a class="footer-logo" href="index.html"><img src="img/logo.svg" alt="my-biz.app" /></a>
|
||||
<div class="footer-links">
|
||||
<a href="about.html#about-us">About Us</a>
|
||||
<a href="about.html#faq">FAQ</a>
|
||||
<a href="about.html#careers">Careers</a>
|
||||
<a href="about.html#partners">Partners</a>
|
||||
<div
|
||||
class="footer-top"
|
||||
data-mf-stagger-animation="fade-up"
|
||||
data-mf-stagger-gap="70"
|
||||
data-mf-stagger-duration="620"
|
||||
data-mf-stagger-distance="24"
|
||||
data-mf-stagger-once="true"
|
||||
>
|
||||
<div class="footer-brand">
|
||||
<a class="footer-logo" href="index.html"
|
||||
><img src="img/logo.svg" alt="my-biz.app"
|
||||
/></a>
|
||||
<p>
|
||||
A practical all-in-one back-office platform built to
|
||||
help businesses run with more clarity, less friction,
|
||||
and room to grow over time.
|
||||
</p>
|
||||
</div>
|
||||
<div class="footer-contact-shell">
|
||||
<form class="footer-contact-form" id="footer-contact-form">
|
||||
<input type="hidden" name="source" value="my-biz.app" />
|
||||
<div class="footer-contact-input-row">
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
placeholder="Email"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="footer-contact-message-wrap">
|
||||
<textarea
|
||||
name="message"
|
||||
placeholder="Your message"
|
||||
required
|
||||
></textarea>
|
||||
<button
|
||||
type="submit"
|
||||
class="footer-contact-send"
|
||||
aria-label="Send"
|
||||
>
|
||||
➤
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="footer-contact-status"
|
||||
id="footer-contact-status"
|
||||
></div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Product</h4>
|
||||
<ul>
|
||||
<li><a href="index.html#verticals">Solutions</a></li>
|
||||
<li><a href="index.html#story">How It Works</a></li>
|
||||
<li><a href="index.html#pricing">Pricing</a></li>
|
||||
<li><a href="index.html#customization">Customization</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>About</h4>
|
||||
<ul>
|
||||
<li><a href="about.html#about-us">About Us</a></li>
|
||||
<li><a href="index.html#faq-chat-link">FAQ</a></li>
|
||||
<li><a href="about.html#careers">Careers</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<span>
|
||||
© 2026 my-biz.app · All rights reserved. · This service is powered by
|
||||
<a href="https://ODOO4projects.com" target="_blank" rel="noopener"
|
||||
>ODOO4projects</a
|
||||
>
|
||||
</span>
|
||||
<div class="footer-legal">
|
||||
<a href="legal.html#privacy">Privacy</a>
|
||||
<a href="legal.html#terms">Terms</a>
|
||||
<a href="legal.html#imprint">Imprint</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
var buttons = document.querySelectorAll(".faq-button");
|
||||
buttons.forEach(function (button) {
|
||||
button.addEventListener("click", function () {
|
||||
var panel = button.nextElementSibling;
|
||||
var icon = button.querySelector(".faq-icon");
|
||||
var open = panel.classList.contains("open");
|
||||
document.querySelectorAll(".faq-panel").forEach(function (item) {
|
||||
item.classList.remove("open");
|
||||
});
|
||||
document.querySelectorAll(".faq-icon").forEach(function (item) {
|
||||
item.textContent = "+";
|
||||
});
|
||||
if (!open) {
|
||||
panel.classList.add("open");
|
||||
icon.textContent = "−";
|
||||
}
|
||||
var params = new URLSearchParams(window.location.search);
|
||||
var tracking = {
|
||||
utm_source: params.get("utm_source") || "homepage",
|
||||
utm_medium: params.get("utm_medium") || "direct",
|
||||
utm_campaign: params.get("utm_campaign") || "none",
|
||||
utm_term: params.get("utm_term") || "",
|
||||
utm_content: params.get("utm_content") || "",
|
||||
};
|
||||
|
||||
function isTrackableHref(href) {
|
||||
return (
|
||||
href &&
|
||||
href.charAt(0) !== "#" &&
|
||||
href.indexOf("mailto:") !== 0 &&
|
||||
href.indexOf("tel:") !== 0 &&
|
||||
href.indexOf("javascript:") !== 0
|
||||
);
|
||||
}
|
||||
|
||||
function applyToLink(link) {
|
||||
var href = link.getAttribute("href");
|
||||
var url;
|
||||
if (!isTrackableHref(href)) return;
|
||||
try {
|
||||
url = new URL(href, window.location.href);
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
Object.keys(tracking).forEach(function (key) {
|
||||
if (tracking[key]) url.searchParams.set(key, tracking[key]);
|
||||
});
|
||||
if (url.origin === window.location.origin) {
|
||||
link.setAttribute("href", url.pathname + url.search + url.hash);
|
||||
return;
|
||||
}
|
||||
link.setAttribute("href", url.toString());
|
||||
}
|
||||
|
||||
function applyToLinks(root) {
|
||||
var scope = root && root.querySelectorAll ? root : document;
|
||||
scope.querySelectorAll("a[href]").forEach(applyToLink);
|
||||
}
|
||||
|
||||
function applyToFields(root) {
|
||||
if (!root || !root.querySelectorAll) return;
|
||||
Object.keys(tracking).forEach(function (key) {
|
||||
root.querySelectorAll('input[name="' + key + '"]').forEach(function (input) {
|
||||
input.value = tracking[key];
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function appendToFormData(formData) {
|
||||
Object.keys(tracking).forEach(function (key) {
|
||||
formData.set(key, tracking[key]);
|
||||
});
|
||||
return formData;
|
||||
}
|
||||
|
||||
applyToFields(document);
|
||||
applyToLinks(document);
|
||||
|
||||
window._mbsTracking = {
|
||||
params: tracking,
|
||||
applyToLinks: applyToLinks,
|
||||
applyToFields: applyToFields,
|
||||
appendToFormData: appendToFormData,
|
||||
};
|
||||
})();
|
||||
</script>
|
||||
<script>
|
||||
(function () {
|
||||
var WEBHOOK =
|
||||
"https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/41f1356d-2b0b-443c-b381-37195f547198";
|
||||
var form = document.getElementById("footer-contact-form");
|
||||
var status = document.getElementById("footer-contact-status");
|
||||
if (!form) return;
|
||||
|
||||
form.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
var button = form.querySelector("button[type='submit']");
|
||||
var formData = new FormData(form);
|
||||
if (window._mbsTracking)
|
||||
formData = window._mbsTracking.appendToFormData(formData);
|
||||
status.textContent = "Sending...";
|
||||
button.disabled = true;
|
||||
fetch(WEBHOOK, {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
})
|
||||
.then(function () {
|
||||
status.textContent = "Message received. We will get back to you soon.";
|
||||
form.reset();
|
||||
})
|
||||
.catch(function () {
|
||||
status.textContent = "Message received. We will get back to you soon.";
|
||||
form.reset();
|
||||
})
|
||||
.finally(function () {
|
||||
button.disabled = false;
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
<script>
|
||||
(function () {
|
||||
var WEBHOOK =
|
||||
"https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/b901fc80-c7d0-4204-a6ee-b01fb6c9d3c9";
|
||||
var form = document.getElementById("career-form");
|
||||
var status = document.getElementById("career-status");
|
||||
if (!form) return;
|
||||
|
||||
form.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
var button = form.querySelector("button[type='submit']");
|
||||
var formData = new FormData(form);
|
||||
if (window._mbsTracking)
|
||||
formData = window._mbsTracking.appendToFormData(formData);
|
||||
status.textContent = "Sending application...";
|
||||
button.disabled = true;
|
||||
|
||||
fetch(WEBHOOK, {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
})
|
||||
.then(function () {
|
||||
status.textContent = "Application received. We will review it and come back to you.";
|
||||
form.reset();
|
||||
})
|
||||
.catch(function () {
|
||||
status.textContent = "Application received. We will review it and come back to you.";
|
||||
form.reset();
|
||||
})
|
||||
.finally(function () {
|
||||
button.disabled = false;
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user