Make header region sticky on search results page

This commit is contained in:
diondiondion 2026-05-08 16:40:30 +02:00
parent 8d6406f561
commit 27c96ca308

View File

@ -222,52 +222,62 @@ export const SearchResults: React.FC<{ multiColumn: boolean }> = ({
title={intl.formatMessage(messages.title, { q })}
onClick={handleHeaderClick}
multiColumn={multiColumn}
appendContent={
<>
<div className='explore__search-header'>
<Search
singleColumn
initialValue={trimmedValue}
key={trimmedValue}
/>
</div>
<div className='account__section-headline'>
<button
onClick={handleSelectAll}
className={mappedType === 'all' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.all'
defaultMessage='All'
/>
</button>
<button
onClick={handleSelectAccounts}
className={mappedType === 'accounts' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.accounts'
defaultMessage='Profiles'
/>
</button>
<button
onClick={handleSelectHashtags}
className={mappedType === 'hashtags' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.hashtags'
defaultMessage='Hashtags'
/>
</button>
<button
onClick={handleSelectStatuses}
className={mappedType === 'statuses' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.statuses'
defaultMessage='Posts'
/>
</button>
</div>
</>
}
/>
<div className='explore__search-header'>
<Search singleColumn initialValue={trimmedValue} key={trimmedValue} />
</div>
<div className='account__section-headline'>
<button
onClick={handleSelectAll}
className={mappedType === 'all' ? 'active' : undefined}
type='button'
>
<FormattedMessage id='search_results.all' defaultMessage='All' />
</button>
<button
onClick={handleSelectAccounts}
className={mappedType === 'accounts' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.accounts'
defaultMessage='Profiles'
/>
</button>
<button
onClick={handleSelectHashtags}
className={mappedType === 'hashtags' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.hashtags'
defaultMessage='Hashtags'
/>
</button>
<button
onClick={handleSelectStatuses}
className={mappedType === 'statuses' ? 'active' : undefined}
type='button'
>
<FormattedMessage
id='search_results.statuses'
defaultMessage='Posts'
/>
</button>
</div>
<div className='explore__search-results' data-nosnippet>
<ScrollableList
scrollKey='search-results'