Style new header

centrifuge · Sep 6, 2024 · 202239e · 202239e
1 parent 65ab1db
commit 202239e
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 6 deletions.
diff --git a/centrifuge-app/src/components/LayoutBase/styles.tsx b/centrifuge-app/src/components/LayoutBase/styles.tsx
@@ -123,6 +123,7 @@ export const WalletInner = styled(Stack)`
 
   @media (min-width: ${({ theme }) => theme.breakpoints[BREAK_POINT_COLUMNS]}) {
     justify-content: flex-end;
+    height: 60px;
   }
 `
 

diff --git a/centrifuge-app/src/pages/Pool/Header.tsx b/centrifuge-app/src/pages/Pool/Header.tsx
@@ -30,14 +30,11 @@ export function PoolDetailHeader({ actions }: Props) {
   return (
     <PageHeader
       title={<TextWithPlaceholder isLoading={isLoading}>{metadata?.pool?.name ?? 'Unnamed pool'}</TextWithPlaceholder>}
-      subtitle={
-        <TextWithPlaceholder isLoading={isLoading}>by {metadata?.pool?.issuer.name ?? 'Unknown'}</TextWithPlaceholder>
-      }
       parent={{ to: `/pools${state?.token ? '/tokens' : ''}`, label: state?.token ? 'Tokens' : 'Pools' }}
       icon={
         <Eththumbnail show={isTinlakePool}>
           {metadata?.pool?.icon ? (
-            <Box as="img" width="iconLarge" height="iconLarge" src={iconUri} />
+            <Box as="img" width="iconLarge" height="iconLarge" src={iconUri} borderRadius={4} />
           ) : (
             <Shelf
               width="iconLarge"

diff --git a/fabric/src/components/Tabs/index.tsx b/fabric/src/components/Tabs/index.tsx
@@ -49,8 +49,9 @@ const StyledTabsItem = styled.button<{ $active?: boolean }>(
       paddingLeft: 2,
       paddingRight: 2,
       paddingBottom: 2,
-      color: 'textPrimary',
+      color: $active ? 'textPrimary' : 'textSecondary',
       boxShadow: $active ? `inset 0 -2px 0 ${theme.colors.textGold}` : 'none',
+      fontWeight: 400,
 
       '&:hover, &:active, &:focus-visible': {
         color: 'textGold',
@@ -70,7 +71,7 @@ type TabsItemPrivateProps = TabsItemProps & {
 export function TabsItem({ children, active, onClick, ariaLabel, ...rest }: TabsItemPrivateProps) {
   return (
     <StyledTabsItem onClick={onClick} $active={active} role="tab" aria-label={ariaLabel} {...rest}>
-      <Text variant="interactive1" color="inherit">
+      <Text variant="interactive1" color="inherit" fontWeight={400}>
         {children}
       </Text>
     </StyledTabsItem>