diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index d8fbf95..0000000 Binary files a/.DS_Store and /dev/null differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..0de85fe --- /dev/null +++ b/.gitignore @@ -0,0 +1,10 @@ +# macOS +.DS_Store + +# Editor +.vscode/ + +# Local-only notes & dev artifacts (not for production) +issues.txt +SITEMAP.md +store-picker-snippet.html diff --git a/SITEMAP.md b/SITEMAP.md deleted file mode 100644 index 6c5ce1b..0000000 --- a/SITEMAP.md +++ /dev/null @@ -1,152 +0,0 @@ -# Prology IT — Site Map - -> Base URL: `https://prology.net` -> Landing page repo: `index.html` (single-page, anchor-based navigation) - ---- - -## Pages & Sections - -``` -prology.net/ ← Homepage (x-default) -├── prology.net/au/ ← AU Store (en-au) -└── prology.net/us/ ← US Store (en-us) -``` - -### Landing Page Sections (`index.html`) - -``` -#home Hero - ├── Typewriter animation (server/blade chassis visual) - ├── eBay banner → ebay.com.au/str/prologyit - ├── Search tab: Buy (→ /catalogsearch/result/?q=...) - ├── Search tab: Sell (email → opens Valuation Modal) - └── Stats grid: 15+ yrs · 45+ countries · 100k+ units · AU & US - -#services Product Categories - ├── Routers - ├── Switches - ├── Wireless Access - ├── Security Appliances - ├── Load Balancers - ├── WAN Access - ├── Network Mgmt - └── [Shop CTA] → Store Picker Modal - -#quality Why Choose Prology? - ├── Dual Warehouse: AU & US - ├── Strong Sourcing Network - ├── Faster, Smarter Logistics - └── Flexible for Business Orders - -#who-we-serve Who We Serve - ├── Getting Started - ├── Running Projects - ├── Growing Operations - ├── Large-Scale Procurement - ├── [Request a Quote] → Quote Modal - └── [Shop Now] → Store Picker Modal - -#institutional Government & Corporate Orders - └── [Enquire Now] → Enquire Modal - -#contact Final CTA - ├── Source IT Hardware → Store Picker Modal - └── Sell Us Your Assets → Valuation Modal -``` - ---- - -## Modals (client-side, no URL change) - -| Modal | Trigger | Purpose | -|---|---|---| -| Store Picker | "View Products", "Shop Now" | Choose AU or US store | -| Valuation Modal | "Get Valuation", Sell tab | Asset recovery / buy-back quote | -| Source Modal | (programmatic) | Hardware sourcing RFQ | -| Quote Modal | "Request a Quote" | IT procurement quote | -| Enquire Modal | "Enquire Now" | Gov & Corporate enquiry | - ---- - -## Store Pages - -> Categories tồn tại ở cả hai store views — AU và US. - -``` -prology.net/ -├── au/ ← AU Store -│ ├── Products (shared categories) -│ │ ├── compute.html -│ │ ├── storage.html -│ │ ├── networking.html -│ │ ├── security.html -│ │ ├── end-user.html -│ │ ├── data-center.html -│ │ └── components.html -│ │ -│ ├── manufacturers -│ │ -│ ├── Information -│ │ ├── about-us -│ │ ├── contact -│ │ ├── faq -│ │ └── returns -│ │ -│ ├── Customer Account -│ │ ├── customer/account -│ │ ├── sales/order/history -│ │ ├── sales/guest/form ← Track Order (guest) -│ │ └── wishlist -│ │ -│ └── Legal -│ ├── terms -│ ├── privacy-policy-cookie-restriction-mode -│ └── enable-cookies -│ -└── us/ ← US Store - ├── Products (shared categories) - │ ├── compute.html - │ ├── storage.html - │ ├── networking.html - │ ├── security.html - │ ├── end-user.html - │ ├── data-center.html - │ └── components.html - │ - └── manufacturers -``` - ---- - -## External Links - -| Destination | Context | -|---|---| -| `ebay.com.au/str/prologyit` | eBay banner (hero) | -| `ebay.com.au/str/prologyptyltd` | Footer social | -| `prology.net/blog` | Footer — News | -| `facebook.com/prology.net/` | Footer social | -| `linkedin.com/company/…` | Footer social | -| `youtube.com/@PrologyPtyLtd` | Footer social | - ---- - -## Assets / Tech Stack - -``` -assets/ -├── css/styles.css -├── js/ -│ ├── config.js ← PROLOGY_CONFIG (URLs, keys) -│ ├── hero.js ← Typewriter, scroll, reveal animations -│ ├── modals.js ← Web Components for all modals -│ ├── footer.js ← Dynamic footer from data-footer.json -│ └── chat.js ← Support chat widget -├── data-footer.json ← Footer content (addresses, links, payment icons) -├── Prology_logo.png -├── Banner_Ebay_Final_news-min.png -└── images/icons/ - ├── payment/ ← PayPal, Visa, Mastercard, Amex, Afterpay - └── shipping/ ← DHL, UPS, FedEx, TNT, Couriers Please, Startrack, AusPost, Sendle -``` diff --git a/assets/css/styles.css b/assets/css/styles.css index 04922f6..5a608e1 100644 --- a/assets/css/styles.css +++ b/assets/css/styles.css @@ -1,3 +1,12 @@ +/* ===== A11Y / SEO UTILITY ===== */ +.sr-only { + position: absolute !important; + width: 1px !important; height: 1px !important; + padding: 0 !important; margin: -1px !important; + overflow: hidden !important; clip: rect(0,0,0,0) !important; + white-space: nowrap !important; border: 0 !important; +} + /* ===== MAGENTO CMS RESET ===== */ body { background:#0B1120 !important; margin:0 !important; padding:0 !important; } .page-wrapper, .page-main, main, .columns, .column.main, @@ -3298,7 +3307,8 @@ body::before { flex-direction: column; gap: 2px; } -.ns-footer__col li a { +.ns-footer__col li a, +.ns-footer__col li .ns-footer__category { font-size: 0.83rem; color: rgba(255, 255, 255, 0.6); text-decoration: none; @@ -3306,7 +3316,14 @@ body::before { display: block; transition: color 0.18s ease; } -.ns-footer__col li a:hover { color: #ffffff; } +.ns-footer__col li .ns-footer__category { cursor: pointer; } +.ns-footer__col li a:hover, +.ns-footer__col li .ns-footer__category:hover { color: #ffffff; } +.ns-footer__col li .ns-footer__category:focus-visible { + outline: 2px solid rgba(255, 255, 255, 0.4); + outline-offset: 2px; + color: #ffffff; +} /* ── FOOTER PARTNERS: payment + shipping logos ── */ .ns-footer__partners { @@ -3384,13 +3401,18 @@ body::before { margin: 0; padding: 0; } -.ns-footer__bottom-links a { +.ns-footer__bottom-links a, +.ns-footer__bottom-links .ns-footer__category { font-size: 0.75rem; color: rgba(255, 255, 255, 0.35); text-decoration: none; transition: color 0.18s ease; + display: inline; + padding: 0; } -.ns-footer__bottom-links a:hover { color: rgba(255, 255, 255, 0.7); } +.ns-footer__bottom-links .ns-footer__category { cursor: pointer; } +.ns-footer__bottom-links a:hover, +.ns-footer__bottom-links .ns-footer__category:hover { color: rgba(255, 255, 255, 0.7); } /* Social icons */ .ns-footer__social { diff --git a/assets/js/config.js b/assets/js/config.js index 3cd123a..2f90855 100644 --- a/assets/js/config.js +++ b/assets/js/config.js @@ -22,14 +22,16 @@ window.PROLOGY_CONFIG = { FOOTER_BASE_URL: "https://prology.net/au/", FOOTER_STATIC_URL: "assets/", FOOTER_LOGO_URL: "assets/Prology_logo.png", + // Rendered as buttons that open the store-picker modal. + // After picking a store, user is redirected to {STORE_URL}/{slug}. FOOTER_CATEGORIES: [ - { label: "Compute", url: "compute" }, - { label: "Storage", url: "storage" }, - { label: "Networking", url: "networking" }, - { label: "Security", url: "security" }, - { label: "End User", url: "end-user" }, - { label: "Data Center", url: "data-center" }, - { label: "Components", url: "components" }, + { label: "Compute", slug: "compute" }, + { label: "Storage", slug: "storage" }, + { label: "Networking", slug: "networking" }, + { label: "Security", slug: "security" }, + { label: "End User", slug: "end-user" }, + { label: "Data Center", slug: "data-center" }, + { label: "Components", slug: "components" }, ], FOOTER_LEGAL_LINKS: [ { label: "Privacy Policy", url: "privacy-policy-cookie-restriction-mode" }, diff --git a/assets/js/footer.js b/assets/js/footer.js index 922f69c..94e4ef5 100644 --- a/assets/js/footer.js +++ b/assets/js/footer.js @@ -20,6 +20,7 @@ const linkUrl = (item) => { const url = item.url || ""; if (item.external || /^https?:\/\//i.test(url)) return url; + if (url.startsWith("/")) return url; const trimmed = url.replace(/^\/+/, ""); const suffix = /\.[a-z0-9]+$/i.test(trimmed) ? "" : "/"; return CFG.FOOTER_BASE_URL + trimmed + suffix; @@ -65,7 +66,7 @@ return `

${escape(data.company_name || "")}

${addressBlocks} @@ -73,14 +74,23 @@
`; }; + // Internal items render as that opens the store picker — the picked + // store then redirects to {STORE_URL}/{slug-or-url}. External items render + // as a regular . + const renderLinkInner = (item) => { + const label = escape(item.label); + const url = item.url || ""; + if (item.external || /^https?:\/\//i.test(url)) { + return `${label}`; + } + const slug = escape(item.slug || url || ""); + const call = `openStoreModal('${slug}')`; + return `${label}`; + }; + const renderCol = (title, items) => { if (!items || !items.length) return ""; - const lis = items - .map( - (it) => - `
  • ${escape(it.label)}
    • `, - ) - .join(""); + const lis = items.map((it) => `
  • ${renderLinkInner(it)}
    • `).join(""); return `