Merge pull request #137 from kaogeek/136-fix-word-wrapping-font-size-…

…and-block-size-in-info-pages-and-footer #136 fix word wrapping font size and block size in info pages and footer
kaogeek · Mar 18, 2024 · 118a0ca · 118a0ca
2 parents b4aba33 + c8cd5d8
commit 118a0ca
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 10 deletions.
diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx
@@ -3,15 +3,15 @@ export default function Footer() {
     <>
       <div className="text-center text-xl py-20 text-subheader">
         <span className="text-3xl text-header">ชอบเว็บของเราหรือไม่?</span><br />
-        แสดงความคิดเห็นของท่านผ่าน <br className="lg:hidden" />
+        แสดงความคิดเห็นของท่านผ่าน <br className="sm:hidden" />
         <a className="underline text-header" href="https://form.parliament.go.th/questionnaire/SurveyUser/SurveyUserTakeNoLogin.php?survey_id=370881" target="_blank" rel="noreferrer">
           แบบประเมินความพึงพอใจ
         </a>
         &nbsp;ได้เลยนะคะ
       </div>
       <div className="px-5 py-3 text-[#bbb] text-center text-sm">
-        เว็บไซต์นี้จัดทำเพื่ออำนวยความสะดวกในการสืบค้นข้อมูล <br className="lg:hidden" />โปรดตรวจสอบและอ้างอิงจากต้นฉบับเท่านั้น<br />
-        สำนักงานเลขาธิการสภาผู้แทนราษฎรสงวนสิทธิ์<br className="lg:hidden" />ในความรับผิดชอบต่อความถูกต้องของข้อมูลบนเว็บไซต์นี้<br /><br />
+        เว็บไซต์นี้จัดทำเพื่ออำนวยความสะดวกในการสืบค้นข้อมูล <br className="sm:hidden" />โปรดตรวจสอบและอ้างอิงจากต้นฉบับเท่านั้น<br />
+        สำนักงานเลขาธิการสภาผู้แทนราษฎรสงวนสิทธิ์<br className="sm:hidden" />ในความรับผิดชอบต่อความถูกต้องของข้อมูลบนเว็บไซต์นี้<br /><br />
         <span className="text-header">&copy; {(new Date()).getFullYear()} สำนักงานเลขาธิการสภาผู้แทนราษฎร</span>
       </div>
     </>

diff --git a/src/pages/About.jsx b/src/pages/About.jsx
@@ -14,10 +14,10 @@ export default function About() {
         <div className="w-11/12 md:w-5/6 lg:w-3/4 mx-auto min-h-screen">
 
           <h1 className="text-center lg:text-5xl md:text-4xl sm:text-3xl text-2xl font-bold text-subheader pt-40">
-            เกี่ยวกับโครงการอาสาสมัครหอสมุดรัฐสภา
+            เกี่ยวกับโครงการอาสาสมัคร<br className="lg:hidden" />หอสมุดรัฐสภา
           </h1>
           <h1 className="text-center lg:text-5xl md:text-4xl sm:text-3xl text-2xl font-bold text-header pt-10">
-            กิจกรรม “Hack เจตนารมณ์รัฐธรรมนูญ 2560” 
+            กิจกรรม “Hack เจตนารมณ์<br className="lg:hidden" />รัฐธรรมนูญ 2560” 
           </h1>
           <h1 className="text-center lg:text-3xl md:text-2xl sm:text-xl text-l font-bold text-subheader pt-10">
             และจัดทำเว็บไซต์เปรียบเทียบบทบัญญัติ<br className="lg:hidden" />และเจตนารมณ์การร่างรัฐธรรมนูญ
@@ -54,8 +54,8 @@ export default function About() {
               แต่ละมาตราตั้งแต่ครั้งแรกที่ประชุมจนออกมาเป็นร่างที่พร้อมจะประกาศเป็นกฎหมาย โดยใช้เวลาดำเนินการโครงการตั้งแต่วันที่ 25 กันยายน 2566 ถึงวันที่ 15 มีนาคม 2567 รวมทั้งสิ้น  173 วัน
             </p>
             <div className="text-center text-subheader mt-20 mb-10">
-              หอสมุดรัฐสภาขอยกย่องในความมีจิตสาธารณะ ความตั้งใจ และความเสียสละ<br />
-              ของอาสาสมัครหอสมุดรัฐสภา จำนวน 30 คน ดังรายนามต่อไปนี้
+              หอสมุดรัฐสภาขอยกย่อง<br className="sm:hidden" />ในความมีจิตสาธารณะ<br className="sm:hidden" />ความตั้งใจ และความเสียสละ<br />
+              ของอาสาสมัครหอสมุดรัฐสภา<br className="sm:hidden" />จำนวน 30 คน ดังรายนามต่อไปนี้
             </div>
             <ul>
               <li><ProfileImages name="นายกิตติ์ธเนศ ฤทธิพรพสิษฐ์" imageUrl="./volunteers/01.jpg" /></li>

diff --git a/src/pages/RelatedInfo.jsx b/src/pages/RelatedInfo.jsx
@@ -4,8 +4,8 @@ export default function RelatedInfo() {
   return (
     <div id="related" data-testid="related-doc">
       <div className="bg-[#310]">
-        <div className="w-11/12 md:w-5/6 lg:w-3/4 mx-auto min-h-screen">
-          <h1 className="text-center lg:text-5xl md:text-4xl sm:text-3xl text-2xl font-bold text-header pt-40">
+        <div className="md:w-5/6 mx-auto min-h-screen">
+          <h1 className="text-center lg:text-5xl sm:text-4xl text-3xl font-bold text-header pt-40">
             ข้อมูลที่เกี่ยวข้อง
           </h1>
           <div className="justify-center text-center text-lg px-8 py-20">

diff --git a/src/styles/Home.css b/src/styles/Home.css
@@ -46,7 +46,7 @@ body {
 #related .doc {
   display: inline-block;
   vertical-align: top;
-  width: 280px;
+  width: 275px;
   height: 145px;
   margin: 10px;
   padding: 15px;