prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Remove duplicated code, add invisible border at bottom of reader header so its the same size as the library header

Browse source
This commit is contained in:
Jackson Harper 2023-03-02 13:24:18 +08:00
parent 81b202d3ca
commit 33bebc8cca
2 changed files with 4 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
packages/web/components/templates/homeFeed/LibraryHeader.tsx
View file

@ -13,6 +13,7 @@ import { GridSelectorIcon } from '../../elements/images/GridSelectorIcon'
import { LayoutType } from './HomeFeedContainer'
import { PrimaryDropdown } from '../PrimaryDropdown'
import { LIBRARY_LEFT_MENU_WIDTH } from './LibraryFilterMenu'
import { LogoBox } from '../../elements/LogoBox'
type LibraryHeaderProps = {
layout: LayoutType
@ -209,38 +210,6 @@ function SearchBox(props: SearchBoxProps): JSX.Element {
)
}
// Displays the full logo on larger screens, small logo on mobile
function LogoBox(): JSX.Element {
return (
<>
<SpanBox
css={{
pl: '25px',
height: '24px',
width: LIBRARY_LEFT_MENU_WIDTH,
minWidth: LIBRARY_LEFT_MENU_WIDTH,
'@mdDown': {
display: 'none',
},
}}
>
<OmnivoreFullLogo showTitle={true} />
</SpanBox>
<SpanBox
css={{
ml: '20px',
mr: '20px',
'@md': {
display: 'none',
},
}}
>
<OmnivoreNameLogo />
</SpanBox>
</>
)
}
type ControlButtonBoxProps = {
layout: LayoutType
updateLayout: (layout: LayoutType) => void

36
packages/web/components/templates/reader/ReaderHeader.tsx
View file

@ -5,7 +5,8 @@ import { OmnivoreNameLogo } from '../../elements/images/OmnivoreNameLogo'
import { OmnivoreFullLogo } from '../../elements/images/OmnivoreFullLogo'
import { PrimaryDropdown } from '../PrimaryDropdown'
import { TooltipWrapped } from '../../elements/Tooltip'
import { ReaderSettings } from '../../../lib/hooks/useReaderSettings'
import { LIBRARY_LEFT_MENU_WIDTH } from '../homeFeed/LibraryFilterMenu'
import { LogoBox } from '../../elements/LogoBox'
const HEADER_HEIGHT = '105px'
const MOBILE_HEIGHT = '48px'
@ -29,6 +30,7 @@ export function ReaderHeader(props: ReaderHeaderProps): JSX.Element {
height: HEADER_HEIGHT,
bg: 'transparent',
pt: '35px',
borderBottom: '1px solid transparent',
'@mdDown': {
height: MOBILE_HEIGHT,
pt: '0px',
@ -51,38 +53,6 @@ export function ReaderHeader(props: ReaderHeaderProps): JSX.Element {
)
}
// Displays the full logo on larger screens, small logo on mobile
function LogoBox(): JSX.Element {
return (
<>
<SpanBox
css={{
ml: '25px',
height: '24px',
width: '232px',
minWidth: '232px',
'@mdDown': {
display: 'none',
},
}}
>
<OmnivoreFullLogo showTitle={true} />
</SpanBox>
<SpanBox
css={{
ml: '20px',
mr: '20px',
'@md': {
display: 'none',
},
}}
>
<OmnivoreNameLogo />
</SpanBox>
</>
)
}
function ControlButtonBox(props: ReaderHeaderProps): JSX.Element {
return (
<>