{"action":"closed","issue":{"url":"https://api.github.com/repos/angular/material/issues/7418","repository_url":"https://api.github.com/repos/angular/material","labels_url":"https://api.github.com/repos/angular/material/issues/7418/labels{/name}","comments_url":"https://api.github.com/repos/angular/material/issues/7418/comments","events_url":"https://api.github.com/repos/angular/material/issues/7418/events","html_url":"https://github.com/angular/material/issues/7418","id":138658872,"number":7418,"title":"Tab - style compatability - change in CSS - FIX","user":{"login":"ganySA","id":3189206,"avatar_url":"https://avatars.githubusercontent.com/u/3189206?v=3","gravatar_id":"","url":"https://api.github.com/users/ganySA","html_url":"https://github.com/ganySA","followers_url":"https://api.github.com/users/ganySA/followers","following_url":"https://api.github.com/users/ganySA/following{/other_user}","gists_url":"https://api.github.com/users/ganySA/gists{/gist_id}","starred_url":"https://api.github.com/users/ganySA/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ganySA/subscriptions","organizations_url":"https://api.github.com/users/ganySA/orgs","repos_url":"https://api.github.com/users/ganySA/repos","events_url":"https://api.github.com/users/ganySA/events{/privacy}","received_events_url":"https://api.github.com/users/ganySA/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/angular/material/labels/needs:%20demo","name":"needs: demo","color":"eb6420"},{"url":"https://api.github.com/repos/angular/material/labels/P4%20-%20Reported%20By%20or%20General%20PRs/Errors%20or%20Edge%20Cases","name":"P4 - Reported By or General PRs/Errors or Edge Cases","color":"bfdadc"}],"state":"closed","locked":false,"assignee":{"login":"crisbeto","id":4450522,"avatar_url":"https://avatars.githubusercontent.com/u/4450522?v=3","gravatar_id":"","url":"https://api.github.com/users/crisbeto","html_url":"https://github.com/crisbeto","followers_url":"https://api.github.com/users/crisbeto/followers","following_url":"https://api.github.com/users/crisbeto/following{/other_user}","gists_url":"https://api.github.com/users/crisbeto/gists{/gist_id}","starred_url":"https://api.github.com/users/crisbeto/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/crisbeto/subscriptions","organizations_url":"https://api.github.com/users/crisbeto/orgs","repos_url":"https://api.github.com/users/crisbeto/repos","events_url":"https://api.github.com/users/crisbeto/events{/privacy}","received_events_url":"https://api.github.com/users/crisbeto/received_events","type":"User","site_admin":false},"milestone":{"url":"https://api.github.com/repos/angular/material/milestones/49","html_url":"https://github.com/angular/material/milestones/Deprecated","labels_url":"https://api.github.com/repos/angular/material/milestones/49/labels","id":1717295,"number":49,"title":"Deprecated","description":"Issues and PRs that are considered old, stale, deprecated, not-core, or too risky.","creator":{"login":"ThomasBurleson","id":210413,"avatar_url":"https://avatars.githubusercontent.com/u/210413?v=3","gravatar_id":"","url":"https://api.github.com/users/ThomasBurleson","html_url":"https://github.com/ThomasBurleson","followers_url":"https://api.github.com/users/ThomasBurleson/followers","following_url":"https://api.github.com/users/ThomasBurleson/following{/other_user}","gists_url":"https://api.github.com/users/ThomasBurleson/gists{/gist_id}","starred_url":"https://api.github.com/users/ThomasBurleson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ThomasBurleson/subscriptions","organizations_url":"https://api.github.com/users/ThomasBurleson/orgs","repos_url":"https://api.github.com/users/ThomasBurleson/repos","events_url":"https://api.github.com/users/ThomasBurleson/events{/privacy}","received_events_url":"https://api.github.com/users/ThomasBurleson/received_events","type":"User","site_admin":false},"open_issues":216,"closed_issues":1328,"state":"open","created_at":"2016-04-19T15:37:31Z","updated_at":"2016-06-02T01:55:26Z","due_on":null,"closed_at":null},"comments":1,"created_at":"2016-03-05T07:57:44Z","updated_at":"2016-06-02T01:55:25Z","closed_at":"2016-06-02T01:55:25Z","body":"Hi\r\n\r\nIf you change the tab style with custom CSS the margins breaks the layout because the tab calculation does not take into account any margin on the elements.\r\n\r\nHere is a fix - call getComputeStyle then add left and right margin to the calculation.\r\n\r\n     function updatePagingWidth() {\r\n         var width = 1;\r\n        angular.forEach(getElements().dummies, function (element) {\r\n        // uses `getBoundingClientRect().width` rather than `offsetWidth` to include decimal values\r\n   \r\n        var style = window.getComputedStyle(element, null);\r\n        width += style.marginLeft;\r\n        width += style.marginRight;\r\n        width += Math.ceil(element.getBoundingClientRect().width);\r\n        });\r\n        angular.element(elements.paging).css('width', width + 'px');\r\n      }"}}
{"actor":{"display_login":"ThomasBurleson"}}