TFL Resources

This commit is contained in:
nmemmert
2026-06-04 09:46:51 -04:00
parent 8d95c50041
commit bccd1cfa60
3 changed files with 15 additions and 10 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
{ {
"users": {}, "users": {},
"updatedAt": "2026-06-04T13:16:50.352Z" "updatedAt": "2026-06-04T13:37:05.049Z"
} }
+6
View File
@@ -1131,6 +1131,12 @@
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.tfl-widget-wrap iframe {
max-width: 760px;
margin: 0 auto;
display: block;
}
.tfl-attribution { .tfl-attribution {
color: #8a7f5a; color: #8a7f5a;
font-size: 0.9rem; font-size: 0.9rem;
+8 -9
View File
@@ -1056,13 +1056,11 @@ function HomepageNewsletterSection() {
) )
} }
type TflWidgetType = 'audiodevo' | 'abdevotional' type TflWidgetType = 'audiodevo' | 'abdevotional' | 'resourcead'
function TruthForLifeWidget({ type = 'audiodevo' }: { type?: TflWidgetType }) { function TruthForLifeWidget({ type = 'audiodevo' }: { type?: TflWidgetType }) {
// Use an iframe so TFL's script gets a fresh page context with its own const iframeHeight = type === 'audiodevo' ? '420' : type === 'resourcead' ? '270' : '800'
// DOMContentLoaded — required because this is a SPA and that event has const heading = type === 'resourcead' ? 'Recommended Resources' : 'Daily Devotional'
// already fired on the outer page before this component ever mounts.
const iframeHeight = type === 'audiodevo' ? '420' : '800'
const srcdoc = `<!DOCTYPE html> const srcdoc = `<!DOCTYPE html>
<html> <html>
@@ -1085,11 +1083,11 @@ function TruthForLifeWidget({ type = 'audiodevo' }: { type?: TflWidgetType }) {
</html>` </html>`
return ( return (
<section className="section-tfl" aria-label="Truth For Life devotional"> <section className="section-tfl" aria-label="Truth For Life devotional" style={type === 'resourcead' ? { padding: '2.5rem 0' } : undefined}>
<div className="section-inner"> <div className="section-inner">
<div className="tfl-label-row"> <div className="tfl-label-row" style={type === 'resourcead' ? { marginBottom: '1rem' } : undefined}>
<h2 className="section-heading" style={{ marginBottom: '0.25rem' }}> <h2 className="section-heading" style={{ marginBottom: '0.25rem' }}>
<span className="ornament"></span> Daily Devotional <span className="ornament"></span> <span className="ornament">✦</span> {heading} <span className="ornament">✦</span>
</h2> </h2>
<p className="tfl-attribution" style={{ marginBottom: '1rem' }}> <p className="tfl-attribution" style={{ marginBottom: '1rem' }}>
<a href="https://www.truthforlife.org" target="_blank" rel="noreferrer" className="tfl-link" style={{ fontSize: '1rem', fontWeight: 600 }}>Truth For Life</a> <a href="https://www.truthforlife.org" target="_blank" rel="noreferrer" className="tfl-link" style={{ fontSize: '1rem', fontWeight: 600 }}>Truth For Life</a>
@@ -1102,7 +1100,7 @@ function TruthForLifeWidget({ type = 'audiodevo' }: { type?: TflWidgetType }) {
title="Truth For Life daily devotional" title="Truth For Life daily devotional"
width="100%" width="100%"
height={iframeHeight} height={iframeHeight}
style={{ border: 'none', display: 'block', borderRadius: '10px' }} style={{ border: 'none', display: 'block', borderRadius: '10px', maxWidth: type === 'resourcead' ? '500px' : '760px', margin: '0 auto' }}
sandbox="allow-scripts allow-same-origin allow-popups" sandbox="allow-scripts allow-same-origin allow-popups"
/> />
</div> </div>
@@ -1663,6 +1661,7 @@ function ResourcesPage({ content }: { content: SiteContent }) {
<StudyGuideSection content={content} /> <StudyGuideSection content={content} />
<DownloadLibrarySection content={content} /> <DownloadLibrarySection content={content} />
<CustomBlocksSection content={content} page="downloads" /> <CustomBlocksSection content={content} page="downloads" />
<TruthForLifeWidget type="resourcead" />
<SiteFooter content={content} /> <SiteFooter content={content} />
<AnalyticsConsentBanner content={content} /> <AnalyticsConsentBanner content={content} />
</div> </div>