diff --git a/package.json b/package.json
index 09780a14..28eb76c9 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,7 @@
     "@polkadot/ui-keyring": "3.6.6",
     "@polkadot/util": "12.6.2",
     "@polkadot/util-crypto": "^12.6.2",
-    "@region-x/components": "^0.1.14",
+    "@region-x/components": "^0.1.15",
     "@types/humanize-duration": "^3.27.3",
     "@vercel/analytics": "^1.2.2",
     "apexcharts": "^3.49.1",
diff --git a/src/components/Regions/RegionMetaCard/index.tsx b/src/components/Regions/RegionMetaCard/index.tsx
index 97417d67..bee52ab0 100644
--- a/src/components/Regions/RegionMetaCard/index.tsx
+++ b/src/components/Regions/RegionMetaCard/index.tsx
@@ -72,7 +72,7 @@ export const RegionMetaCard = ({ active, regionMetadata }: RegionMetaCardProps)
           regionStart: getRelativeTimeString(beginTimestamp),
           regionEnd: getRelativeTimeString(endTimestamp),
           coreIndex: region.getCore(),
-          consumed: regionMetadata.consumed,
+          consumed: Number(parseFloat((regionMetadata.consumed * 100).toString()).toFixed(2)),
           chainLabel: locationToLabel(location),
           chainColor: location === RegionLocation.CORETIME_CHAIN ? 'purpleDark' : 'blueDark',
           coreOcupaccy: regionMetadata.coreOccupancy * 100,
diff --git a/src/pages/regions.tsx b/src/pages/regions.tsx
index a2f8a686..8937a4c6 100644
--- a/src/pages/regions.tsx
+++ b/src/pages/regions.tsx
@@ -147,13 +147,14 @@ const Dashboard = () => {
       >
         <Box
           sx={{
-            width: '100%',
             display: 'flex',
             justifyContent: 'flex-start',
             gap: '2rem',
             '::-webkit-scrollbar': {
               display: 'none',
             },
+            maxWidth: '70vw',
+            flexWrap: 'wrap',
           }}
         >
           {status !== ContextStatus.LOADED && (