{"action":"created","issue":{"url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/1258","repository_url":"https://api.github.com/repos/vaadin/vaadin-grid","labels_url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/1258/labels{/name}","comments_url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/1258/comments","events_url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/1258/events","html_url":"https://github.com/vaadin/vaadin-grid/issues/1258","id":305909243,"number":1258,"title":"Padding at the end of the grid","user":{"login":"Pupix","id":4929965,"avatar_url":"https://avatars0.githubusercontent.com/u/4929965?v=4","gravatar_id":"","url":"https://api.github.com/users/Pupix","html_url":"https://github.com/Pupix","followers_url":"https://api.github.com/users/Pupix/followers","following_url":"https://api.github.com/users/Pupix/following{/other_user}","gists_url":"https://api.github.com/users/Pupix/gists{/gist_id}","starred_url":"https://api.github.com/users/Pupix/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Pupix/subscriptions","organizations_url":"https://api.github.com/users/Pupix/orgs","repos_url":"https://api.github.com/users/Pupix/repos","events_url":"https://api.github.com/users/Pupix/events{/privacy}","received_events_url":"https://api.github.com/users/Pupix/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-03-16T12:26:47Z","updated_at":"2018-03-16T17:45:56Z","closed_at":"2018-03-16T17:45:56Z","author_association":"NONE","body":"### Description\r\nUsing a Material Design approch with this grid/table creates parts of unusable UI as shown below:\r\n\r\n![image](https://user-images.githubusercontent.com/4929965/37518771-e24a0194-2916-11e8-9163-32517f945849.png)\r\n\r\nThe `more icon` on the left gets stuck behind the FAB. This issue is usually solved with an additional padding at the end of the list that lets you scroll past the last line.\r\n\r\nI tried using `padding-bottom` on the `vaadin-grid` element but that makes the whole scroller go up by `X  px`\r\n![image](https://user-images.githubusercontent.com/4929965/37518881-566273f4-2917-11e8-9b05-7936569e829e.png)\r\n\r\nI also tried using an empty footer which gives me the intended results\r\n![image](https://user-images.githubusercontent.com/4929965/37520367-ff500bca-291c-11e8-9204-7a2dd1e82a56.png)\r\n\r\nbut also adds a sideffect making the area where the footer is unclickable\r\n\r\n![image](https://user-images.githubusercontent.com/4929965/37520462-63380584-291d-11e8-8176-ce6d8a124a04.png)\r\n\r\nTrying to add `pointer-events: none` with `--vaadin-grid-footer-cell` doesn't do anything because the clickable area is `vaadin-grid-table-footer-cell` inside the shadow-dom with no styling hook."},"comment":{"url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/comments/373792092","html_url":"https://github.com/vaadin/vaadin-grid/issues/1258#issuecomment-373792092","issue_url":"https://api.github.com/repos/vaadin/vaadin-grid/issues/1258","id":373792092,"user":{"login":"web-padawan","id":10589913,"avatar_url":"https://avatars2.githubusercontent.com/u/10589913?v=4","gravatar_id":"","url":"https://api.github.com/users/web-padawan","html_url":"https://github.com/web-padawan","followers_url":"https://api.github.com/users/web-padawan/followers","following_url":"https://api.github.com/users/web-padawan/following{/other_user}","gists_url":"https://api.github.com/users/web-padawan/gists{/gist_id}","starred_url":"https://api.github.com/users/web-padawan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/web-padawan/subscriptions","organizations_url":"https://api.github.com/users/web-padawan/orgs","repos_url":"https://api.github.com/users/web-padawan/repos","events_url":"https://api.github.com/users/web-padawan/events{/privacy}","received_events_url":"https://api.github.com/users/web-padawan/received_events","type":"User","site_admin":false},"created_at":"2018-03-16T17:45:56Z","updated_at":"2018-03-16T17:45:56Z","author_association":"CONTRIBUTOR","body":"@Pupix can you add a wrapper component to position the `paper-fab` properly: https://jsbin.com/gaqumem/edit?html,output\r\n\r\nSee also how this is implemented in our [expense-manager](https://github.com/vaadin/expense-manager-demo/blob/master/src/expenses-list.html) demo, live demo is [here](https://expensemanager.demo.vaadin.com/)\r\n\r\nThe grid is not expected to accept arbitrary content like this, and has nothing to do about positioning of it. As you can see, this can be achieved by CSS, therefore I'm closing this issue."}}
{"actor":{"display_login":"web-padawan"}}