Skip to content

Commit 90487fd

Browse files
[IndexTable] Reduce offset to fix overlap (#7433)
### WHY are these changes introduced? Fixes overlap issue on IndexTable with BulkActions - see Before change screenshots below ### WHAT is this pull request doing? <details><summary>Screenshots - Before change</summary> <img width="1207" alt="Screen Shot 2022-10-18 at 9 16 04 AM" src="https://user-images.githubusercontent.com/78172179/196473532-4c850944-f97f-471c-bd21-963a6efcb1c4.png"> <img width="594" alt="Screen Shot 2022-10-18 at 9 16 13 AM" src="https://user-images.githubusercontent.com/78172179/196473530-11e7ed52-bdbe-4856-be3f-ba02fb8725a6.png"> <img width="793" alt="Screen Shot 2022-10-18 at 9 16 32 AM" src="https://user-images.githubusercontent.com/78172179/196473524-fc0691ba-a929-4dc0-996c-80a819e5d4cf.png"> </details> <details><summary>Screenshots - After change (current index filtering & unified index filtering)</summary> <img width="808" alt="Screen Shot 2022-10-18 at 9 21 46 AM" src="https://user-images.githubusercontent.com/78172179/196474250-cc58c643-a083-4fe4-bcda-d823292b2d51.png"> <img width="527" alt="Screen Shot 2022-10-18 at 9 21 34 AM" src="https://user-images.githubusercontent.com/78172179/196474258-222eabfc-259b-4f1b-bb1e-fe9db875f0ab.png"> <img width="781" alt="Screen Shot 2022-10-18 at 9 21 24 AM" src="https://user-images.githubusercontent.com/78172179/196474262-52bc23c9-390c-4463-81d1-23ae458f94cc.png"> #### With unified_index_filtering beta turned on: <img width="1213" alt="Screen Shot 2022-10-18 at 9 27 27 AM" src="https://user-images.githubusercontent.com/78172179/196474782-ef1e9a66-8659-43bb-9829-bfd34c8842d1.png"> </details> ### How to 🎩 Web Spin URL with changes: https://shop1.shopify.km-indextable.kelly-miller.us.spin.dev/admin/orders?inContextTimeframe=none 1. Visit pages with IndexTable (Orders index, discounts, abandoned checkouts) 2. Select multiple line items and verify that bulkactions do not overlap with first row anymore 3. Turn on `unified_index_filtering` beta in your DevUI and verify there is no overlap ### 🎩 checklist - [x] Tested on [mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing) - [x] Tested on [multiple browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers) - [ ] Tested for [accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md) - [ ] Updated the component's `README.md` with documentation changes - [ ] [Tophatted documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md) changes in the style guide
1 parent 74237eb commit 90487fd

File tree

2 files changed

+6
-1
lines changed

2 files changed

+6
-1
lines changed

.changeset/tame-phones-relax.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@shopify/polaris': patch
3+
---
4+
5+
fixed heading offset on IndexTable

polaris-react/src/components/IndexTable/IndexTable.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
.IndexTable {
44
--pc-index-table-translate-offset: 35px;
5-
--pc-index-table-table-header-offset: 52px;
5+
--pc-index-table-table-header-offset: 35px;
66
--pc-index-table-cell: 1;
77
--pc-index-table-sticky-cell: 31;
88
--pc-index-table-scroll-bar: 35;

0 commit comments

Comments
 (0)