Next.js Discord

Discord Forum

help, how to set a font size as per the div height and width

Unanswered
Cape horse mackerel posted this in #help-forum
Open in Discord
Cape horse mackerelOP
useEffect(() => {
    const divHeight = window.innerHeight - 345;
    const divWidth = window.innerWidth;
    const description = item?.small_description;
    const headingLength = item?.header.length;
    setDivHeights(headingLength < 50 ? divHeight + 15 : divHeight);
    if (description) {
      const lengthRatio = (description.length / (divHeight * divWidth)) * 1000;

      let calculateFontSize = 16;

      if (description.length < 550) {
        calculateFontSize = 18;
      } else if (description.length < 750) {
        calculateFontSize = 17;
      } else if (description.length > 800 && description.length < 900) {
        calculateFontSize = Math.min(
          18,
          Math.max(14, 16 - (lengthRatio - 800) / 100)
        );
      }
      setCalculateFontSize(calculateFontSize);
    }
  }, [item]);

0 Replies