Skip to content

Commit

Permalink
feat(navbar): theme-specific font sizes
Browse files Browse the repository at this point in the history
  • Loading branch information
nolimits4web committed Sep 6, 2021
1 parent 8d98111 commit 659d4cf
Show file tree
Hide file tree
Showing 3 changed files with 22 additions and 3 deletions.
2 changes: 2 additions & 0 deletions src/config/extend-theme.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,8 @@ const extendTheme = () => {
'2xs': '0.625rem',
'icon-ios': '28px',
'icon-material': '24px',
'navbar-ios': '17px',
'navbar-material': '17px',
};

// SCALE
Expand Down
9 changes: 6 additions & 3 deletions src/react/components/Navbar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@ const Navbar = forwardRef((props, ref) => {
translucent = true,
hairlines = true,

fontSizeIos = 'text-navbar-ios',
fontSizeMaterial = 'text-navbar-material',

left,
title,
subtitle,
Expand Down Expand Up @@ -64,8 +67,8 @@ const Navbar = forwardRef((props, ref) => {
`w-full z-20 top-0 pt-safe`,
positionClass('sticky', className)
),
ios: '',
material: '',
ios: fontSizeIos,
material: fontSizeMaterial,
},
bg: {
common: cls('absolute w-full h-full left-0 top-0', bgClassName),
Expand All @@ -90,7 +93,7 @@ const Navbar = forwardRef((props, ref) => {
'pl-2-safe pr-2-safe h-11',
!left && right ? 'justify-end' : 'justify-between'
),
material: 'justify-start h-14 lg:h-16 text-xl',
material: 'justify-start h-14 lg:h-16',
},
left: {
common: cls('flex justify-center items-center h-full', leftClassName),
Expand Down
14 changes: 14 additions & 0 deletions src/types/Navbar.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,20 @@ interface Props {
title?: string;
};

/**
* Tailwind CSS class for font size in iOS theme
*
* @default 'text-navbar-ios'
*/
fontSizeIos?: string;

/**
* Tailwind CSS class for font size in Material theme
*
* @default 'text-navbar-material'
*/
fontSizeMaterial?: string;

/**
* Additional class to add on Navbar's "background" element
*/
Expand Down

0 comments on commit 659d4cf

Please sign in to comment.