Skip to content

Instant Search : Update mobile structure #14423

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
bluefuton merged 20 commits into from
Jan 28, 2020
Merged

Instant Search : Update mobile structure #14423

Changes from 1 commit
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
3744163
Add cross gridicon
keoshi Jan 20, 2020
8df1b37
Replace close button label by a gridicon
keoshi Jan 20, 2020
1e6365c
Change position of close button
keoshi Jan 20, 2020
4d30055
Update z-index stacking order
keoshi Jan 20, 2020
5ce1b62
Reorder CSS properties
keoshi Jan 20, 2020
9224b3c
Add medium break point at 768px
keoshi Jan 21, 2020
52ff75d
Add mobile styles for filters popover
keoshi Jan 21, 2020
6372552
Change how transparency is set on the overlay
keoshi Jan 21, 2020
20a74a5
Merge branch 'instant-search-master' into update/instant-search-mobil…
keoshi Jan 27, 2020
d990cb7
Update break-small to break-medium
keoshi Jan 27, 2020
0ca0447
Add styles for smaller close button on mobile devices
keoshi Jan 27, 2020
5534096
Add arrow element to popover
keoshi Jan 27, 2020
e64bbc1
Remove styles that are out of place
keoshi Jan 27, 2020
c368819
Update search results styling
keoshi Jan 27, 2020
fbbceaa
Add popover styles
keoshi Jan 27, 2020
e8359ae
Update filter icon margins
keoshi Jan 27, 2020
f506922
Show sidebar filters up to 768px
keoshi Jan 28, 2020
e34cfe6
Bring up the opacity on the arrow border
keoshi Jan 28, 2020
7edd008
Reduce side padding on small screens
keoshi Jan 28, 2020
663484e
Move margin to label span instead of select element
keoshi Jan 28, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Replace close button label by a gridicon
  • Loading branch information
@keoshi
keoshi committed Jan 20, 2020
commit 8df1b37a74d6192f223e37778caf519dcd10ad8e
8 changes: 6 additions & 2 deletions modules/search/instant-search/components/overlay.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,11 @@
*/
import { h } from 'preact';
import { useEffect } from 'preact/hooks';
import { __ } from '@wordpress/i18n';

/**
* Internal dependencies
*/
import Gridicon from './gridicon';

const closeOnEscapeKey = callback => event => {
event.key === 'Escape' && callback();
Expand All @@ -28,7 +32,7 @@ const Overlay = ( { isVisible, closeOverlay, children } ) => {
return (
<div className={ classNames.join( ' ' ) }>
<button className="jetpack-instant-search__overlay-close" onClick={ closeOverlay }>
{ __( 'Close', 'jetpack' ) }
<Gridicon icon="cross" size="24" />
</button>
{ children }
</div>
Expand Down