From f87cfad7c5d57ef2fd9f5e893d510e572b8a8046 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Berardo=20Mate=CC=80?= <berardo@commercelayer.io>
Date: Mon, 2 Feb 2026 10:54:58 +0100
Subject: [PATCH] fix: resources font size/weight

---
 packages/app-elements/src/ui/atoms/CopyToClipboard.tsx |  4 ++--
 .../app-elements/src/ui/composite/ListDetailsItem.tsx  |  2 +-
 packages/app-elements/src/ui/composite/Report.tsx      |  4 ++--
 .../ui/resources/ResourceDetails/ResourceDetails.tsx   | 10 ++++++----
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/app-elements/src/ui/atoms/CopyToClipboard.tsx b/packages/app-elements/src/ui/atoms/CopyToClipboard.tsx
index b3fd1f223..df79cfc54 100644
--- a/packages/app-elements/src/ui/atoms/CopyToClipboard.tsx
+++ b/packages/app-elements/src/ui/atoms/CopyToClipboard.tsx
@@ -85,11 +85,11 @@ export const CopyToClipboard: React.FC<CopyToClipboardProps> = ({
       {showValue && (
         <div className="overflow-x-auto py-2">
           {isJsonString(value) ? (
-            <div className="whitespace-pre max-h-[200px] font-mono font-medium">
+            <div className="whitespace-pre max-h-[200px] font-mono font-medium text-sm">
               {JSON.stringify(JSON.parse(value), null, 2)}
             </div>
           ) : (
-            value
+            <div className="font-medium text-sm">{value}</div>
           )}
         </div>
       )}
diff --git a/packages/app-elements/src/ui/composite/ListDetailsItem.tsx b/packages/app-elements/src/ui/composite/ListDetailsItem.tsx
index c3ec02752..0b2271fbe 100644
--- a/packages/app-elements/src/ui/composite/ListDetailsItem.tsx
+++ b/packages/app-elements/src/ui/composite/ListDetailsItem.tsx
@@ -66,7 +66,7 @@ export function ListDetailsItem({
       <div
         data-testid={`list-details-item-${label}-value`}
         // keep `min-w-0` to avoid grid overflow when grid-item content is too long
-        className={classNames("font-medium min-w-0", {
+        className={classNames("font-medium min-w-0 text-sm", {
           "py-2": !childrenHaveInternalPadding,
           "md:text-right": childrenAlign === "right",
           truncate: typeof children === "string",
diff --git a/packages/app-elements/src/ui/composite/Report.tsx b/packages/app-elements/src/ui/composite/Report.tsx
index 16e881a52..73dd1f35a 100644
--- a/packages/app-elements/src/ui/composite/Report.tsx
+++ b/packages/app-elements/src/ui/composite/Report.tsx
@@ -36,7 +36,7 @@ function renderItem(item: ReportItem, key: Key): JSX.Element {
           target="_blank"
           rel="noopener noreferrer"
           href={item.linkUrl}
-          className="text-sm font-bold text-primary hover:underline"
+          className="text-sm font-semibold text-primary"
           data-testid={`report-item-${item.label}-link`}
         >
           {item.linkLabel ?? t("common.download_file")}
@@ -44,7 +44,7 @@ function renderItem(item: ReportItem, key: Key): JSX.Element {
       ) : item.downloadJsonAsFile != null ? (
         <button
           type="button"
-          className="text-sm font-bold text-primary hover:underline"
+          className="text-sm font-semibold text-gray-600 border px-2 rounded bg-gray-50"
           onClick={() => {
             downloadJsonAsFile({
               json: item.downloadJsonAsFile,
diff --git a/packages/app-elements/src/ui/resources/ResourceDetails/ResourceDetails.tsx b/packages/app-elements/src/ui/resources/ResourceDetails/ResourceDetails.tsx
index 60b907643..271dbf972 100644
--- a/packages/app-elements/src/ui/resources/ResourceDetails/ResourceDetails.tsx
+++ b/packages/app-elements/src/ui/resources/ResourceDetails/ResourceDetails.tsx
@@ -39,7 +39,9 @@ export const ResourceDetails = withSkeletonTemplate<ResourceDetailsProps>(
           </ListDetailsItem>
           <ListDetailsItem label="Reference" gutter="none">
             <FlexRow alignItems="center">
-              <Text weight="semibold">{reference}</Text>
+              <Text weight="semibold" size="small">
+                {reference}
+              </Text>
               {canUser("update", resource.type as ListableResourceType) && (
                 <button
                   type="button"
@@ -53,18 +55,18 @@ export const ResourceDetails = withSkeletonTemplate<ResourceDetailsProps>(
             </FlexRow>
           </ListDetailsItem>
           <ListDetailsItem label="Updated" gutter="none">
-            <Text weight="semibold">
+            <Text weight="semibold" size="small">
               {formatDate({
                 isoDate: resource?.updated_at,
                 timezone: user?.timezone,
                 format: "fullWithSeconds",
                 showCurrentYear: true,
                 locale,
-              })}
+              })}{" "}
             </Text>
           </ListDetailsItem>
           <ListDetailsItem label="Created" gutter="none">
-            <Text weight="semibold">
+            <Text weight="semibold" size="small">
               {formatDate({
                 isoDate: resource?.created_at,
                 timezone: user?.timezone,