add about us
This commit is contained in:
Admin
parent
34786fb633
commit
ea550061cb
|
|
@ -0,0 +1,837 @@
|
|||
<!doctype html>
|
||||
<html lang="en" class="no-snap">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>About Us | Prology — Enterprise Network Hardware Brokerage</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="Prology is a Sydney-based enterprise specialising in high-quality new and refurbished Cisco networking equipment, alongside legacy hard-to-find parts."
|
||||
/>
|
||||
<meta name="robots" content="index,follow" />
|
||||
<link rel="canonical" href="https://prology.net/about-us" />
|
||||
|
||||
<!-- Open Graph -->
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:site_name" content="Prology" />
|
||||
<meta property="og:url" content="https://prology.net/about-us" />
|
||||
<meta
|
||||
property="og:title"
|
||||
content="About Us | Prology — Enterprise Network Hardware Brokerage"
|
||||
/>
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Sydney-based brokerage of high-quality new and refurbished Cisco networking equipment and legacy hard-to-find parts."
|
||||
/>
|
||||
<meta
|
||||
property="og:image"
|
||||
content="https://prology.net/assets/Prology_logo.png"
|
||||
/>
|
||||
<meta property="og:locale" content="en_AU" />
|
||||
<meta property="og:locale:alternate" content="en_US" />
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta
|
||||
name="twitter:title"
|
||||
content="About Us | Prology — Enterprise Network Hardware Brokerage"
|
||||
/>
|
||||
<meta
|
||||
name="twitter:description"
|
||||
content="Sydney-based brokerage of high-quality new and refurbished Cisco networking equipment and legacy hard-to-find parts."
|
||||
/>
|
||||
<meta
|
||||
name="twitter:image"
|
||||
content="https://prology.net/assets/Prology_logo.png"
|
||||
/>
|
||||
|
||||
<link rel="stylesheet" href="assets/css/styles.css" />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- JSON-LD: AboutPage -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "AboutPage",
|
||||
"name": "About Prology",
|
||||
"url": "https://prology.net/about-us",
|
||||
"mainEntity": {
|
||||
"@type": "Organization",
|
||||
"name": "Prology",
|
||||
"legalName": "Prology Pty Ltd",
|
||||
"url": "https://prology.net/",
|
||||
"logo": "https://prology.net/assets/Prology_logo.png",
|
||||
"description": "Sydney-based enterprise specialising in high-quality new and refurbished Cisco networking equipment, alongside legacy hard-to-find parts."
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* ============ ABOUT US PAGE ============ */
|
||||
body {
|
||||
background: #f6f7f9 !important;
|
||||
}
|
||||
|
||||
.about-page {
|
||||
margin-top: 80px;
|
||||
padding: 32px 0 80px;
|
||||
}
|
||||
|
||||
/* ---------- Breadcrumb ---------- */
|
||||
.about-breadcrumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 0.95rem;
|
||||
margin-bottom: 24px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
.about-breadcrumb a {
|
||||
color: #6b7280;
|
||||
text-decoration: none;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.about-breadcrumb a:hover {
|
||||
color: #1a73e8;
|
||||
}
|
||||
.about-breadcrumb .sep {
|
||||
color: #cbd2da;
|
||||
}
|
||||
.about-breadcrumb .current {
|
||||
color: #1a1f2e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ---------- Hero (dark navy card) ---------- */
|
||||
.about-hero-card {
|
||||
background: #1a2240;
|
||||
border-radius: 20px;
|
||||
padding: 90px 60px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.about-hero-card .eyebrow {
|
||||
display: inline-block;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.18em;
|
||||
color: #cbd5e1;
|
||||
margin-bottom: 22px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.about-hero-card h1 {
|
||||
font-size: clamp(2.2rem, 4.5vw, 3.2rem);
|
||||
font-weight: 800;
|
||||
letter-spacing: -0.02em;
|
||||
line-height: 1.15;
|
||||
margin: 0 0 22px 0;
|
||||
color: #ffffff;
|
||||
}
|
||||
.about-hero-card p {
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.7;
|
||||
color: #cbd5e1;
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* ---------- Mission Callout ---------- */
|
||||
.mission-callout {
|
||||
background: #eef0f4;
|
||||
border-left: 4px solid #2563eb;
|
||||
border-radius: 14px;
|
||||
padding: 32px 36px;
|
||||
margin-bottom: 56px;
|
||||
}
|
||||
.mission-callout .callout-label {
|
||||
display: block;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.18em;
|
||||
color: #1a1f2e;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.mission-callout p {
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.7;
|
||||
color: #1f2937;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ---------- Who We Are ---------- */
|
||||
.who-block {
|
||||
padding: 0 4px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.who-block h2 {
|
||||
font-size: 1.65rem;
|
||||
font-weight: 800;
|
||||
color: #0f172a;
|
||||
margin: 0 0 22px 0;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.who-block p {
|
||||
font-size: 1rem;
|
||||
line-height: 1.75;
|
||||
color: #374151;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
|
||||
/* ---------- 3 Value Cards ---------- */
|
||||
.value-cards {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 24px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.value-card {
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 16px;
|
||||
padding: 32px 28px;
|
||||
transition: transform 0.25s ease, box-shadow 0.25s ease;
|
||||
}
|
||||
.value-card:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
|
||||
}
|
||||
.value-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
background: #e8f0fe;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 24px;
|
||||
color: #2563eb;
|
||||
}
|
||||
.value-card h3 {
|
||||
font-size: 1.15rem;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
margin: 0 0 14px 0;
|
||||
}
|
||||
.value-card p {
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.65;
|
||||
color: #4b5563;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ---------- Why Choose ---------- */
|
||||
.why-block {
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 16px;
|
||||
padding: 40px 44px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.why-block h2 {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
color: #0f172a;
|
||||
margin: 0 0 32px 0;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.why-bullets {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 24px 56px;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.why-bullets li {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 14px;
|
||||
font-size: 1rem;
|
||||
color: #1f2937;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.why-bullets .check {
|
||||
flex-shrink: 0;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-top: 2px;
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
/* ---------- Ready CTA (blue) ---------- */
|
||||
.ready-cta {
|
||||
background: #2563eb;
|
||||
border-radius: 18px;
|
||||
padding: 56px 40px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
}
|
||||
.ready-cta h2 {
|
||||
font-size: clamp(1.6rem, 3vw, 2rem);
|
||||
font-weight: 800;
|
||||
color: #ffffff;
|
||||
margin: 0 0 16px 0;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.ready-cta p {
|
||||
font-size: 1rem;
|
||||
line-height: 1.6;
|
||||
color: rgba(255, 255, 255, 0.92);
|
||||
max-width: 640px;
|
||||
margin: 0 auto 32px auto;
|
||||
}
|
||||
.ready-cta-actions {
|
||||
display: flex;
|
||||
gap: 14px;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.ready-cta-actions .btn-solid,
|
||||
.ready-cta-actions .btn-ghost {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 12px 28px;
|
||||
border-radius: 8px;
|
||||
font-size: 0.98rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s ease, background 0.2s ease;
|
||||
border: 1px solid transparent;
|
||||
font-family: inherit;
|
||||
}
|
||||
.ready-cta-actions .btn-solid {
|
||||
background: #ffffff;
|
||||
color: #2563eb;
|
||||
}
|
||||
.ready-cta-actions .btn-solid:hover {
|
||||
background: #f1f5ff;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
.ready-cta-actions .btn-ghost {
|
||||
background: transparent;
|
||||
color: #ffffff;
|
||||
border-color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
.ready-cta-actions .btn-ghost:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* ---------- Responsive ---------- */
|
||||
@media (max-width: 1024px) {
|
||||
.value-cards {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
.why-bullets {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.about-hero-card {
|
||||
padding: 60px 28px;
|
||||
}
|
||||
.mission-callout,
|
||||
.why-block {
|
||||
padding: 28px 24px;
|
||||
}
|
||||
.ready-cta {
|
||||
padding: 44px 24px;
|
||||
}
|
||||
.ready-cta-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
.ready-cta-actions .btn-solid,
|
||||
.ready-cta-actions .btn-ghost {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- ============ NAVIGATION ============ -->
|
||||
<nav class="navbar">
|
||||
<div class="nav-content">
|
||||
<a href="index.html" class="nav-brand">
|
||||
<img src="assets/Prology_logo.png" alt="Prology.net" />
|
||||
</a>
|
||||
<ul class="nav-links">
|
||||
<li><a href="index.html#home">Home</a></li>
|
||||
<li><a href="index.html#services">Categories</a></li>
|
||||
<li><a href="index.html#quality">Why Choose Us</a></li>
|
||||
<li><a href="index.html#institutional">Gov & Corp</a></li>
|
||||
<li><a href="index.html#contact">Contact</a></li>
|
||||
<li><a href="about-us.html" class="active">About Us</a></li>
|
||||
</ul>
|
||||
<div class="nav-cta">
|
||||
<button class="btn-view-products" onclick="openStoreModal()">
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path d="M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z" />
|
||||
<line x1="3" y1="6" x2="21" y2="6" />
|
||||
<path d="M16 10a4 4 0 0 1-8 0" />
|
||||
</svg>
|
||||
View Products
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
class="hamburger-btn"
|
||||
aria-label="Toggle navigation menu"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="nav-backdrop" id="nav-backdrop"></div>
|
||||
|
||||
<!-- ============ MAIN CONTENT ============ -->
|
||||
<div class="about-page">
|
||||
<div class="container">
|
||||
<!-- Breadcrumb -->
|
||||
<nav class="about-breadcrumb" aria-label="Breadcrumb">
|
||||
<a href="index.html">Home</a>
|
||||
<span class="sep">/</span>
|
||||
<span class="current">About Us</span>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Card -->
|
||||
<section class="about-hero-card">
|
||||
<span class="eyebrow">Sydney, Australia</span>
|
||||
<h1>Welcome to Prology</h1>
|
||||
<p>
|
||||
A Sydney-based company specialising in high-quality new and
|
||||
refurbished Cisco networking equipment, as well as legacy
|
||||
hard-to-find parts.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!-- Mission Callout -->
|
||||
<section class="mission-callout">
|
||||
<span class="callout-label">Our Mission</span>
|
||||
<p>
|
||||
To reduce the involvement of middlemen in the supply chain —
|
||||
cutting costs for end-users while ensuring they receive top-notch
|
||||
products.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!-- Who We Are -->
|
||||
<section class="who-block">
|
||||
<h2>Who We Are</h2>
|
||||
<p>
|
||||
At Prology, we understand that businesses of all sizes require
|
||||
reliable and efficient networking equipment to operate smoothly.
|
||||
That's why we offer a wide range of products catering to the needs
|
||||
of various industries — from small businesses to large enterprises.
|
||||
</p>
|
||||
<p>
|
||||
Our inventory includes routers, switches, firewalls, and other
|
||||
networking equipment from leading brands like Cisco. All refurbished
|
||||
equipment goes through a meticulous refurbishment and certification
|
||||
process, meeting the same standards as new equipment at a fraction
|
||||
of the cost.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!-- Value Cards -->
|
||||
<section class="value-cards">
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<svg
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polygon
|
||||
points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Quality Assured</h3>
|
||||
<p>
|
||||
Meticulous refurbishment and certification — every item meets the
|
||||
same standards as new equipment.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<svg
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
|
||||
<circle cx="9" cy="7" r="4" />
|
||||
<path d="M23 21v-2a4 4 0 0 0-3-3.87" />
|
||||
<path d="M16 3.13a4 4 0 0 1 0 7.75" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Expert Support</h3>
|
||||
<p>
|
||||
Personalised advice from our team of networking specialists —
|
||||
ready to help you choose the right equipment.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="value-card">
|
||||
<div class="value-icon">
|
||||
<svg
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<rect x="1" y="3" width="15" height="13" />
|
||||
<polygon points="16 8 20 8 23 11 23 16 16 16 16 8" />
|
||||
<circle cx="5.5" cy="18.5" r="2.5" />
|
||||
<circle cx="18.5" cy="18.5" r="2.5" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Worldwide Shipping</h3>
|
||||
<p>
|
||||
Fast delivery via UPS, DHL, FedEx and other trusted couriers —
|
||||
wherever you are located.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Why Choose -->
|
||||
<section class="why-block">
|
||||
<h2>Why Choose Prology?</h2>
|
||||
<ul class="why-bullets">
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>High-quality new & refurbished Cisco equipment</span>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>Legacy & hard-to-find parts specialist</span>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>Fraction of the cost — without sacrificing performance</span>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>Rigorous testing & certification on all stock</span>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>No middlemen — direct savings passed to customers</span>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
class="check"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
<span>Serving small businesses to large enterprises</span>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<!-- Ready CTA -->
|
||||
<section class="ready-cta">
|
||||
<h2>Ready to upgrade your network?</h2>
|
||||
<p>
|
||||
Browse our full range of Cisco networking equipment or get in touch
|
||||
with our team.
|
||||
</p>
|
||||
<div class="ready-cta-actions">
|
||||
<button
|
||||
type="button"
|
||||
class="btn-solid"
|
||||
onclick="openStoreModal()"
|
||||
>
|
||||
Shop Now
|
||||
</button>
|
||||
<a class="btn-ghost" href="index.html#contact">Contact Us</a>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="assets/js/config.js" defer></script>
|
||||
<script src="assets/js/modals.js" defer></script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const hamburgerBtn = document.querySelector(".hamburger-btn");
|
||||
const navMenu = document.querySelector(".nav-links");
|
||||
const navBackdrop = document.getElementById("nav-backdrop");
|
||||
if (!hamburgerBtn || !navMenu) return;
|
||||
|
||||
function closeNavMenu() {
|
||||
navMenu.classList.remove("open");
|
||||
hamburgerBtn.classList.remove("open");
|
||||
hamburgerBtn.setAttribute("aria-expanded", "false");
|
||||
if (navBackdrop) navBackdrop.classList.remove("open");
|
||||
}
|
||||
|
||||
hamburgerBtn.addEventListener("click", () => {
|
||||
const isOpen = navMenu.classList.toggle("open");
|
||||
hamburgerBtn.classList.toggle("open", isOpen);
|
||||
hamburgerBtn.setAttribute("aria-expanded", String(isOpen));
|
||||
if (navBackdrop) navBackdrop.classList.toggle("open", isOpen);
|
||||
});
|
||||
navMenu.querySelectorAll("a").forEach((a) => {
|
||||
a.addEventListener("click", closeNavMenu);
|
||||
});
|
||||
if (navBackdrop) navBackdrop.addEventListener("click", closeNavMenu);
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- ============ PROLOGY MODAL WEB COMPONENTS ============ -->
|
||||
<prology-sell-modal id="wc-sell-modal"></prology-sell-modal>
|
||||
<prology-source-modal id="wc-source-modal"></prology-source-modal>
|
||||
<prology-quote-modal id="wc-quote-modal"></prology-quote-modal>
|
||||
<prology-enquire-modal id="wc-enquire-modal"></prology-enquire-modal>
|
||||
|
||||
<!-- ============ STORE PICKER MODAL ============ -->
|
||||
<div
|
||||
class="store-modal-overlay"
|
||||
id="store-modal-overlay"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="store-modal-title"
|
||||
>
|
||||
<div class="store-modal-box">
|
||||
<button
|
||||
class="store-modal-close"
|
||||
onclick="closeStoreModal()"
|
||||
aria-label="Close"
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
<p class="store-modal-title" id="store-modal-title">
|
||||
Choose Your Store
|
||||
</p>
|
||||
<p class="store-modal-subtitle">
|
||||
Select a region to browse our products
|
||||
</p>
|
||||
<div class="store-options">
|
||||
<a data-store="au" class="store-option store-option--active">
|
||||
<span class="store-flag">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 60 30"
|
||||
width="52"
|
||||
height="28"
|
||||
>
|
||||
<rect width="60" height="30" fill="#00205B" />
|
||||
<line x1="0" y1="0" x2="30" y2="15" stroke="#fff" stroke-width="5" />
|
||||
<line x1="30" y1="0" x2="0" y2="15" stroke="#fff" stroke-width="5" />
|
||||
<line x1="0" y1="0" x2="30" y2="15" stroke="#CC2529" stroke-width="3" />
|
||||
<line x1="30" y1="0" x2="0" y2="15" stroke="#CC2529" stroke-width="3" />
|
||||
<rect x="12" y="0" width="6" height="15" fill="#fff" />
|
||||
<rect x="0" y="6" width="30" height="6" fill="#fff" />
|
||||
<rect x="13.5" y="0" width="3" height="15" fill="#CC2529" />
|
||||
<rect x="0" y="7.5" width="30" height="3" fill="#CC2529" />
|
||||
<polygon
|
||||
points="7.5,17 8.3,19.5 11,19.5 8.8,21.2 9.6,23.7 7.5,22 5.4,23.7 6.2,21.2 4,19.5 6.7,19.5"
|
||||
fill="#fff"
|
||||
/>
|
||||
<polygon
|
||||
points="44,3 44.8,5.5 47.5,5.5 45.3,7.2 46.1,9.7 44,8 41.9,9.7 42.7,7.2 40.5,5.5 43.2,5.5"
|
||||
fill="#fff"
|
||||
/>
|
||||
<polygon
|
||||
points="52,8 52.6,10 54.7,10 53,11.3 53.6,13.3 52,12 50.4,13.3 51,11.3 49.3,10 51.4,10"
|
||||
fill="#fff"
|
||||
/>
|
||||
<polygon
|
||||
points="44,15 44.6,17 46.7,17 45,18.3 45.6,20.3 44,19 42.4,20.3 43,18.3 41.3,17 43.4,17"
|
||||
fill="#fff"
|
||||
/>
|
||||
<polygon
|
||||
points="37,9 37.6,11 39.7,11 38,12.3 38.6,14.3 37,13 35.4,14.3 36,12.3 34.3,11 36.4,11"
|
||||
fill="#fff"
|
||||
/>
|
||||
<polygon
|
||||
points="50,18 50.4,19.2 51.6,19.2 50.6,20 51,21.2 50,20.4 49,21.2 49.4,20 48.4,19.2 49.6,19.2"
|
||||
fill="#fff"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<div class="store-info">
|
||||
<div class="store-info-name">
|
||||
Australia Store
|
||||
<span class="store-badge-active">Live</span>
|
||||
</div>
|
||||
<div class="store-info-desc">
|
||||
Enterprise networking equipment · Ships Australia-wide
|
||||
</div>
|
||||
</div>
|
||||
<span class="store-arrow">→</span>
|
||||
</a>
|
||||
<a data-store="us" class="store-option store-option--active">
|
||||
<span class="store-flag">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 60 30"
|
||||
width="52"
|
||||
height="28"
|
||||
>
|
||||
<rect width="60" height="30" fill="#B22234" />
|
||||
<rect y="2.31" width="60" height="2.31" fill="#fff" />
|
||||
<rect y="6.92" width="60" height="2.31" fill="#fff" />
|
||||
<rect y="11.54" width="60" height="2.31" fill="#fff" />
|
||||
<rect y="16.15" width="60" height="2.31" fill="#fff" />
|
||||
<rect y="20.77" width="60" height="2.31" fill="#fff" />
|
||||
<rect y="25.38" width="60" height="2.31" fill="#fff" />
|
||||
<rect width="24" height="16.15" fill="#3C3B6E" />
|
||||
<g fill="#fff">
|
||||
<circle cx="2.5" cy="1.6" r="1.1" />
|
||||
<circle cx="6.5" cy="1.6" r="1.1" />
|
||||
<circle cx="10.5" cy="1.6" r="1.1" />
|
||||
<circle cx="14.5" cy="1.6" r="1.1" />
|
||||
<circle cx="18.5" cy="1.6" r="1.1" />
|
||||
<circle cx="22.5" cy="1.6" r="1.1" />
|
||||
<circle cx="4.5" cy="4.6" r="1.1" />
|
||||
<circle cx="8.5" cy="4.6" r="1.1" />
|
||||
<circle cx="12.5" cy="4.6" r="1.1" />
|
||||
<circle cx="16.5" cy="4.6" r="1.1" />
|
||||
<circle cx="20.5" cy="4.6" r="1.1" />
|
||||
<circle cx="2.5" cy="7.6" r="1.1" />
|
||||
<circle cx="6.5" cy="7.6" r="1.1" />
|
||||
<circle cx="10.5" cy="7.6" r="1.1" />
|
||||
<circle cx="14.5" cy="7.6" r="1.1" />
|
||||
<circle cx="18.5" cy="7.6" r="1.1" />
|
||||
<circle cx="22.5" cy="7.6" r="1.1" />
|
||||
<circle cx="4.5" cy="10.6" r="1.1" />
|
||||
<circle cx="8.5" cy="10.6" r="1.1" />
|
||||
<circle cx="12.5" cy="10.6" r="1.1" />
|
||||
<circle cx="16.5" cy="10.6" r="1.1" />
|
||||
<circle cx="20.5" cy="10.6" r="1.1" />
|
||||
<circle cx="2.5" cy="13.6" r="1.1" />
|
||||
<circle cx="6.5" cy="13.6" r="1.1" />
|
||||
<circle cx="10.5" cy="13.6" r="1.1" />
|
||||
<circle cx="14.5" cy="13.6" r="1.1" />
|
||||
<circle cx="18.5" cy="13.6" r="1.1" />
|
||||
<circle cx="22.5" cy="13.6" r="1.1" />
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
<div class="store-info">
|
||||
<div class="store-info-name">
|
||||
U.S.A Store
|
||||
<span class="store-badge-active">Live</span>
|
||||
</div>
|
||||
<div class="store-info-desc">
|
||||
Enterprise networking equipment · North American distribution
|
||||
hub
|
||||
</div>
|
||||
</div>
|
||||
<span class="store-arrow">→</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer" role="contentinfo"></footer>
|
||||
<script src="assets/js/footer.js" defer></script>
|
||||
<script src="assets/js/chat.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
|
||||
"links": {
|
||||
"information": [
|
||||
{ "label": "About Us", "url": "about-us", "external": false },
|
||||
{ "label": "About Us", "url": "about-us.html", "direct": true },
|
||||
{ "label": "News", "url": "https://prology.net/blog", "external": true },
|
||||
{ "label": "Contact Us", "url": "contact", "external": false },
|
||||
{ "label": "Terms of Use & Sale", "url": "terms", "external": false },
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
apiEndpoint:
|
||||
P.CHAT_API_URL ||
|
||||
P.API_URL ||
|
||||
"https://prologyms.nswteam.net/chat-plugin/api/support",
|
||||
"https://omni.prology.net/chat-plugin/api/support",
|
||||
whatsappNumber: P.CHAT_WHATSAPP_NUMBER || "84901234567",
|
||||
accentColor: P.CHAT_ACCENT_COLOR || "#4f46e5",
|
||||
position: P.CHAT_POSITION || "right",
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
window.PROLOGY_CONFIG = {
|
||||
API_URL: "https://prologyms.nswteam.net/chat-plugin/api/support",
|
||||
API_URL: "https://omni.prology.net/chat-plugin/api/support",
|
||||
LOGO_SRC: "assets/Prology_logo.png",
|
||||
|
||||
// ── Chat / Support widget ──
|
||||
CHAT_API_URL: "https://prologyms.nswteam.net/chat-plugin/api/support",
|
||||
CHAT_API_URL: "https://omni.prology.net/chat-plugin/api/support",
|
||||
CHAT_WHATSAPP_NUMBER: "84901234567",
|
||||
CHAT_ACCENT_COLOR: "#4f46e5",
|
||||
CHAT_POSITION: "right",
|
||||
|
|
|
|||
|
|
@ -76,10 +76,14 @@
|
|||
|
||||
// Internal items render as <span> that opens the store picker — the picked
|
||||
// store then redirects to {STORE_URL}/{slug-or-url}. External items render
|
||||
// as a regular <a target="_blank">.
|
||||
// as a regular <a target="_blank">. Items flagged `direct: true` render as
|
||||
// a same-site <a> (no modal, no new tab).
|
||||
const renderLinkInner = (item) => {
|
||||
const label = escape(item.label);
|
||||
const url = item.url || "";
|
||||
if (item.direct) {
|
||||
return `<a href="${escape(url)}">${label}</a>`;
|
||||
}
|
||||
if (item.external || /^https?:\/\//i.test(url)) {
|
||||
return `<a href="${escape(linkUrl(item))}" target="_blank" rel="noopener">${label}</a>`;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -128,9 +128,9 @@
|
|||
<li><a href="#home">Home</a></li>
|
||||
<li><a href="#services">Categories</a></li>
|
||||
<li><a href="#quality">Why Choose Us</a></li>
|
||||
<li><a href="#who-we-serve">Who We Serve</a></li>
|
||||
<li><a href="#institutional">Gov & Corp</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li><a href="about-us.html">About Us</a></li>
|
||||
</ul>
|
||||
<div class="nav-cta">
|
||||
<button class="btn-view-products" onclick="openStoreModal()">
|
||||
|
|
|
|||
Loading…
Reference in New Issue