https://www.screamingeyepress.com/wp-content/themes/cutie-pie-child/assets/js/sep-title-fit.js?ver=1784483625

1(function () {
2	'use strict';
3
4	const titleSelector = '.sep-fallback-thumbnail__title';
5	const cardSelector = '.sep-fallback-thumbnail';
6
7	/**
8	 * Calculate the preferred font size from the card width.
9	 *
10	 * Examples:
11	 * 160px-wide sidebar card ≈ 20px text
12	 * 460px-wide main card ≈ 48px text
13	 */
14	function getPreferredFontSize(cardWidth) {
15		return Math.max(
16			14,
17			Math.min(54, cardWidth * 0.105)
18		);
19	}
20
21	function fitTitle(title) {
22		const overlay = title.closest(
23			'.sep-fallback-thumbnail__overlay'
24		);
25
26		const card = title.closest(cardSelector);
27
28		if (!overlay || !card) {
29			return;
30		}
31
32		const overlayStyle = window.getComputedStyle(overlay);
33
34		const horizontalPadding =
35			parseFloat(overlayStyle.paddingLeft) +
36			parseFloat(overlayStyle.paddingRight);
37
38		const verticalPadding =
39			parseFloat(overlayStyle.paddingTop) +
40			parseFloat(overlayStyle.paddingBottom);
41
42		const availableWidth =
43			overlay.clientWidth - horizontalPadding;
44
45		const availableHeight =
46			overlay.clientHeight - verticalPadding;
47
48		if (availableWidth <= 0 || availableHeight <= 0) {
49			return;
50		}
51
52		/*
53		 * Start with a size based directly on the card width.
54		 */
55		const preferredSize = getPreferredFontSize(
56			card.clientWidth
57		);
58
59		/*
60		 * Keep the minimum proportional too.
61		 *
62		 * Large cards will not shrink down to tiny sidebar text.
63		 */
64		const minimumSize = Math.max(
65			12,
66			preferredSize * 0.55
67		);
68
69		let fontSize = preferredSize;
70
71		title.style.fontSize = fontSize + 'px';
72		title.style.whiteSpace = 'normal';
73
74		/*
75		 * Shrink only when the title actually exceeds the available
76		 * vertical space.
77		 */
78		while (
79			fontSize > minimumSize &&
80			(
81				title.scrollHeight > availableHeight ||
82				title.scrollWidth > availableWidth
83			)
84		) {
85			fontSize -= 1;
86			title.style.fontSize = fontSize + 'px';
87		}
88	}
89
90	function fitAllTitles() {
91		document
92			.querySelectorAll(titleSelector)
93			.forEach(fitTitle);
94	}
95
96	fitAllTitles();
97
98	window.addEventListener('load', fitAllTitles);
99
100	if (document.fonts && document.fonts.ready) {
101		document.fonts.ready.then(fitAllTitles);
102	}
103
104	if ('ResizeObserver' in window) {
105		const observer = new ResizeObserver(function (entries) {
106			entries.forEach(function (entry) {
107				const title = entry.target.querySelector(
108					titleSelector
109				);
110
111				if (title) {
112					fitTitle(title);
113				}
114			});
115		});
116
117		document
118			.querySelectorAll(cardSelector)
119			.forEach(function (card) {
120				observer.observe(card);
121			});
122	} else {
123		window.addEventListener('resize', fitAllTitles);
124	}
125})();