fix: tweak gap in filters, and add changeset

LedgerHQ · Oct 11, 2024 · bde70f9 · bde70f9
1 parent 1583787
commit bde70f9
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 3 deletions.
diff --git a/.changeset/beige-planes-shake.md b/.changeset/beige-planes-shake.md
@@ -0,0 +1,7 @@
+---
+"live-mobile": patch
+"@ledgerhq/native-ui": patch
+---
+
+On Earn's Staking Modal, it makes it so that a category filter will only show up if there's at least one provider of that category.
+Small visual fix to the gap in the options' spacing
diff --git a/apps/ledger-live-mobile/src/families/evm/StakingDrawer/index.tsx b/apps/ledger-live-mobile/src/families/evm/StakingDrawer/index.tsx
@@ -94,7 +94,7 @@ function Content({ accountId, has32Eth, providers }: Props) {
  activeBg={colors.primary.c80}
  activeColor={colors.neutral.c00}
  inactiveColor={colors.neutral.c100}
- gap={4}
+ gap={8}
  inactiveBg={colors.neutral.c40}
  activeIndex={selectedIndex}
  onChange={index => {

diff --git a/libs/ui/packages/native/src/components/Tabs/Chip/index.tsx b/libs/ui/packages/native/src/components/Tabs/Chip/index.tsx
@@ -9,7 +9,7 @@ const TabBox = styled(TouchableOpacity)<
 >`
  text-align: center;
  flex-grow: ${(p) => (p.stretchItems ? "1" : "0")};
- margin: auto;
+ ${(p) => (p.stretchItems ? "margin: auto;" : "margin: auto 0;")}
  padding: ${(p) => p.theme.space[p.size === "small" ? 3 : 5]}px;
  border-radius: 8px;
  background-color: ${(p) =>

diff --git a/libs/ui/packages/native/src/components/Tabs/TemplateTabs/index.tsx b/libs/ui/packages/native/src/components/Tabs/TemplateTabs/index.tsx
@@ -35,7 +35,8 @@ export const TabsContainer = styled(FlexBox)<{ stretchItems: boolean }>`
  size: undefined;
  flex-direction: row;
  width: 100%;
- align-items: ${(p) => (p.stretchItems ? "stretch" : "center")};
+ align-items: stretch;
+ ${(p) => (p.stretchItems ? "" : "justify-content: center;")}
 `;
 
 const TemplateTabsGroup = ({