diff --git a/dapp/src/components/ConnectWalletModal/ConnectWalletButton.tsx b/dapp/src/components/ConnectWalletModal/ConnectWalletButton.tsx
index cd0a3b0f4..557271185 100644
--- a/dapp/src/components/ConnectWalletModal/ConnectWalletButton.tsx
+++ b/dapp/src/components/ConnectWalletModal/ConnectWalletButton.tsx
@@ -197,7 +197,7 @@ export default function ConnectWalletButton({
alignSelf="stretch"
borderWidth={1}
borderColor="gold.300"
- rounded="lg"
+ rounded="sm"
mb={3}
_last={{ mb: 0 }}
p={0}
@@ -215,7 +215,7 @@ export default function ConnectWalletButton({
src={connector.icon}
boxSize={6}
bg="black"
- rounded="sm"
+ rounded="xs"
{...iconStyles[connector.id]}
/>
}
diff --git a/dapp/src/components/MezoBeehiveModal.tsx b/dapp/src/components/MezoBeehiveModal.tsx
index f7c0c9f1f..9cb167eff 100644
--- a/dapp/src/components/MezoBeehiveModal.tsx
+++ b/dapp/src/components/MezoBeehiveModal.tsx
@@ -107,7 +107,7 @@ function MezoBeehiveModalBase() {
>
diff --git a/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/AcrePointsRewardEstimation.tsx b/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/AcrePointsRewardEstimation.tsx
index 5eab4cb9d..b78a467a9 100644
--- a/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/AcrePointsRewardEstimation.tsx
+++ b/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/AcrePointsRewardEstimation.tsx
@@ -79,7 +79,7 @@ function AcrePointsRewardEstimation(props: StackProps) {
h="auto"
px={3}
py={1}
- rounded="2xl"
+ rounded="sm"
bg="gold.300"
_hover={{ bg: "gold.200" }}
>
@@ -99,7 +99,7 @@ function AcrePointsRewardEstimation(props: StackProps) {
diff --git a/dapp/src/components/WelcomeModal.tsx b/dapp/src/components/WelcomeModal.tsx
index 90ea1a161..e04a6f7d9 100644
--- a/dapp/src/components/WelcomeModal.tsx
+++ b/dapp/src/components/WelcomeModal.tsx
@@ -172,7 +172,7 @@ function WelcomeModalBase({ closeModal }: BaseModalProps) {
muted
loop
objectFit="cover"
- roundedRight="xl"
+ roundedRight="md"
outline="1px solid #f6ead5"
outlineOffset="-1px"
/>
diff --git a/dapp/src/components/shared/LiveTag.tsx b/dapp/src/components/shared/LiveTag.tsx
index c81e62501..72ff17ac0 100644
--- a/dapp/src/components/shared/LiveTag.tsx
+++ b/dapp/src/components/shared/LiveTag.tsx
@@ -9,7 +9,7 @@ export default function LiveTag(props: TagProps) {
+
{children}
)
diff --git a/dapp/src/pages/DashboardPage/BeehiveCard.tsx b/dapp/src/pages/DashboardPage/BeehiveCard.tsx
index 00cfecd78..9147d9789 100644
--- a/dapp/src/pages/DashboardPage/BeehiveCard.tsx
+++ b/dapp/src/pages/DashboardPage/BeehiveCard.tsx
@@ -41,7 +41,7 @@ export default function BeehiveCard(props: CardProps) {
-
+
Total collected mats from Mezo
diff --git a/dapp/src/pages/DashboardPage/TransactionHistory/TransactionTable.tsx b/dapp/src/pages/DashboardPage/TransactionHistory/TransactionTable.tsx
index 7092e4f3e..f2cf58ae2 100644
--- a/dapp/src/pages/DashboardPage/TransactionHistory/TransactionTable.tsx
+++ b/dapp/src/pages/DashboardPage/TransactionHistory/TransactionTable.tsx
@@ -27,7 +27,13 @@ export default function TransactionTable() {
{(pageData: Activity[]) =>
pageData.map((activity) => (
-
+
diff --git a/dapp/src/theme/alertTheme.ts b/dapp/src/theme/alertTheme.ts
index ad63da841..afd239834 100644
--- a/dapp/src/theme/alertTheme.ts
+++ b/dapp/src/theme/alertTheme.ts
@@ -13,7 +13,7 @@ const baseStyle = multiStyleConfig.definePartsStyle({
borderStyle: "solid",
borderColor: $borderColor.reference,
p: 4,
- rounded: "xl",
+ rounded: "sm",
},
title: {
fontWeight: "semibold",
diff --git a/dapp/src/theme/buttonTheme.ts b/dapp/src/theme/buttonTheme.ts
index 6bd5c08ec..b54223d90 100644
--- a/dapp/src/theme/buttonTheme.ts
+++ b/dapp/src/theme/buttonTheme.ts
@@ -29,12 +29,12 @@ const buttonTheme: ComponentSingleStyleConfig = {
md: {
fontSize: "sm",
py: 2,
- borderRadius: "md",
+ borderRadius: "sm",
},
lg: {
fontSize: "md",
py: 4,
- borderRadius: "lg",
+ borderRadius: "sm",
h: 14,
},
},
diff --git a/dapp/src/theme/cardTheme.ts b/dapp/src/theme/cardTheme.ts
index f4d0c78e5..b70116d11 100644
--- a/dapp/src/theme/cardTheme.ts
+++ b/dapp/src/theme/cardTheme.ts
@@ -6,7 +6,7 @@ const multiStyleConfig = createMultiStyleConfigHelpers(parts.keys)
const baseStyleContainer = defineStyle({
boxShadow: "none",
bg: "gold.200",
- borderRadius: "xl",
+ borderRadius: "md",
p: 5,
})
diff --git a/dapp/src/theme/index.ts b/dapp/src/theme/index.ts
index 7621d64a5..6aeb6d06c 100644
--- a/dapp/src/theme/index.ts
+++ b/dapp/src/theme/index.ts
@@ -1,5 +1,12 @@
import { extendTheme } from "@chakra-ui/react"
-import { colors, typography, semanticTokens, styles, zIndices } from "./utils"
+import {
+ colors,
+ typography,
+ semanticTokens,
+ styles,
+ zIndices,
+ borderRadius,
+} from "./utils"
import acreTVLProgressTheme from "./acreTVLProgressTheme"
import alertTheme from "./alertTheme"
import buttonTheme from "./buttonTheme"
@@ -30,6 +37,7 @@ const defaultTheme = {
useSystemColorMode: false,
colors,
...typography,
+ ...borderRadius,
zIndices,
semanticTokens,
styles,
diff --git a/dapp/src/theme/modalTheme.ts b/dapp/src/theme/modalTheme.ts
index 2a1ecb89a..9c4ebec0e 100644
--- a/dapp/src/theme/modalTheme.ts
+++ b/dapp/src/theme/modalTheme.ts
@@ -12,7 +12,7 @@ const baseStyleDialog = defineStyle({
},
marginBottom: 8,
boxShadow: "none",
- borderRadius: "xl",
+ borderRadius: "md",
p: { base: 5, sm: 0 },
bg: "gold.100",
border: "none",
diff --git a/dapp/src/theme/skeletonTheme.ts b/dapp/src/theme/skeletonTheme.ts
index 1f771222c..b29689dda 100644
--- a/dapp/src/theme/skeletonTheme.ts
+++ b/dapp/src/theme/skeletonTheme.ts
@@ -4,7 +4,7 @@ const $startColor = cssVar("skeleton-start-color")
const $endColor = cssVar("skeleton-end-color")
const baseStyle = defineStyle({
- borderRadius: "lg",
+ borderRadius: "sm",
_light: {
[$startColor.variable]: "colors.gold.300",
diff --git a/dapp/src/theme/tooltipTheme.ts b/dapp/src/theme/tooltipTheme.ts
index 19875d089..859bdf593 100644
--- a/dapp/src/theme/tooltipTheme.ts
+++ b/dapp/src/theme/tooltipTheme.ts
@@ -26,14 +26,14 @@ const sizeXs = defineStyle({
py: 1,
fontSize: "xs",
lineHeight: "xs",
- borderRadius: "base",
+ borderRadius: "xs",
})
const sizeSm = defineStyle({
p: 3,
fontSize: "sm",
lineHeight: "sm",
- borderRadius: "lg",
+ borderRadius: "sm",
})
const sizes = {
diff --git a/dapp/src/theme/utils/borderRadius.ts b/dapp/src/theme/utils/borderRadius.ts
new file mode 100644
index 000000000..ffedd6b73
--- /dev/null
+++ b/dapp/src/theme/utils/borderRadius.ts
@@ -0,0 +1,9 @@
+export default {
+ radii: {
+ xs: "0.25rem", // 4px
+ sm: "0.5rem", // 8px
+ md: "0.75rem", // 12px
+ lg: "1rem", // 16px
+ xl: "1.25rem", // 20px
+ },
+}
diff --git a/dapp/src/theme/utils/index.ts b/dapp/src/theme/utils/index.ts
index d29f605b1..7246688a4 100644
--- a/dapp/src/theme/utils/index.ts
+++ b/dapp/src/theme/utils/index.ts
@@ -2,4 +2,5 @@ export { default as colors } from "./colors"
export { default as typography } from "./typography"
export { default as zIndices } from "./zIndices"
export { default as semanticTokens } from "./semanticTokens"
+export { default as borderRadius } from "./borderRadius"
export { default as styles } from "./styles"