Skip to content

Commit

Permalink
Revert "#933: Clear filters button not well aligned and not visible (#…
Browse files Browse the repository at this point in the history
…944)"

This reverts commit a394290.
  • Loading branch information
DavidQuartz authored Apr 20, 2022
1 parent 74980a0 commit 48be3f2
Show file tree
Hide file tree
Showing 3 changed files with 21 additions and 14 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -57,15 +57,7 @@ function FilterForm({
<div className="gn-filter-form" style={styleContainerForm} >
<div className="gn-filter-form-header">
<div className="gn-filter-form-title">
<div><FaIcon name="filter" /> <strong><Message msgId="gnhome.filters" /></strong></div>
<Button
size="sm"
variant="default"
onClick={onClear}
disabled={isEmpty(query)}
>
<Message msgId="gnhome.clearFilters"/>
</Button>
<FaIcon name="filter"/> <strong><Message msgId="gnhome.filters"/></strong>
</div>
<Button
variant="default"
Expand Down Expand Up @@ -107,6 +99,16 @@ function FilterForm({
</form>
</div>
</div>
<div className="gn-filter-form-footer">
<Button
size="sm"
variant="default"
onClick={onClear}
disabled={isEmpty(query)}
>
<Message msgId="gnhome.clearFilters"/>
</Button>
</div>
</div>
);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ describe('FiltersForm component', () => {
ReactDOM.render( <FiltersForm show onClear={onClear} query={{ q: 'A' }} submitOnChangeField={false} />, document.getElementById("container"));
const filterFormNode = document.querySelector('.gn-filter-form');
expect(filterFormNode).toBeTruthy();
const footerButtons = filterFormNode.querySelectorAll('.gn-filter-form-title > button');
const footerButtons = filterFormNode.querySelectorAll('.gn-filter-form-footer > button');
expect(footerButtons.length).toBe(1);
const clearButton = footerButtons[0];
Simulate.click(clearButton);
Expand All @@ -65,7 +65,7 @@ describe('FiltersForm component', () => {
ReactDOM.render( <FiltersForm show submitOnChangeField />, document.getElementById("container"));
const filterFormNode = document.querySelector('.gn-filter-form');
expect(filterFormNode).toBeTruthy();
const footerButtons = filterFormNode.querySelectorAll('.gn-filter-form-title > button');
const footerButtons = filterFormNode.querySelectorAll('.gn-filter-form-footer > button');
expect(footerButtons.length).toBe(1);

});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -57,12 +57,17 @@
}
}
.gn-filter-form-title {
display: flex;
align-items: center;
justify-content: space-between;
flex: 1;
padding: 0 0.5rem;
}
.gn-filter-form-footer {
display: flex;
flex-direction: row-reverse;
align-items: center;
position: sticky;
bottom: 0;
padding: 0.5rem;
}
.gn-filter-form-divider {
width: calc(100% - 0.5rem);
height: 1px;
Expand Down

0 comments on commit 48be3f2

Please sign in to comment.