From b42e003519d18007bd006c056c892f6b8fab4704 Mon Sep 17 00:00:00 2001 From: bender Date: Mon, 9 Mar 2026 14:09:50 +0000 Subject: [PATCH 1/2] Update theme fonts --- src/app/layout.tsx | 103 +++++++++++++++------------------------------ 1 file changed, 34 insertions(+), 69 deletions(-) diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 3d4a6cd..ee56031 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -5,19 +5,10 @@ import { Figtree } from "next/font/google"; import "./globals.css"; import { ServiceWrapper } from "@/components/ServiceWrapper"; import Tag from "@/tag/Tag"; +import { Poppins } from "next/font/google"; -const halant = Halant({ - variable: "--font-halant", subsets: ["latin"], - weight: ["300", "400", "500", "600", "700"], -}); -const inter = Inter({ - variable: "--font-inter", subsets: ["latin"], -}); -const figtree = Figtree({ - variable: "--font-figtree", subsets: ["latin"], -}); export const metadata: Metadata = { title: "Ceramic Shine - Professional Car Detailing Perth", description: "Premium car detailing services in Perth: ceramic coating, paint protection, and interior detailing. Expert automotive care for luxury and everyday vehicles.", keywords: "car detailing Perth, ceramic coating, paint protection, auto detailing, car care Western Australia", metadataBase: new URL("https://ceramicshine.com.au"), @@ -38,6 +29,12 @@ export const metadata: Metadata = { }, }; +const poppins = Poppins({ + variable: "--font-poppins", + subsets: ["latin"], + weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"], +}); + export default function RootLayout({ children, }: Readonly<{ @@ -46,9 +43,7 @@ export default function RootLayout({ return ( - + {children} @@ -1660,9 +1655,7 @@ export default function RootLayout({ const getElementInfo = (element, assignId = false) => { const rect = element.getBoundingClientRect(); const tagName = element.tagName.toLowerCase(); - const selector = getUniqueSelector(element, assignId); - const sectionId = getSectionId(element); - + let className = undefined; try { if (element.className) { @@ -1690,8 +1683,7 @@ export default function RootLayout({ }; if (tagName === 'img') { - const originalSrc = extractOriginalUrl(element.src); - info.imageData = { + info.imageData = { src: originalSrc, alt: element.alt || undefined, naturalWidth: element.naturalWidth, @@ -1702,8 +1694,7 @@ export default function RootLayout({ if (tagName === 'video') { const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || ''; - const resolvedSrc = extractOriginalUrl(rawSrc); - info.imageData = { + info.imageData = { src: resolvedSrc, alt: element.getAttribute('aria-label') || undefined, isBackground: false, @@ -1716,8 +1707,7 @@ export default function RootLayout({ if (backgroundImage && backgroundImage !== 'none') { const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/); if (urlMatch) { - const originalBgSrc = extractOriginalUrl(urlMatch[1]); - if (tagName !== 'img') { + if (tagName !== 'img') { info.imageData = { src: originalBgSrc, isBackground: true @@ -1729,8 +1719,7 @@ export default function RootLayout({ } } - const elementType = getElementType(element); - info.elementType = elementType; + info.elementType = elementType; if (elementType === 'Button') { const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || ''; @@ -1823,13 +1812,11 @@ export default function RootLayout({ }; const isTextElement = (element) => { - const elementType = getElementType(element); - return elementType === 'Text'; + return elementType === 'Text'; }; const isButtonElement = (element) => { - const elementType = getElementType(element); - return elementType === 'Button'; + return elementType === 'Button'; }; const updateButtonText = (element, newText) => { @@ -1904,8 +1891,7 @@ export default function RootLayout({ }; const handleInput = () => { - const elementInfo = getElementInfo(element); - let currentText = element.textContent; + let currentText = element.textContent; // Ensure there's always at least a space to keep the element editable if (currentText === '' || currentText === null || currentText.length === 0) { @@ -2018,8 +2004,7 @@ export default function RootLayout({ }, '*'); if (save && originalContent !== element.textContent) { - const elementInfo = getElementInfo(element); - let finalText = element.textContent; + let finalText = element.textContent; // Trim the final text and convert space-only to empty string for saving if (finalText === ' ' || finalText.trim() === '') { @@ -2148,7 +2133,7 @@ export default function RootLayout({ lastMouseX = e.clientX; lastMouseY = e.clientY; - const target = getMostSpecificElement(e.clientX, e.clientY) || e.target; + || e.target; if (!isValidElement(target) || target === hoveredElement || target === selectedElement) { return; @@ -2180,8 +2165,7 @@ export default function RootLayout({ hoverOverlay = createHoverOverlay(target); } - const elementType = getElementType(target); - showElementTypeLabel(target, elementType); + showElementTypeLabel(target, elementType); window.parent.postMessage({ type: 'webild-element-hover', @@ -2223,7 +2207,7 @@ export default function RootLayout({ e.preventDefault(); e.stopPropagation(); - const target = getMostSpecificElement(e.clientX, e.clientY) || e.target; + || e.target; if (!isValidElement(target)) return; if (selectedElement && selectedElement !== target) { @@ -2268,8 +2252,7 @@ export default function RootLayout({ hoveredElement = null; } - const elementInfo = getElementInfo(target, true); - selectedElement.dataset.webildSelector = elementInfo.selector; + selectedElement.dataset.webildSelector = elementInfo.selector; showElementTypeLabel(target, elementInfo.elementType); window.parent.postMessage({ @@ -2352,8 +2335,7 @@ export default function RootLayout({ isScrolling = false; if (lastMouseX > 0 && lastMouseY > 0) { - const target = getMostSpecificElement(lastMouseX, lastMouseY); - if (target && isValidElement(target) && target !== selectedElement) { + if (target && isValidElement(target) && target !== selectedElement) { hoveredElement = target; const computedStyle = window.getComputedStyle(target); @@ -2367,8 +2349,7 @@ export default function RootLayout({ hoveredElement.classList.add(hoverClass); hoverOverlay = createHoverOverlay(target); - const elementType = getElementType(target); - showElementTypeLabel(target, elementType); + showElementTypeLabel(target, elementType); window.parent.postMessage({ type: 'webild-element-hover', @@ -2391,8 +2372,7 @@ export default function RootLayout({ const saveChangeToStorage = (change) => { try { - const storageKey = getStorageKey(); - const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]'); + const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]'); const filteredChanges = existingChanges.filter(c => { return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId); @@ -2412,8 +2392,7 @@ export default function RootLayout({ const clearLocalChanges = () => { try { - const storageKey = getStorageKey(); - localStorage.removeItem(storageKey); + localStorage.removeItem(storageKey); window.parent.postMessage({ type: 'webild-local-changes-cleared', data: {} @@ -2462,8 +2441,7 @@ export default function RootLayout({ if (e.data.type === 'webild-cancel-changes') { try { - const storageKey = getStorageKey(); - const savedChanges = localStorage.getItem(storageKey); + const savedChanges = localStorage.getItem(storageKey); if (savedChanges) { const changes = JSON.parse(savedChanges); changes.forEach(change => { @@ -2485,8 +2463,7 @@ export default function RootLayout({ if (isBackground) { element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : ''; } else { - const oldMediaType = getMediaTypeFromUrl(change.oldValue); - if (revertTag === 'video' && oldMediaType === 'image') { + if (revertTag === 'video' && oldMediaType === 'image') { swapMediaElement(element, 'img', change.oldValue); } else if (revertTag === 'img' && oldMediaType === 'video') { swapMediaElement(element, 'video', change.oldValue); @@ -2534,8 +2511,7 @@ export default function RootLayout({ const el = textElements[i]; if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) { element = el; - const newSelector = getUniqueSelector(element, true); - if (newSelector) { + if (newSelector) { element.dataset.webildSelector = newSelector; } break; @@ -2626,10 +2602,8 @@ export default function RootLayout({ replaced = true; } else if (element.tagName.toLowerCase() === 'img') { oldValue = element.src; - const newMediaType = getMediaTypeFromUrl(newSrc); - if (newMediaType === 'video' && allowMediaTypeSwap) { - const swapped = swapMediaElement(element, 'video', newSrc); - if (selectedElement === element) selectedElement = swapped; + if (newMediaType === 'video' && allowMediaTypeSwap) { + if (selectedElement === element) selectedElement = swapped; element = swapped; } else { element.src = newSrc; @@ -2637,11 +2611,9 @@ export default function RootLayout({ replaced = true; } else if (element.tagName.toLowerCase() === 'video') { oldValue = element.src || element.currentSrc || ''; - const newMediaType = getMediaTypeFromUrl(newSrc); - const sources = element.querySelectorAll('source'); + const sources = element.querySelectorAll('source'); if (newMediaType === 'image' && allowMediaTypeSwap) { - const swapped = swapMediaElement(element, 'img', newSrc); - if (selectedElement === element) selectedElement = swapped; + if (selectedElement === element) selectedElement = swapped; element = swapped; } else { if (sources.length > 0) { @@ -2663,8 +2635,7 @@ export default function RootLayout({ } if (replaced) { - const elementInfo = getElementInfo(element); - + let cleanOldValue = oldValue; if (oldValue.includes('url(')) { const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/); @@ -2735,13 +2706,7 @@ export default function RootLayout({ } }, true); - const urlCheckInterval = setInterval(() => { - if (lastPathname !== window.location.pathname) { - lastPathname = window.location.pathname; - notifyPageChange(); - } - }, 500); - + notifyPageChange(); window.webildCleanup = () => { -- 2.49.1 From e53a1f3f04797e967326ba7ad94fca9b490c955f Mon Sep 17 00:00:00 2001 From: bender Date: Mon, 9 Mar 2026 14:09:51 +0000 Subject: [PATCH 2/2] Update theme fonts --- src/app/styles/base.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/styles/base.css b/src/app/styles/base.css index 578efaa..0f9f89d 100644 --- a/src/app/styles/base.css +++ b/src/app/styles/base.css @@ -11,7 +11,7 @@ html { body { background-color: var(--background); color: var(--foreground); - font-family: var(--font-figtree), sans-serif; + font-family: var(--font-poppins), sans-serif; position: relative; min-height: 100vh; overscroll-behavior: none; @@ -24,5 +24,5 @@ h3, h4, h5, h6 { - font-family: var(--font-figtree), sans-serif; + font-family: var(--font-poppins), sans-serif; } -- 2.49.1