两行标题自适应

src/pages/UI7/UI7.css

@@ -22,6 +22,29 @@
   padding: 32px 42px;
 }
 
+.ui7-basic-title {
+  height: 91px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  color: rgba(0, 45, 93, 1);
+  font-size: 52px;
+  font-family: NotoSansCJKsc-Bold;
+  font-weight: 700;
+  text-align: center;
+  white-space: normal;
+  line-height: 91px;
+  overflow: hidden;
+}
+
+.ui7-basic-title.compact {
+  font-size: 42px;
+  line-height: 45px;
+  height: 91px;
+}
+
 .ui7-text-content .paragraph_1 {
   font-family: NotoSansCJKsc-Medium;
   font-weight: 500;

src/pages/UI7/UI7.tsx

@@ -103,6 +103,8 @@ const UI7: React.FC = () => {
   const [currentStep, setCurrentStep] = useState(0);
   const [hasSignature, setHasSignature] = useState(false);
   const [currentPdfPageCount, setCurrentPdfPageCount] = useState(0);
+  const titleRef = useRef<HTMLSpanElement | null>(null);
+  const [isTitleCompact, setIsTitleCompact] = useState(false);
 
   const totalRequiredSignatures = pdfInfoList.length + 1;
   const isInstructionStep = currentStep === 0;
@@ -247,6 +249,50 @@ const UI7: React.FC = () => {
     setHasSignature(false);
   }, [currentStep]);
 
+  // 检测标题文本是否超过一行，如果超过则应用缩小样式
+  useEffect(() => {
+    const checkTitleOverflow = () => {
+      if (!titleRef.current) return;
+
+      const element = titleRef.current;
+
+      // 先移除 compact 类，以正常大小检测
+      element.classList.remove('compact');
+
+      // 使用 requestAnimationFrame 确保 DOM 已更新
+      requestAnimationFrame(() => {
+        if (!element) return;
+
+        // 获取实际内容高度
+        const scrollHeight = element.scrollHeight;
+        // 单行高度为 91px（line-height）
+        const singleLineHeight = 91;
+
+        // 如果内容高度超过单行高度，说明换行了
+        const needsCompact = scrollHeight > singleLineHeight;
+        setIsTitleCompact(needsCompact);
+
+        // 如果需要 compact，添加类名
+        if (needsCompact) {
+          element.classList.add('compact');
+        }
+      });
+    };
+
+    // 延迟执行，确保 DOM 已渲染
+    const timer = setTimeout(() => {
+      checkTitleOverflow();
+    }, 100);
+
+    // 监听窗口大小变化
+    window.addEventListener('resize', checkTitleOverflow);
+
+    return () => {
+      clearTimeout(timer);
+      window.removeEventListener('resize', checkTitleOverflow);
+    };
+  }, [currentStep, currentPdfName, isInstructionStep]);
+
   const resetCountdown = useCallback(() => {
     setCountdown(5);
     setShowWaitButton(true);
@@ -527,8 +573,10 @@ const UI7: React.FC = () => {
     <div className="basic-root">
       <div className="basic-white-block">
         <div className="basic-content">
-          <span className="basic-title">
+          <span
-
+            ref={titleRef}
+            className={`ui7-basic-title ${isTitleCompact ? 'compact' : ''}`}
+          >
             {!isInstructionStep && currentPdfName ? `${currentPdfName}` : "检测项目知情同意书确认"}
           </span>
           <DecorLine />