Fonts and image changesalure

4 files changed, 24 insertions, 21 deletions

diff --git a/components/PSA.js b/components/PSA.js
index 8dad8b3..108924a 100644
--- a/components/PSA.js
+++ b/components/PSA.js
@@ -11,11 +11,16 @@ const PSA = () => {
             defaultStyle += ' ' + styleImportant
             break;
         case 1:
+            important = "Latest News:"
+            styleImportant = "bg-zinc-700"
+            defaultStyle += ' ' + styleImportant
+            break;
+        case 2:
             important = "WARNING!"
             styleImportant = "bg-yellow-700"
             defaultStyle += ' ' + styleImportant
             break;
-        case 2:
+        case 3:
             important = "EMERGENCY!"
             styleImportant = "bg-red-800"
             defaultStyle += ' ' + styleImportant
@@ -29,11 +34,11 @@ const PSA = () => {
             <div className="flex flex-row space-x-3">
                 <p>{psaMessage.announcement}</p>
                 <p className="text-blue-200 hover:text-blue-500 active:text-blue-700">
-                {psaMessage.link && (
-                    <Link href={psaMessage.link}>
-                        Learn more ↗
-                    </Link>
-                )}</p>
+                    {psaMessage.link && (
+                        <Link href={psaMessage.link}>
+                            Learn more ↗
+                        </Link>
+                    )}</p>
             </div>
         </div>
     )
diff --git a/components/travel-advisory/HistoryModal.js b/components/travel-advisory/HistoryModal.js
index 9ff835a..3ef2ea8 100644
--- a/components/travel-advisory/HistoryModal.js
+++ b/components/travel-advisory/HistoryModal.js
@@ -27,9 +27,7 @@ const HistoryModal = ({ isVisible, onClose, countries, dangerLevel, history }) =
                             </div>
                             <div>
                                 <h1 className="font-medium text-2xl pt-3">History</h1>
-                                <ul>
-                                    {historyList}
-                                </ul>
+                                <ul>{historyList}</ul>
                             </div>
                         </div>
                     </div>
diff --git a/components/travel-advisory/ListCountries.js b/components/travel-advisory/ListCountries.js
index 6cb0c17..9c880e1 100644
--- a/components/travel-advisory/ListCountries.js
+++ b/components/travel-advisory/ListCountries.js
@@ -40,7 +40,7 @@ export default function Countries(){
         const settlementsList = country.settlements.map((settlement) => {
             return (
                 <div key={settlement.name}>
-                    <h2 className="font-medium text-3xl">{settlement.name}</h2>
+                    <h2 className="font-medium md:text-3xl text-xl">{settlement.name}</h2>
                     <h2 className="text-base">{getDangerLevel(settlement.danger)}</h2>
                 </div>
             )
@@ -49,7 +49,7 @@ export default function Countries(){
         return (
             <div key="countries" className="bg-center bg-no-repeat bg-[image:var(--image-url)] bg-gray-500 bg-blend-multiply" style={{'--image-url': `url(${country.image})`}} >
                 <div className="sm:px-40 px-10 py-10 space-y-3">
-                    <h1 className="font-medium text-5xl">{country.name}</h1>
+                    <h1 className="font-light md:text-5xl text-3xl">{country.name}</h1>
                     <h2 className="text-lg">{dangerLevel}</h2>
                     <div className="space-y-3">{settlementsList}</div>
                     <button className="transition duration-200 ease-in-out px-4 py-2 font-medium rounded-full bg-blue-600 hover:bg-blue-700 active:bg-blue-800" onClick={()=> {
diff --git a/components/updates/PostPreview.js b/components/updates/PostPreview.js
index ca261c0..55c2510 100644
--- a/components/updates/PostPreview.js
+++ b/components/updates/PostPreview.js
@@ -2,14 +2,14 @@ import Link from "next/link";
 import DateFormatter from '@/components/updates/DateFormatter'
 
 export default function PostPreview(props) {
- return (
-     <div key="post" className="bg-zinc-800 py-3 px-5 border border-gray-600 rounded-lg space-y-3">
-         <Link href={`/updates/${props.slug}`}>
-             <h2 className="font-medium text-2xl hover:underline">{props.title}</h2>
-         </Link>
-         <span>By {props.author}</span>
-         <p>{props.description}</p>
-         <p className="font-medium text-sm">Posted on {DateFormatter(props.date)}</p>
-     </div>
- )
+    return (
+        <div key="post" className="bg-zinc-800 py-3 px-5 border border-gray-600 rounded-lg space-y-3">
+            <Link href={`/updates/${props.slug}`}>
+                <h2 className="font-medium text-2xl hover:underline">{props.title}</h2>
+            </Link>
+            <span className="text-sm">{props.author}</span>
+            <p>{props.description}</p>
+            <p className="font-medium text-sm">Posted on {DateFormatter(props.date)}</p>
+        </div>
+    )
 }