refactor(client): Adjust font sizes and line heights

Vizzuality · Nov 8, 2024 · 70e19d0 · 70e19d0
1 parent c3ad518
commit 70e19d0
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 4 deletions.
diff --git a/client/src/components/intro/index.tsx b/client/src/components/intro/index.tsx
@@ -9,7 +9,7 @@ const Intro = ({ showDescription = true }: IntroProps) => {
         South Sudan
       </h1>
       {showDescription && (
-        <p className="mx-auto mt-0.5 max-w-[280px] text-xs xl:mt-4 xl:max-w-none xl:text-sm">
+        <p className="mx-auto mt-0.5 max-w-[280px] text-xs leading-6 xl:mt-4 xl:max-w-none xl:text-sm xl:leading-[26px]">
           Explore South Sudan’s geospatial visualization tool, a centralized platform for accessing
           and analyzing hydrological data. Discover insights on flood, drought, and
           hydrometeorological patterns to support effective water resource management.

diff --git a/client/src/components/panels/contextual-layers/index.tsx b/client/src/components/panels/contextual-layers/index.tsx
@@ -34,7 +34,7 @@ const ContextualLayersPanel = () => {
         </SheetClose>
       </SheetHeader>
 
-      <p className="mt-11">
+      <p className="mt-11 leading-[26px]">
         Toggle on and off contextual layers to add demographic, land use, and soil property data to
         your map view. These layers provide additional insights, helping to understand population
         dynamics, land cover, and soil characteristics, which are essential for comprehensive water

diff --git a/client/src/components/panels/drought/index.tsx b/client/src/components/panels/drought/index.tsx
@@ -14,7 +14,7 @@ const DroughtPanel = () => {
 
   return (
     <div className="min-h-screen px-5 py-5 lg:min-h-0 lg:px-10">
-      <p className="mb-6">
+      <p className="mb-6 text-sm leading-[26px]">
         Explore agricultural and meteorological drought data to assess exposure and hazard levels
         across South Sudan. Analyze drought indicators, such as SPI, SPEI, SNDVI, and SMA indices,
         to understand drought severity and support resilient water and land management.

diff --git a/client/src/components/panels/flood/index.tsx b/client/src/components/panels/flood/index.tsx
@@ -14,7 +14,7 @@ const FloodPanel = () => {
 
   return (
     <div className="min-h-screen px-5 py-5 lg:min-h-0 lg:px-10">
-      <p className="mb-6">
+      <p className="mb-6 text-sm leading-[26px]">
         Access detailed flood data to assess both exposure and hazard levels across South Sudan.
         Analyze model-based and EO-based flood information, including flood extent, depth, and
         return periods, to better understand flood risks and support proactive planning.