ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: correctly center navbar els (#5676)

Browse Source
This commit is contained in:
Zach Pomerantz 2022-12-13 13:17:48 -05:00 committed by GitHub
parent 6efd7ca779
commit a650807c96
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/NavBar/index.tsx
View File

@ -101,7 +101,7 @@ const Navbar = () => {
return (
<>
<Nav>
<Box display="flex" height="full" flexWrap="nowrap" alignItems="center">
<Box display="flex" height="full" flexWrap="nowrap">
<Box className={styles.leftSideContainer}>
<Box className={styles.logoContainer}>
<UniIcon
@ -114,7 +114,7 @@ const Navbar = () => {
/>
</Box>
{!isNftPage && (
<Box display={{ sm: 'flex', lg: 'none' }} alignSelf="center">
<Box display={{ sm: 'flex', lg: 'none' }}>
<ChainSelector leftAlign={true} />
</Box>
)}
@ -122,7 +122,7 @@ const Navbar = () => {
<PageTabs />
</Row>
</Box>
<Box className={styles.middleContainer} alignItems="flex-start">
<Box className={styles.searchContainer}>
<SearchBar />
</Box>
<Box className={styles.rightSideContainer}>

7
src/components/NavBar/style.css.ts
View File

@ -7,7 +7,6 @@ export const logoContainer = style([
sprinkles({
display: 'flex',
marginRight: { sm: '12', xxl: '20' },
alignItems: 'center',
cursor: 'pointer',
}),
])
@ -31,16 +30,19 @@ export const baseSideContainer = style([
export const leftSideContainer = style([
baseSideContainer,
sprinkles({
alignItems: 'center',
justifyContent: 'flex-start',
}),
])
export const middleContainer = style([
export const searchContainer = style([
sprinkles({
flex: '1',
flexShrink: '1',
justifyContent: { lg: 'flex-end', xl: 'center' },
display: { sm: 'none', xl: 'flex' },
alignSelf: 'center',
height: '48',
alignItems: 'flex-start',
}),
])
@ -48,6 +50,7 @@ export const middleContainer = style([
export const rightSideContainer = style([
baseSideContainer,
sprinkles({
alignItems: 'center',
justifyContent: 'flex-end',
}),
])