Update theme fonts

This commit is contained in:
2026-03-04 07:45:45 +00:00
parent 90620ba24e
commit 8aefc03fda

View File

@@ -6,18 +6,8 @@ import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant", subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
});
const openSans = Open_Sans({
variable: "--font-open-sans", subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Torah Lock - iOS Torah Lock for Jewish Morning Prayers", description: "Start your day with Hashem. Torah Lock is a beautiful iOS app designed to help Jewish users pray every morning with guided prayers, reminders, and community connection.", keywords: "prayer app, iOS, Jewish, morning prayers, spiritual growth, Torah Lock", metadataBase: new URL("https://shachar-prayer.com"),
@@ -33,6 +23,15 @@ export const metadata: Metadata = {
},
};
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
const openSans = Open_Sans({
variable: "--font-open-sans",
subsets: ["latin"],
});
export default function RootLayout({
children,
}: Readonly<{
@@ -41,9 +40,7 @@ export default function RootLayout({
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${openSans.variable} antialiased`}
>
<body className={`${inter.variable} ${openSans.variable} antialiased`}>
<Tag />
{children}
@@ -288,9 +285,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) {
@@ -318,8 +313,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,
@@ -330,8 +324,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,
@@ -344,8 +337,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
@@ -357,8 +349,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') || '';
@@ -451,13 +442,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) => {
@@ -532,8 +521,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) {
@@ -646,8 +634,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() === '') {
@@ -776,7 +763,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;
@@ -808,8 +795,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',
@@ -851,7 +837,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) {
@@ -896,8 +882,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({
@@ -980,8 +965,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);
@@ -995,8 +979,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',
@@ -1019,8 +1002,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);
@@ -1040,8 +1022,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: {}
@@ -1090,8 +1071,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 => {
@@ -1113,8 +1093,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);
@@ -1162,8 +1141,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;
@@ -1254,10 +1232,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;
@@ -1265,11 +1241,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) {
@@ -1291,8 +1265,7 @@ export default function RootLayout({
}
if (replaced) {
const elementInfo = getElementInfo(element);
let cleanOldValue = oldValue;
if (oldValue.includes('url(')) {
const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
@@ -1363,13 +1336,7 @@ export default function RootLayout({
}
}, true);
const urlCheckInterval = setInterval(() => {
if (lastPathname !== window.location.pathname) {
lastPathname = window.location.pathname;
notifyPageChange();
}
}, 500);
notifyPageChange();
window.webildCleanup = () => {
@@ -1655,9 +1622,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) {
@@ -1685,8 +1650,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,
@@ -1697,8 +1661,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,
@@ -1711,8 +1674,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
@@ -1724,8 +1686,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') || '';
@@ -1818,13 +1779,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) => {
@@ -1899,8 +1858,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) {
@@ -2013,8 +1971,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() === '') {
@@ -2143,7 +2100,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;
@@ -2175,8 +2132,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',
@@ -2218,7 +2174,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) {
@@ -2263,8 +2219,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({
@@ -2347,8 +2302,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);
@@ -2362,8 +2316,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',
@@ -2386,8 +2339,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);
@@ -2407,8 +2359,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: {}
@@ -2457,8 +2408,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 => {
@@ -2480,8 +2430,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);
@@ -2529,8 +2478,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;
@@ -2621,10 +2569,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;
@@ -2632,11 +2578,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) {
@@ -2658,8 +2602,7 @@ export default function RootLayout({
}
if (replaced) {
const elementInfo = getElementInfo(element);
let cleanOldValue = oldValue;
if (oldValue.includes('url(')) {
const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
@@ -2730,13 +2673,7 @@ export default function RootLayout({
}
}, true);
const urlCheckInterval = setInterval(() => {
if (lastPathname !== window.location.pathname) {
lastPathname = window.location.pathname;
notifyPageChange();
}
}, 500);
notifyPageChange();
window.webildCleanup = () => {