fix panel and metrics card css

src/app/(main)/links/[linkId]/LinkPanels.tsx

@@ -20,7 +20,7 @@ export function LinkPanels({ linkId }: { linkId: string }) {
     <Grid gap="3">
       <GridRow layout="two" {...rowProps}>
         <Panel>
-          <Heading size="base">{formatMessage(labels.sources)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.sources)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="referrer">{formatMessage(labels.referrers)}</Tab>
@@ -35,7 +35,7 @@ export function LinkPanels({ linkId }: { linkId: string }) {
           </Tabs>
         </Panel>
         <Panel>
-          <Heading size="base">{formatMessage(labels.environment)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.environment)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="browser">{formatMessage(labels.browsers)}</Tab>
@@ -59,7 +59,7 @@ export function LinkPanels({ linkId }: { linkId: string }) {
           <WorldMap websiteId={linkId} />
         </Panel>
         <Panel>
-          <Heading size="base">{formatMessage(labels.location)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.location)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="country">{formatMessage(labels.countries)}</Tab>

src/app/(main)/pixels/[pixelId]/PixelPanels.tsx

@@ -20,7 +20,7 @@ export function PixelPanels({ pixelId }: { pixelId: string }) {
     <Grid gap="3">
       <GridRow layout="two" {...rowProps}>
         <Panel>
-          <Heading size="base">{formatMessage(labels.sources)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.sources)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="referrer">{formatMessage(labels.referrers)}</Tab>
@@ -35,7 +35,7 @@ export function PixelPanels({ pixelId }: { pixelId: string }) {
           </Tabs>
         </Panel>
         <Panel>
-          <Heading size="base">{formatMessage(labels.environment)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.environment)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="browser">{formatMessage(labels.browsers)}</Tab>
@@ -59,7 +59,7 @@ export function PixelPanels({ pixelId }: { pixelId: string }) {
           <WorldMap websiteId={pixelId} />
         </Panel>
         <Panel>
-          <Heading size="base">{formatMessage(labels.location)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.location)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="country">{formatMessage(labels.countries)}</Tab>

src/app/(main)/websites/[websiteId]/WebsitePanels.tsx

@@ -22,7 +22,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
     <Grid gap="3">
       <GridRow layout="two" {...rowProps}>
         <Panel>
-          <Heading size="base">{formatMessage(labels.pages)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.pages)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="path">{formatMessage(labels.path)}</Tab>
@@ -41,7 +41,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
           </Tabs>
         </Panel>
         <Panel>
-          <Heading size="base">{formatMessage(labels.sources)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.sources)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="referrer">{formatMessage(labels.referrers)}</Tab>
@@ -63,7 +63,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
 
       <GridRow layout="two" {...rowProps}>
         <Panel>
-          <Heading size="base">{formatMessage(labels.environment)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.environment)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="browser">{formatMessage(labels.browsers)}</Tab>
@@ -83,7 +83,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
         </Panel>
 
         <Panel>
-          <Heading size="base">{formatMessage(labels.location)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.location)}</Heading>
           <Tabs>
             <TabList>
               <Tab id="country">{formatMessage(labels.countries)}</Tab>
@@ -109,7 +109,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
         </Panel>
 
         <Panel>
-          <Heading size="base">{formatMessage(labels.traffic)}</Heading>
+          <Heading size="2xl">{formatMessage(labels.traffic)}</Heading>
           <Row border="bottom" marginBottom="4" />
           <WeeklyTraffic websiteId={websiteId} />
         </Panel>

src/components/metrics/MetricsTable.tsx

@@ -78,10 +78,10 @@ export function MetricsTable({
       error={error}
       minHeight="400px"
     >
-      <Grid>
+      <Grid padding="2">
         {data && <ListTable {...props} data={filteredData} renderLabel={renderLabel} />}
         {showMore && limit && (
-          <Row justifyContent="center" alignItems="flex-end">
+          <Row justifyContent="center" alignItems="flex-end" paddingTop="4">
             <LinkButton href={updateParams({ view: type })} variant="quiet">
               <IconLabel icon={<Maximize />}>{formatMessage(labels.more)}</IconLabel>
             </LinkButton>