feat: 样式调整

src/layouts/MainLayout/MainLayout.tsx

@@ -38,7 +38,7 @@ export const MainLayout: React.FC<MainLayoutProps> = ({ children }) => {
       <motion.div
       <motion.div
         animate={isHistoryVisible ? 'shrunk' : 'expanded'}
         animate={isHistoryVisible ? 'shrunk' : 'expanded'}
         variants={contentVariants}
         variants={contentVariants}
-        className={`h-full pl-[12px] flex items-center ${isHistoryVisible ? 'w-[340px]' : 'w-[90px]'}`}
+        className={`hidden sm:flex h-full pl-[12px] items-center ${isHistoryVisible ? 'w-[340px]' : 'w-[90px]'}`}
       >
       >
         <Navbar isHistoryVisible={isHistoryVisible} onSetHistoryVisible={setHistoryVisible} />
         <Navbar isHistoryVisible={isHistoryVisible} onSetHistoryVisible={setHistoryVisible} />
         <HistoryBar isVisible={isHistoryVisible} />
         <HistoryBar isVisible={isHistoryVisible} />

src/pages/Home/Home.tsx

@@ -55,9 +55,9 @@ export const Home: React.FC = () => {
                   {/* 欢迎语 */}
                   {/* 欢迎语 */}
                   <div className="gap-[20px] flex justify-center flex-row flex-wrap  mt-[42px] sm:mt-[62px] lg:mt-[112px]">
                   <div className="gap-[20px] flex justify-center flex-row flex-wrap  mt-[42px] sm:mt-[62px] lg:mt-[112px]">
 
 
-                    <motion.div {...getAnimationProps(1)}><WelcomeWord /></motion.div>
-                    <motion.div {...getAnimationProps(2)}><QuestionList questions={RECOMMEND_QUESTIONS_PRODUCT} dotColor="#D4CCFF" title="产品问答" iconImg={HomeIcon1} /></motion.div>
-                    <motion.div {...getAnimationProps(3)}><QuestionList questions={RECOMMEND_QUESTIONS_OTHER} dotColor="#CBECFF" title="其他问答" iconImg={HomeIcon2} /></motion.div>
+                    <motion.div className="w-full hidden sm:block sm:w-auto" {...getAnimationProps(1)}><WelcomeWord /></motion.div>
+                    <motion.div className="w-full sm:w-auto" {...getAnimationProps(2)}><QuestionList questions={RECOMMEND_QUESTIONS_PRODUCT} dotColor="#D4CCFF" title="产品问答" iconImg={HomeIcon1} /></motion.div>
+                    <motion.div className="w-full sm:w-auto" {...getAnimationProps(3)}><QuestionList questions={RECOMMEND_QUESTIONS_OTHER} dotColor="#CBECFF" title="其他问答" iconImg={HomeIcon2} /></motion.div>
                   </div>
                   </div>
                 </div>
                 </div>
               )}
               )}

src/pages/Home/components/QuestionList/QuestionList.tsx

@@ -107,7 +107,7 @@ const QuestionListBase: React.FC<QuestionListProps & WithAuthProps> = ({ checkAu
         variants={containerVariants}
         variants={containerVariants}
         initial="hidden"
         initial="hidden"
         animate="visible"
         animate="visible"
-        className="mt-[18px] flex flex-col gap-[8px]"
+        className="mt-[18px] flex flex-col gap-[8px] w-full"
       >
       >
         <AnimatePresence mode="wait">
         <AnimatePresence mode="wait">
           {
           {
@@ -120,6 +120,7 @@ const QuestionListBase: React.FC<QuestionListProps & WithAuthProps> = ({ checkAu
                 animate="visible"
                 animate="visible"
                 exit="exit"
                 exit="exit"
                 layout
                 layout
+                className="w-full"
               >
               >
                 <Button onClick={handleClick} color="primary" variant="light" className="text-left bg-[#F7FCFF] w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary">
                 <Button onClick={handleClick} color="primary" variant="light" className="text-left bg-[#F7FCFF] w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary">
                   <div className="w-full text-nowrap text-ellipsis overflow-hidden">
                   <div className="w-full text-nowrap text-ellipsis overflow-hidden">

src/pages/Home/components/Slogan/Slogan.tsx

@@ -6,10 +6,10 @@ export const Slogan: React.FC = () => {
   return (
   return (
     <div className="flex flex-col items-center box-border">
     <div className="flex flex-col items-center box-border">
       <GradientsBall />
       <GradientsBall />
-      <TextLogo className="text-[12px]" />
+      <TextLogo className="w-[80px] sm:w-auto" />
       {/* <GradualSpacing text="晓得解惑，让沟通更智能" className="mt-[36px] text-[#333] text-[28px] font-medium" /> */}
       {/* <GradualSpacing text="晓得解惑，让沟通更智能" className="mt-[36px] text-[#333] text-[28px] font-medium" /> */}
-      <h2 className="mt-[36px] text-[#333] text-[28px] font-medium">晓得解惑，让沟通更智能</h2>
-      <h3 className="text-center text-[18px] text-[#5AA9D0] font-light mt-[16px]">知晓市场脉搏，引领行业潮流，晓得AI助手全方位为您保驾护航</h3>
+      <h2 className="mt-[20px] text-[18px] sm:mt-[36px] text-[#333] sm:text-[28px] font-medium">晓得解惑，让沟通更智能</h2>
+      <h3 className="mt-[8px] text-[14px] text-center sm:text-[18px] text-[#5AA9D0] font-light sm:mt-[16px]">知晓市场脉搏，引领行业潮流，晓得AI助手全方位为您保驾护航</h3>
     </div>
     </div>
   )
   )
 }
 }