Skip to content

Commit

Permalink
Cleaner nearby view styling on mobile
Browse files Browse the repository at this point in the history
  • Loading branch information
amy-corson-ibigroup committed Dec 13, 2024
1 parent 142db3f commit 8271f4e
Show file tree
Hide file tree
Showing 3 changed files with 11 additions and 4 deletions.
2 changes: 1 addition & 1 deletion lib/components/mobile/navigation-bar.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ class MobileNavigationBar extends Component {
const backButtonText = intl.formatMessage({ id: 'common.forms.back' })

return (
<header>
<header style={{ height: '50px' }}>
<Navbar className="mobile-navbar-container" fixedTop fluid>
<Navbar.Header>
<Navbar.Brand>
Expand Down
9 changes: 6 additions & 3 deletions lib/components/viewers/nearby/nearby-view.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import {
Scrollable
} from './styled'
import FromToPicker from './from-to-picker'
import InvisibleA11yLabel from '../../util/invisible-a11y-label'
import RentalStation from './rental-station'
import Stop from './stop'
import Vehicle from './vehicle-rent'
Expand Down Expand Up @@ -246,6 +247,8 @@ function NearbyView({
</li>
))

console.log(nearbyItemList)

useEffect(() => {
if (!staleData) {
setLoading(false)
Expand Down Expand Up @@ -273,16 +276,16 @@ function NearbyView({
/>
)}
{nearby && (
<h3 style={{ opacity: 0, position: 'absolute' }}>
<InvisibleA11yLabel as="h3" style={{ position: 'absolute' }}>
<FormattedMessage
id="components.NearbyView.nearbyListIntro"
values={{ count: nearby.length }}
/>
</h3>
</InvisibleA11yLabel>
)}
<NearbySidebarContainer
className="base-color-bg"
style={{ marginTop: mobile ? '50px' : 0 }}
style={{ marginBottom: 0 }}
>
{/* This is used to scroll to top */}
<div aria-hidden ref={firstItemRef} />
Expand Down
4 changes: 4 additions & 0 deletions lib/components/viewers/nearby/styled.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,10 @@ export const NearbySidebarContainer = styled.ol`
gap: 1em;
padding: 0 1em;
list-style: none;
@media (max-width: 768px) {
min-height: calc(100vh - 50px);
}
`

export const Card = styled.div`
Expand Down

0 comments on commit 8271f4e

Please sign in to comment.