新增标题字体

src/style.css

@@ -1,5 +1,13 @@
 @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap');
 
+@font-face {
+    font-family: 'PingFangLiuAngLeTianTi';
+    src: url('/fonts/PingFangLiuAngLeTianTi-2.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -12,26 +20,32 @@ body {
 
 /* 自定义动画 */
 @keyframes cooking {
+
     0%,
     100% {
         transform: translateY(0px) rotate(0deg);
     }
+
     25% {
         transform: translateY(-5px) rotate(2deg);
     }
+
     50% {
         transform: translateY(-3px) rotate(-1deg);
     }
+
     75% {
         transform: translateY(-7px) rotate(1deg);
     }
 }
 
 @keyframes fire {
+
     0%,
     100% {
         transform: scaleY(1) scaleX(1);
     }
+
     50% {
         transform: scaleY(1.1) scaleX(0.95);
     }
@@ -42,6 +56,7 @@ body {
         opacity: 0.7;
         transform: translateY(0px) scale(1);
     }
+
     100% {
         opacity: 0;
         transform: translateY(-20px) scale(1.2);
@@ -49,10 +64,12 @@ body {
 }
 
 @keyframes pulse-glow {
+
     0%,
     100% {
         box-shadow: 0 0 20px rgba(249, 115, 22, 0.3);
     }
+
     50% {
         box-shadow: 0 0 30px rgba(249, 115, 22, 0.6);
     }
@@ -87,4 +104,4 @@ body {
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
-}
+}

src/views/Home.vue

@@ -6,8 +6,8 @@
                 <button class="bg-white/20 hover:bg-white/30 rounded-full px-3 py-1 text-sm text-white transition-colors">中文</button>
             </div> -->
             <div class="text-center py-8">
-                <h1 class="text-5xl font-black text-yellow-300 mb-2 tracking-wider">一饭封神</h1>
-                <p class="text-white text-lg font-medium">UPLOAD YOUR INGREDIENTS | SPIT OUT RECIPES!</p>
+                <h1 class="text-5xl font-black text-yellow-300 mb-2 tracking-wider md:text-[5rem] font-['PingFangLiuAngLeTianTi']">一饭封神</h1>
+                <p class="text-white text-lg font-medium text-[12px] md:text-[1.5rem]">LEGENDARY STATUS FROM A SINGLE MEAL!</p>
             </div>
         </header>