{"action":"created","comment":{"url":"https://api.github.com/repos/storybooks/storybook/pulls/comments/178604017","pull_request_review_id":108686388,"id":178604017,"diff_hunk":"@@ -98,7 +98,11 @@ const defaultSizes = {\n   },\n };\n \n-const saveSizes = sizes => {\n+const saveSizes = (sizes, isMobileDevice) => {\n+  if (isMobileDevice) {","path":"lib/ui/src/modules/ui/components/layout/index.js","position":6,"original_position":6,"commit_id":"a92759d1ec1933733b968646c4c6358c535add72","original_commit_id":"a92759d1ec1933733b968646c4c6358c535add72","user":{"login":"denzenin","id":3757759,"avatar_url":"https://avatars1.githubusercontent.com/u/3757759?v=4","gravatar_id":"","url":"https://api.github.com/users/denzenin","html_url":"https://github.com/denzenin","followers_url":"https://api.github.com/users/denzenin/followers","following_url":"https://api.github.com/users/denzenin/following{/other_user}","gists_url":"https://api.github.com/users/denzenin/gists{/gist_id}","starred_url":"https://api.github.com/users/denzenin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/denzenin/subscriptions","organizations_url":"https://api.github.com/users/denzenin/orgs","repos_url":"https://api.github.com/users/denzenin/repos","events_url":"https://api.github.com/users/denzenin/events{/privacy}","received_events_url":"https://api.github.com/users/denzenin/received_events","type":"User","site_admin":false},"body":"@igor-dv I like the second option","created_at":"2018-04-02T17:55:49Z","updated_at":"2018-04-02T17:55:50Z","html_url":"https://github.com/storybooks/storybook/pull/3337#discussion_r178604017","pull_request_url":"https://api.github.com/repos/storybooks/storybook/pulls/3337","author_association":"NONE","_links":{"self":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/comments/178604017"},"html":{"href":"https://github.com/storybooks/storybook/pull/3337#discussion_r178604017"},"pull_request":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/3337"}},"in_reply_to_id":178467106},"pull_request":{"url":"https://api.github.com/repos/storybooks/storybook/pulls/3337","id":178741635,"html_url":"https://github.com/storybooks/storybook/pull/3337","diff_url":"https://github.com/storybooks/storybook/pull/3337.diff","patch_url":"https://github.com/storybooks/storybook/pull/3337.patch","issue_url":"https://api.github.com/repos/storybooks/storybook/issues/3337","number":3337,"state":"open","locked":false,"title":"Mobile device view: toggling stories panel with ☰ button ","user":{"login":"denzenin","id":3757759,"avatar_url":"https://avatars1.githubusercontent.com/u/3757759?v=4","gravatar_id":"","url":"https://api.github.com/users/denzenin","html_url":"https://github.com/denzenin","followers_url":"https://api.github.com/users/denzenin/followers","following_url":"https://api.github.com/users/denzenin/following{/other_user}","gists_url":"https://api.github.com/users/denzenin/gists{/gist_id}","starred_url":"https://api.github.com/users/denzenin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/denzenin/subscriptions","organizations_url":"https://api.github.com/users/denzenin/orgs","repos_url":"https://api.github.com/users/denzenin/repos","events_url":"https://api.github.com/users/denzenin/events{/privacy}","received_events_url":"https://api.github.com/users/denzenin/received_events","type":"User","site_admin":false},"body":"Issue:\r\n\r\n## What I did\r\n* adapted Header component  to have ☰ button when on mobile device\r\n* make stories-panel toggled by clicking ☰ button\r\n* added helper to detect whether the storybook is open on mobile device (this is done through userAgent of window)\r\n* adjusted styles \r\n\r\nNow on mobile devices the layout looks something like this when storybook is rendered:\r\n![image](https://user-images.githubusercontent.com/3757759/38176267-ac776684-35f4-11e8-9bd0-2c486937f02e.png)\r\n\r\n## How to test\r\nOpen storybook on mobile device\r\n\r\nIs this testable with Jest or Chromatic screenshots?\r\nyes (I added some new tests)\r\nDoes this need a new example in the kitchen sink apps?\r\nno\r\nDoes this need an update to the documentation?\r\nnot sure\r\nIf your answer is yes to any of these, please make sure to include it in your PR.\r\n","created_at":"2018-04-01T18:38:06Z","updated_at":"2018-04-02T17:55:50Z","closed_at":null,"merged_at":null,"merge_commit_sha":null,"assignee":null,"assignees":[],"requested_reviewers":[{"login":"tmeasday","id":132554,"avatar_url":"https://avatars1.githubusercontent.com/u/132554?v=4","gravatar_id":"","url":"https://api.github.com/users/tmeasday","html_url":"https://github.com/tmeasday","followers_url":"https://api.github.com/users/tmeasday/followers","following_url":"https://api.github.com/users/tmeasday/following{/other_user}","gists_url":"https://api.github.com/users/tmeasday/gists{/gist_id}","starred_url":"https://api.github.com/users/tmeasday/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tmeasday/subscriptions","organizations_url":"https://api.github.com/users/tmeasday/orgs","repos_url":"https://api.github.com/users/tmeasday/repos","events_url":"https://api.github.com/users/tmeasday/events{/privacy}","received_events_url":"https://api.github.com/users/tmeasday/received_events","type":"User","site_admin":false},{"login":"ndelangen","id":3070389,"avatar_url":"https://avatars2.githubusercontent.com/u/3070389?v=4","gravatar_id":"","url":"https://api.github.com/users/ndelangen","html_url":"https://github.com/ndelangen","followers_url":"https://api.github.com/users/ndelangen/followers","following_url":"https://api.github.com/users/ndelangen/following{/other_user}","gists_url":"https://api.github.com/users/ndelangen/gists{/gist_id}","starred_url":"https://api.github.com/users/ndelangen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ndelangen/subscriptions","organizations_url":"https://api.github.com/users/ndelangen/orgs","repos_url":"https://api.github.com/users/ndelangen/repos","events_url":"https://api.github.com/users/ndelangen/events{/privacy}","received_events_url":"https://api.github.com/users/ndelangen/received_events","type":"User","site_admin":false},{"login":"UsulPro","id":14885189,"avatar_url":"https://avatars1.githubusercontent.com/u/14885189?v=4","gravatar_id":"","url":"https://api.github.com/users/UsulPro","html_url":"https://github.com/UsulPro","followers_url":"https://api.github.com/users/UsulPro/followers","following_url":"https://api.github.com/users/UsulPro/following{/other_user}","gists_url":"https://api.github.com/users/UsulPro/gists{/gist_id}","starred_url":"https://api.github.com/users/UsulPro/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/UsulPro/subscriptions","organizations_url":"https://api.github.com/users/UsulPro/orgs","repos_url":"https://api.github.com/users/UsulPro/repos","events_url":"https://api.github.com/users/UsulPro/events{/privacy}","received_events_url":"https://api.github.com/users/UsulPro/received_events","type":"User","site_admin":false}],"requested_teams":[],"labels":[{"id":343576456,"url":"https://api.github.com/repos/storybooks/storybook/labels/feature%20request","name":"feature request","color":"9B58D8","default":false},{"id":589394257,"url":"https://api.github.com/repos/storybooks/storybook/labels/ui","name":"ui","color":"fbca04","default":false}],"milestone":null,"commits_url":"https://api.github.com/repos/storybooks/storybook/pulls/3337/commits","review_comments_url":"https://api.github.com/repos/storybooks/storybook/pulls/3337/comments","review_comment_url":"https://api.github.com/repos/storybooks/storybook/pulls/comments{/number}","comments_url":"https://api.github.com/repos/storybooks/storybook/issues/3337/comments","statuses_url":"https://api.github.com/repos/storybooks/storybook/statuses/a92759d1ec1933733b968646c4c6358c535add72","head":{"label":"denzenin:mobile-device-view","ref":"mobile-device-view","sha":"a92759d1ec1933733b968646c4c6358c535add72","user":{"login":"denzenin","id":3757759,"avatar_url":"https://avatars1.githubusercontent.com/u/3757759?v=4","gravatar_id":"","url":"https://api.github.com/users/denzenin","html_url":"https://github.com/denzenin","followers_url":"https://api.github.com/users/denzenin/followers","following_url":"https://api.github.com/users/denzenin/following{/other_user}","gists_url":"https://api.github.com/users/denzenin/gists{/gist_id}","starred_url":"https://api.github.com/users/denzenin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/denzenin/subscriptions","organizations_url":"https://api.github.com/users/denzenin/orgs","repos_url":"https://api.github.com/users/denzenin/repos","events_url":"https://api.github.com/users/denzenin/events{/privacy}","received_events_url":"https://api.github.com/users/denzenin/received_events","type":"User","site_admin":false},"repo":{"id":116682653,"name":"storybook","full_name":"denzenin/storybook","owner":{"login":"denzenin","id":3757759,"avatar_url":"https://avatars1.githubusercontent.com/u/3757759?v=4","gravatar_id":"","url":"https://api.github.com/users/denzenin","html_url":"https://github.com/denzenin","followers_url":"https://api.github.com/users/denzenin/followers","following_url":"https://api.github.com/users/denzenin/following{/other_user}","gists_url":"https://api.github.com/users/denzenin/gists{/gist_id}","starred_url":"https://api.github.com/users/denzenin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/denzenin/subscriptions","organizations_url":"https://api.github.com/users/denzenin/orgs","repos_url":"https://api.github.com/users/denzenin/repos","events_url":"https://api.github.com/users/denzenin/events{/privacy}","received_events_url":"https://api.github.com/users/denzenin/received_events","type":"User","site_admin":false},"private":false,"html_url":"https://github.com/denzenin/storybook","description":"Interactive UI component dev & test: React, React Native, Vue, Angular","fork":true,"url":"https://api.github.com/repos/denzenin/storybook","forks_url":"https://api.github.com/repos/denzenin/storybook/forks","keys_url":"https://api.github.com/repos/denzenin/storybook/keys{/key_id}","collaborators_url":"https://api.github.com/repos/denzenin/storybook/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/denzenin/storybook/teams","hooks_url":"https://api.github.com/repos/denzenin/storybook/hooks","issue_events_url":"https://api.github.com/repos/denzenin/storybook/issues/events{/number}","events_url":"https://api.github.com/repos/denzenin/storybook/events","assignees_url":"https://api.github.com/repos/denzenin/storybook/assignees{/user}","branches_url":"https://api.github.com/repos/denzenin/storybook/branches{/branch}","tags_url":"https://api.github.com/repos/denzenin/storybook/tags","blobs_url":"https://api.github.com/repos/denzenin/storybook/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/denzenin/storybook/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/denzenin/storybook/git/refs{/sha}","trees_url":"https://api.github.com/repos/denzenin/storybook/git/trees{/sha}","statuses_url":"https://api.github.com/repos/denzenin/storybook/statuses/{sha}","languages_url":"https://api.github.com/repos/denzenin/storybook/languages","stargazers_url":"https://api.github.com/repos/denzenin/storybook/stargazers","contributors_url":"https://api.github.com/repos/denzenin/storybook/contributors","subscribers_url":"https://api.github.com/repos/denzenin/storybook/subscribers","subscription_url":"https://api.github.com/repos/denzenin/storybook/subscription","commits_url":"https://api.github.com/repos/denzenin/storybook/commits{/sha}","git_commits_url":"https://api.github.com/repos/denzenin/storybook/git/commits{/sha}","comments_url":"https://api.github.com/repos/denzenin/storybook/comments{/number}","issue_comment_url":"https://api.github.com/repos/denzenin/storybook/issues/comments{/number}","contents_url":"https://api.github.com/repos/denzenin/storybook/contents/{+path}","compare_url":"https://api.github.com/repos/denzenin/storybook/compare/{base}...{head}","merges_url":"https://api.github.com/repos/denzenin/storybook/merges","archive_url":"https://api.github.com/repos/denzenin/storybook/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/denzenin/storybook/downloads","issues_url":"https://api.github.com/repos/denzenin/storybook/issues{/number}","pulls_url":"https://api.github.com/repos/denzenin/storybook/pulls{/number}","milestones_url":"https://api.github.com/repos/denzenin/storybook/milestones{/number}","notifications_url":"https://api.github.com/repos/denzenin/storybook/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/denzenin/storybook/labels{/name}","releases_url":"https://api.github.com/repos/denzenin/storybook/releases{/id}","deployments_url":"https://api.github.com/repos/denzenin/storybook/deployments","created_at":"2018-01-08T13:51:23Z","updated_at":"2018-01-08T13:51:28Z","pushed_at":"2018-04-01T18:21:45Z","git_url":"git://github.com/denzenin/storybook.git","ssh_url":"git@github.com:denzenin/storybook.git","clone_url":"https://github.com/denzenin/storybook.git","svn_url":"https://github.com/denzenin/storybook","homepage":"https://storybook.js.org","size":70661,"stargazers_count":0,"watchers_count":0,"language":"JavaScript","has_issues":false,"has_projects":true,"has_downloads":true,"has_wiki":false,"has_pages":false,"forks_count":0,"mirror_url":null,"archived":false,"open_issues_count":0,"license":null,"forks":0,"open_issues":0,"watchers":0,"default_branch":"master"}},"base":{"label":"storybooks:master","ref":"master","sha":"2675c19144e6eb33d6460157b3133a3ce056d943","user":{"login":"storybooks","id":22632046,"avatar_url":"https://avatars3.githubusercontent.com/u/22632046?v=4","gravatar_id":"","url":"https://api.github.com/users/storybooks","html_url":"https://github.com/storybooks","followers_url":"https://api.github.com/users/storybooks/followers","following_url":"https://api.github.com/users/storybooks/following{/other_user}","gists_url":"https://api.github.com/users/storybooks/gists{/gist_id}","starred_url":"https://api.github.com/users/storybooks/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/storybooks/subscriptions","organizations_url":"https://api.github.com/users/storybooks/orgs","repos_url":"https://api.github.com/users/storybooks/repos","events_url":"https://api.github.com/users/storybooks/events{/privacy}","received_events_url":"https://api.github.com/users/storybooks/received_events","type":"Organization","site_admin":false},"repo":{"id":54173593,"name":"storybook","full_name":"storybooks/storybook","owner":{"login":"storybooks","id":22632046,"avatar_url":"https://avatars3.githubusercontent.com/u/22632046?v=4","gravatar_id":"","url":"https://api.github.com/users/storybooks","html_url":"https://github.com/storybooks","followers_url":"https://api.github.com/users/storybooks/followers","following_url":"https://api.github.com/users/storybooks/following{/other_user}","gists_url":"https://api.github.com/users/storybooks/gists{/gist_id}","starred_url":"https://api.github.com/users/storybooks/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/storybooks/subscriptions","organizations_url":"https://api.github.com/users/storybooks/orgs","repos_url":"https://api.github.com/users/storybooks/repos","events_url":"https://api.github.com/users/storybooks/events{/privacy}","received_events_url":"https://api.github.com/users/storybooks/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/storybooks/storybook","description":"Interactive UI component dev & test: React, React Native, Vue, Angular","fork":false,"url":"https://api.github.com/repos/storybooks/storybook","forks_url":"https://api.github.com/repos/storybooks/storybook/forks","keys_url":"https://api.github.com/repos/storybooks/storybook/keys{/key_id}","collaborators_url":"https://api.github.com/repos/storybooks/storybook/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/storybooks/storybook/teams","hooks_url":"https://api.github.com/repos/storybooks/storybook/hooks","issue_events_url":"https://api.github.com/repos/storybooks/storybook/issues/events{/number}","events_url":"https://api.github.com/repos/storybooks/storybook/events","assignees_url":"https://api.github.com/repos/storybooks/storybook/assignees{/user}","branches_url":"https://api.github.com/repos/storybooks/storybook/branches{/branch}","tags_url":"https://api.github.com/repos/storybooks/storybook/tags","blobs_url":"https://api.github.com/repos/storybooks/storybook/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/storybooks/storybook/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/storybooks/storybook/git/refs{/sha}","trees_url":"https://api.github.com/repos/storybooks/storybook/git/trees{/sha}","statuses_url":"https://api.github.com/repos/storybooks/storybook/statuses/{sha}","languages_url":"https://api.github.com/repos/storybooks/storybook/languages","stargazers_url":"https://api.github.com/repos/storybooks/storybook/stargazers","contributors_url":"https://api.github.com/repos/storybooks/storybook/contributors","subscribers_url":"https://api.github.com/repos/storybooks/storybook/subscribers","subscription_url":"https://api.github.com/repos/storybooks/storybook/subscription","commits_url":"https://api.github.com/repos/storybooks/storybook/commits{/sha}","git_commits_url":"https://api.github.com/repos/storybooks/storybook/git/commits{/sha}","comments_url":"https://api.github.com/repos/storybooks/storybook/comments{/number}","issue_comment_url":"https://api.github.com/repos/storybooks/storybook/issues/comments{/number}","contents_url":"https://api.github.com/repos/storybooks/storybook/contents/{+path}","compare_url":"https://api.github.com/repos/storybooks/storybook/compare/{base}...{head}","merges_url":"https://api.github.com/repos/storybooks/storybook/merges","archive_url":"https://api.github.com/repos/storybooks/storybook/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/storybooks/storybook/downloads","issues_url":"https://api.github.com/repos/storybooks/storybook/issues{/number}","pulls_url":"https://api.github.com/repos/storybooks/storybook/pulls{/number}","milestones_url":"https://api.github.com/repos/storybooks/storybook/milestones{/number}","notifications_url":"https://api.github.com/repos/storybooks/storybook/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/storybooks/storybook/labels{/name}","releases_url":"https://api.github.com/repos/storybooks/storybook/releases{/id}","deployments_url":"https://api.github.com/repos/storybooks/storybook/deployments","created_at":"2016-03-18T04:23:44Z","updated_at":"2018-04-02T17:38:06Z","pushed_at":"2018-04-02T17:37:39Z","git_url":"git://github.com/storybooks/storybook.git","ssh_url":"git@github.com:storybooks/storybook.git","clone_url":"https://github.com/storybooks/storybook.git","svn_url":"https://github.com/storybooks/storybook","homepage":"https://storybook.js.org","size":90409,"stargazers_count":22055,"watchers_count":22055,"language":"JavaScript","has_issues":true,"has_projects":false,"has_downloads":true,"has_wiki":false,"has_pages":true,"forks_count":1471,"mirror_url":null,"archived":false,"open_issues_count":162,"license":{"key":"mit","name":"MIT License","spdx_id":"MIT","url":"https://api.github.com/licenses/mit"},"forks":1471,"open_issues":162,"watchers":22055,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/3337"},"html":{"href":"https://github.com/storybooks/storybook/pull/3337"},"issue":{"href":"https://api.github.com/repos/storybooks/storybook/issues/3337"},"comments":{"href":"https://api.github.com/repos/storybooks/storybook/issues/3337/comments"},"review_comments":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/3337/comments"},"review_comment":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/storybooks/storybook/pulls/3337/commits"},"statuses":{"href":"https://api.github.com/repos/storybooks/storybook/statuses/a92759d1ec1933733b968646c4c6358c535add72"}},"author_association":"NONE"}}
{"actor":{"display_login":"denzenin"}}