{"action":"created","issue":{"url":"https://api.github.com/repos/Automattic/wp-calypso/issues/1514","labels_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/1514/labels{/name}","comments_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/1514/comments","events_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/1514/events","html_url":"https://github.com/Automattic/wp-calypso/pull/1514","id":121776380,"number":1514,"title":"Components: header cake cleanup","user":{"login":"adambbecker","id":1427136,"avatar_url":"https://avatars.githubusercontent.com/u/1427136?v=3","gravatar_id":"","url":"https://api.github.com/users/adambbecker","html_url":"https://github.com/adambbecker","followers_url":"https://api.github.com/users/adambbecker/followers","following_url":"https://api.github.com/users/adambbecker/following{/other_user}","gists_url":"https://api.github.com/users/adambbecker/gists{/gist_id}","starred_url":"https://api.github.com/users/adambbecker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/adambbecker/subscriptions","organizations_url":"https://api.github.com/users/adambbecker/orgs","repos_url":"https://api.github.com/users/adambbecker/repos","events_url":"https://api.github.com/users/adambbecker/events{/privacy}","received_events_url":"https://api.github.com/users/adambbecker/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/Automattic/wp-calypso/labels/Components","name":"Components","color":"006b75"},{"url":"https://api.github.com/repos/Automattic/wp-calypso/labels/[Status]%20In%20Progress","name":"[Status] In Progress","color":"207de5"}],"state":"open","locked":false,"assignee":{"login":"adambbecker","id":1427136,"avatar_url":"https://avatars.githubusercontent.com/u/1427136?v=3","gravatar_id":"","url":"https://api.github.com/users/adambbecker","html_url":"https://github.com/adambbecker","followers_url":"https://api.github.com/users/adambbecker/followers","following_url":"https://api.github.com/users/adambbecker/following{/other_user}","gists_url":"https://api.github.com/users/adambbecker/gists{/gist_id}","starred_url":"https://api.github.com/users/adambbecker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/adambbecker/subscriptions","organizations_url":"https://api.github.com/users/adambbecker/orgs","repos_url":"https://api.github.com/users/adambbecker/repos","events_url":"https://api.github.com/users/adambbecker/events{/privacy}","received_events_url":"https://api.github.com/users/adambbecker/received_events","type":"User","site_admin":false},"milestone":{"url":"https://api.github.com/repos/Automattic/wp-calypso/milestones/20","html_url":"https://github.com/Automattic/wp-calypso/milestones/Core:%20Iteration%2017","labels_url":"https://api.github.com/repos/Automattic/wp-calypso/milestones/20/labels","id":1420284,"number":20,"title":"Core: Iteration 17","description":"","creator":{"login":"hoverduck","id":7233112,"avatar_url":"https://avatars.githubusercontent.com/u/7233112?v=3","gravatar_id":"","url":"https://api.github.com/users/hoverduck","html_url":"https://github.com/hoverduck","followers_url":"https://api.github.com/users/hoverduck/followers","following_url":"https://api.github.com/users/hoverduck/following{/other_user}","gists_url":"https://api.github.com/users/hoverduck/gists{/gist_id}","starred_url":"https://api.github.com/users/hoverduck/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/hoverduck/subscriptions","organizations_url":"https://api.github.com/users/hoverduck/orgs","repos_url":"https://api.github.com/users/hoverduck/repos","events_url":"https://api.github.com/users/hoverduck/events{/privacy}","received_events_url":"https://api.github.com/users/hoverduck/received_events","type":"User","site_admin":false},"open_issues":35,"closed_issues":20,"state":"open","created_at":"2015-11-19T17:10:22Z","updated_at":"2015-12-12T16:33:18Z","due_on":"2015-12-31T06:00:00Z","closed_at":null},"comments":5,"created_at":"2015-12-11T19:31:21Z","updated_at":"2015-12-14T15:05:22Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/Automattic/wp-calypso/pulls/1514","html_url":"https://github.com/Automattic/wp-calypso/pull/1514","diff_url":"https://github.com/Automattic/wp-calypso/pull/1514.diff","patch_url":"https://github.com/Automattic/wp-calypso/pull/1514.patch"},"body":"Cleans up the \"header cake\" (`client/components/header-cake`) component & fixes #143.\r\n\r\n## Background\r\n\r\nOver in #143, a situation arose with the current header cake component where the \"back\" text would wrap oddly on small screens if displayed in certain languages. After some investigation, it turns out that this situation could occur in a variety of situations as long as the text was long enough.\r\n\r\nThere was a variety of potential tweaks that were investigated (#143) and could be made in order to handle the situation. This PR proposes one of them, which aligns the title to the right of the card and allows the \"back\" text to always remain inline with it's accompanying chevron icon.\r\n\r\n## Visual changes\r\n\r\nHere are a few examples of this change in action:\r\n\r\n##### Delete site\r\n\r\n`/settings/delete-site/*`\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11724431/102e81c2-9f42-11e5-9872-a7def9a87ec8.png)\r\n\r\n##### Devdocs sub-page\r\n\r\n`/devdocs/design/gridicons`\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11724435/14511e9a-9f42-11e5-952d-541253d3ffaa.png)\r\n\r\n##### Stats sub-page\r\n\r\n`/stats/day/posts/*`\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11724440/18858406-9f42-11e5-8dc2-ea1cc3a1201c.png)\r\n\r\n##### Domain settings\r\n\r\n`/domains/manage/*/edit/*`\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11724446/1dcc8c34-9f42-11e5-9396-6b36a60b5d41.png)\r\n\r\n## Testing\r\n\r\nVisit any page that contains the `HeaderCake` component and check that the entire text (title & \"back\" link) remains inline regardless of screen size. It should behave similarly to this example:\r\n\r\n##### Large widths\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11573006/02c6e9d6-99d2-11e5-9f32-69bee083c030.png)\r\n\r\n##### Small widths\r\n\r\n![](https://cloud.githubusercontent.com/assets/1427136/11572951/bd08bcb2-99d1-11e5-80ed-0945b82f7eaa.png)\r\n\r\n---\r\n\r\n/cc @mtias, @hoverduck"},"comment":{"url":"https://api.github.com/repos/Automattic/wp-calypso/issues/comments/164460277","html_url":"https://github.com/Automattic/wp-calypso/pull/1514#issuecomment-164460277","issue_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/1514","id":164460277,"user":{"login":"adambbecker","id":1427136,"avatar_url":"https://avatars.githubusercontent.com/u/1427136?v=3","gravatar_id":"","url":"https://api.github.com/users/adambbecker","html_url":"https://github.com/adambbecker","followers_url":"https://api.github.com/users/adambbecker/followers","following_url":"https://api.github.com/users/adambbecker/following{/other_user}","gists_url":"https://api.github.com/users/adambbecker/gists{/gist_id}","starred_url":"https://api.github.com/users/adambbecker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/adambbecker/subscriptions","organizations_url":"https://api.github.com/users/adambbecker/orgs","repos_url":"https://api.github.com/users/adambbecker/repos","events_url":"https://api.github.com/users/adambbecker/events{/privacy}","received_events_url":"https://api.github.com/users/adambbecker/received_events","type":"User","site_admin":false},"created_at":"2015-12-14T15:05:22Z","updated_at":"2015-12-14T15:05:22Z","body":"> In the end, just the back arrow is a consolidated behaviour, even more on mobile, so I don't think that losing the text would be a problem. :)\r\n\r\nOoh, this is good idea and agree. I'll check that out."}}