{"action":"created","comment":{"url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/comments/237157043","pull_request_review_id":179387156,"id":237157043,"node_id":"MDI0OlB1bGxSZXF1ZXN0UmV2aWV3Q29tbWVudDIzNzE1NzA0Mw==","diff_hunk":"@@ -4,6 +4,14 @@ This project adheres to [Semantic Versioning](http://semver.org/).\n \n ## [unreleased]\n \n+- Feature: Update `Marger` component. You can now pass an\n+  object to the `top` and `bottom` props to handle breakpoints with `Marger`.\n+  This update doesn't affect the previous props' validation, you can still pass\n+  string values:\n+  ```js\n+  const topMarginsWithBreakpoints = { xs: 12, m: 2, default: 4 }","path":"CHANGELOG.md","position":9,"original_position":9,"commit_id":"0d8088b2b35a0ab4d051e3cdec101b30985d71f2","original_commit_id":"4484b2ee4d8a472bf21d2f6d19928440d807cca1","user":{"login":"Ynote","id":548778,"node_id":"MDQ6VXNlcjU0ODc3OA==","avatar_url":"https://avatars1.githubusercontent.com/u/548778?v=4","gravatar_id":"","url":"https://api.github.com/users/Ynote","html_url":"https://github.com/Ynote","followers_url":"https://api.github.com/users/Ynote/followers","following_url":"https://api.github.com/users/Ynote/following{/other_user}","gists_url":"https://api.github.com/users/Ynote/gists{/gist_id}","starred_url":"https://api.github.com/users/Ynote/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Ynote/subscriptions","organizations_url":"https://api.github.com/users/Ynote/orgs","repos_url":"https://api.github.com/users/Ynote/repos","events_url":"https://api.github.com/users/Ynote/events{/privacy}","received_events_url":"https://api.github.com/users/Ynote/received_events","type":"User","site_admin":false},"body":"J'ai l'impression, en lisant le code sur KissKiss, que l'usage, c'est d'avoir une valeur par défaut et une autre à partir d'un breakpoint. Avoir un tableau de range me semble être fastidieux à écrire pour les cas d'usage qui existent.","created_at":"2018-11-28T16:20:56Z","updated_at":"2018-11-28T16:20:57Z","html_url":"https://github.com/KissKissBankBank/kitten/pull/1419#discussion_r237157043","pull_request_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419","author_association":"CONTRIBUTOR","_links":{"self":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/comments/237157043"},"html":{"href":"https://github.com/KissKissBankBank/kitten/pull/1419#discussion_r237157043"},"pull_request":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419"}},"in_reply_to_id":236753614},"pull_request":{"url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419","id":233977604,"node_id":"MDExOlB1bGxSZXF1ZXN0MjMzOTc3NjA0","html_url":"https://github.com/KissKissBankBank/kitten/pull/1419","diff_url":"https://github.com/KissKissBankBank/kitten/pull/1419.diff","patch_url":"https://github.com/KissKissBankBank/kitten/pull/1419.patch","issue_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/1419","number":1419,"state":"open","locked":false,"title":"[Performance] Enable `Marger` to use CSS media-queries","user":{"login":"Ynote","id":548778,"node_id":"MDQ6VXNlcjU0ODc3OA==","avatar_url":"https://avatars1.githubusercontent.com/u/548778?v=4","gravatar_id":"","url":"https://api.github.com/users/Ynote","html_url":"https://github.com/Ynote","followers_url":"https://api.github.com/users/Ynote/followers","following_url":"https://api.github.com/users/Ynote/following{/other_user}","gists_url":"https://api.github.com/users/Ynote/gists{/gist_id}","starred_url":"https://api.github.com/users/Ynote/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Ynote/subscriptions","organizations_url":"https://api.github.com/users/Ynote/orgs","repos_url":"https://api.github.com/users/Ynote/repos","events_url":"https://api.github.com/users/Ynote/events{/privacy}","received_events_url":"https://api.github.com/users/Ynote/received_events","type":"User","site_admin":false},"body":"Related to https://github.com/KissKissBankBank/kisskissbankbank/issues/5418.\r\n\r\nActuellement, l'utilisation de `Marger` ne prend pas en compte de possibles media-queries en CSS. Pour pouvoir l'utiliser en fonction de différents viewports, sur les plateformes, on utilise la gestion des media-queries en JavaScript : \r\n```js\r\n<Marger top={viewportIsSOrLess ? 7 : 10}>\r\n```\r\nCela crée un gros souci en terme de rendu avec le SSR : les marges changent en fonction de la taille du viewport détecté après le chargement du JS. Ce qui génère parfois un flash en terme d'UX. Dans certains cas, pour pallier ce problème, on affiche un layout blanc le temps que le JS se charge.\r\n\r\nPour ne plus gérer les breakpoints avec le JavaScript mais plutôt avec le CSS (afin que le SSR ait une utilité), cette PR ajoute la possibilité de passer à `Marger` un objet avec les différents breakpoints existants (listés par `screen-config`) pour les props `top` et `bottom`. Cela fonctionne un peu comme `GridCol` (sauf que j'ai choisi de passer un objet au lieu d'avoir plein de props) :  \r\n```js\r\n<Marger top={{s: 7, default: 10}}>\r\n```","created_at":"2018-11-27T16:29:23Z","updated_at":"2018-11-28T16:20:57Z","closed_at":null,"merged_at":null,"merge_commit_sha":"371d07680d4f1d014ace97902a3635ffa5fbbfc3","assignee":null,"assignees":[],"requested_reviewers":[{"login":"Morgan-jarry","id":523306,"node_id":"MDQ6VXNlcjUyMzMwNg==","avatar_url":"https://avatars3.githubusercontent.com/u/523306?v=4","gravatar_id":"","url":"https://api.github.com/users/Morgan-jarry","html_url":"https://github.com/Morgan-jarry","followers_url":"https://api.github.com/users/Morgan-jarry/followers","following_url":"https://api.github.com/users/Morgan-jarry/following{/other_user}","gists_url":"https://api.github.com/users/Morgan-jarry/gists{/gist_id}","starred_url":"https://api.github.com/users/Morgan-jarry/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Morgan-jarry/subscriptions","organizations_url":"https://api.github.com/users/Morgan-jarry/orgs","repos_url":"https://api.github.com/users/Morgan-jarry/repos","events_url":"https://api.github.com/users/Morgan-jarry/events{/privacy}","received_events_url":"https://api.github.com/users/Morgan-jarry/received_events","type":"User","site_admin":false},{"login":"FlorentD","id":804738,"node_id":"MDQ6VXNlcjgwNDczOA==","avatar_url":"https://avatars0.githubusercontent.com/u/804738?v=4","gravatar_id":"","url":"https://api.github.com/users/FlorentD","html_url":"https://github.com/FlorentD","followers_url":"https://api.github.com/users/FlorentD/followers","following_url":"https://api.github.com/users/FlorentD/following{/other_user}","gists_url":"https://api.github.com/users/FlorentD/gists{/gist_id}","starred_url":"https://api.github.com/users/FlorentD/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/FlorentD/subscriptions","organizations_url":"https://api.github.com/users/FlorentD/orgs","repos_url":"https://api.github.com/users/FlorentD/repos","events_url":"https://api.github.com/users/FlorentD/events{/privacy}","received_events_url":"https://api.github.com/users/FlorentD/received_events","type":"User","site_admin":false}],"requested_teams":[],"labels":[{"id":393748337,"node_id":"MDU6TGFiZWwzOTM3NDgzMzc=","url":"https://api.github.com/repos/KissKissBankBank/kitten/labels/Work%20in%20progress%20:construction:","name":"Work in progress :construction:","color":"d93f0b","default":false}],"milestone":null,"commits_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419/commits","review_comments_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419/comments","review_comment_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/comments{/number}","comments_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/1419/comments","statuses_url":"https://api.github.com/repos/KissKissBankBank/kitten/statuses/0d8088b2b35a0ab4d051e3cdec101b30985d71f2","head":{"label":"KissKissBankBank:layout/improve-marger","ref":"layout/improve-marger","sha":"0d8088b2b35a0ab4d051e3cdec101b30985d71f2","user":{"login":"KissKissBankBank","id":6039709,"node_id":"MDEyOk9yZ2FuaXphdGlvbjYwMzk3MDk=","avatar_url":"https://avatars1.githubusercontent.com/u/6039709?v=4","gravatar_id":"","url":"https://api.github.com/users/KissKissBankBank","html_url":"https://github.com/KissKissBankBank","followers_url":"https://api.github.com/users/KissKissBankBank/followers","following_url":"https://api.github.com/users/KissKissBankBank/following{/other_user}","gists_url":"https://api.github.com/users/KissKissBankBank/gists{/gist_id}","starred_url":"https://api.github.com/users/KissKissBankBank/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KissKissBankBank/subscriptions","organizations_url":"https://api.github.com/users/KissKissBankBank/orgs","repos_url":"https://api.github.com/users/KissKissBankBank/repos","events_url":"https://api.github.com/users/KissKissBankBank/events{/privacy}","received_events_url":"https://api.github.com/users/KissKissBankBank/received_events","type":"Organization","site_admin":false},"repo":{"id":61292012,"node_id":"MDEwOlJlcG9zaXRvcnk2MTI5MjAxMg==","name":"kitten","full_name":"KissKissBankBank/kitten","private":false,"owner":{"login":"KissKissBankBank","id":6039709,"node_id":"MDEyOk9yZ2FuaXphdGlvbjYwMzk3MDk=","avatar_url":"https://avatars1.githubusercontent.com/u/6039709?v=4","gravatar_id":"","url":"https://api.github.com/users/KissKissBankBank","html_url":"https://github.com/KissKissBankBank","followers_url":"https://api.github.com/users/KissKissBankBank/followers","following_url":"https://api.github.com/users/KissKissBankBank/following{/other_user}","gists_url":"https://api.github.com/users/KissKissBankBank/gists{/gist_id}","starred_url":"https://api.github.com/users/KissKissBankBank/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KissKissBankBank/subscriptions","organizations_url":"https://api.github.com/users/KissKissBankBank/orgs","repos_url":"https://api.github.com/users/KissKissBankBank/repos","events_url":"https://api.github.com/users/KissKissBankBank/events{/privacy}","received_events_url":"https://api.github.com/users/KissKissBankBank/received_events","type":"Organization","site_admin":false},"html_url":"https://github.com/KissKissBankBank/kitten","description":"KissKissBankBank's front-end components library","fork":false,"url":"https://api.github.com/repos/KissKissBankBank/kitten","forks_url":"https://api.github.com/repos/KissKissBankBank/kitten/forks","keys_url":"https://api.github.com/repos/KissKissBankBank/kitten/keys{/key_id}","collaborators_url":"https://api.github.com/repos/KissKissBankBank/kitten/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/KissKissBankBank/kitten/teams","hooks_url":"https://api.github.com/repos/KissKissBankBank/kitten/hooks","issue_events_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/events{/number}","events_url":"https://api.github.com/repos/KissKissBankBank/kitten/events","assignees_url":"https://api.github.com/repos/KissKissBankBank/kitten/assignees{/user}","branches_url":"https://api.github.com/repos/KissKissBankBank/kitten/branches{/branch}","tags_url":"https://api.github.com/repos/KissKissBankBank/kitten/tags","blobs_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/refs{/sha}","trees_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/trees{/sha}","statuses_url":"https://api.github.com/repos/KissKissBankBank/kitten/statuses/{sha}","languages_url":"https://api.github.com/repos/KissKissBankBank/kitten/languages","stargazers_url":"https://api.github.com/repos/KissKissBankBank/kitten/stargazers","contributors_url":"https://api.github.com/repos/KissKissBankBank/kitten/contributors","subscribers_url":"https://api.github.com/repos/KissKissBankBank/kitten/subscribers","subscription_url":"https://api.github.com/repos/KissKissBankBank/kitten/subscription","commits_url":"https://api.github.com/repos/KissKissBankBank/kitten/commits{/sha}","git_commits_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/commits{/sha}","comments_url":"https://api.github.com/repos/KissKissBankBank/kitten/comments{/number}","issue_comment_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/comments{/number}","contents_url":"https://api.github.com/repos/KissKissBankBank/kitten/contents/{+path}","compare_url":"https://api.github.com/repos/KissKissBankBank/kitten/compare/{base}...{head}","merges_url":"https://api.github.com/repos/KissKissBankBank/kitten/merges","archive_url":"https://api.github.com/repos/KissKissBankBank/kitten/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/KissKissBankBank/kitten/downloads","issues_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues{/number}","pulls_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls{/number}","milestones_url":"https://api.github.com/repos/KissKissBankBank/kitten/milestones{/number}","notifications_url":"https://api.github.com/repos/KissKissBankBank/kitten/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/KissKissBankBank/kitten/labels{/name}","releases_url":"https://api.github.com/repos/KissKissBankBank/kitten/releases{/id}","deployments_url":"https://api.github.com/repos/KissKissBankBank/kitten/deployments","created_at":"2016-06-16T12:46:14Z","updated_at":"2018-11-28T15:30:07Z","pushed_at":"2018-11-28T15:46:15Z","git_url":"git://github.com/KissKissBankBank/kitten.git","ssh_url":"git@github.com:KissKissBankBank/kitten.git","clone_url":"https://github.com/KissKissBankBank/kitten.git","svn_url":"https://github.com/KissKissBankBank/kitten","homepage":"https://styleguide.kisskissbankbank.com","size":8175,"stargazers_count":29,"watchers_count":29,"language":"HTML","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":3,"mirror_url":null,"archived":false,"open_issues_count":92,"license":{"key":"mit","name":"MIT License","spdx_id":"MIT","url":"https://api.github.com/licenses/mit","node_id":"MDc6TGljZW5zZTEz"},"forks":3,"open_issues":92,"watchers":29,"default_branch":"master"}},"base":{"label":"KissKissBankBank:master","ref":"master","sha":"dfa5a43d1ed20ed2c8a8a44dce7b3026b95ef53d","user":{"login":"KissKissBankBank","id":6039709,"node_id":"MDEyOk9yZ2FuaXphdGlvbjYwMzk3MDk=","avatar_url":"https://avatars1.githubusercontent.com/u/6039709?v=4","gravatar_id":"","url":"https://api.github.com/users/KissKissBankBank","html_url":"https://github.com/KissKissBankBank","followers_url":"https://api.github.com/users/KissKissBankBank/followers","following_url":"https://api.github.com/users/KissKissBankBank/following{/other_user}","gists_url":"https://api.github.com/users/KissKissBankBank/gists{/gist_id}","starred_url":"https://api.github.com/users/KissKissBankBank/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KissKissBankBank/subscriptions","organizations_url":"https://api.github.com/users/KissKissBankBank/orgs","repos_url":"https://api.github.com/users/KissKissBankBank/repos","events_url":"https://api.github.com/users/KissKissBankBank/events{/privacy}","received_events_url":"https://api.github.com/users/KissKissBankBank/received_events","type":"Organization","site_admin":false},"repo":{"id":61292012,"node_id":"MDEwOlJlcG9zaXRvcnk2MTI5MjAxMg==","name":"kitten","full_name":"KissKissBankBank/kitten","private":false,"owner":{"login":"KissKissBankBank","id":6039709,"node_id":"MDEyOk9yZ2FuaXphdGlvbjYwMzk3MDk=","avatar_url":"https://avatars1.githubusercontent.com/u/6039709?v=4","gravatar_id":"","url":"https://api.github.com/users/KissKissBankBank","html_url":"https://github.com/KissKissBankBank","followers_url":"https://api.github.com/users/KissKissBankBank/followers","following_url":"https://api.github.com/users/KissKissBankBank/following{/other_user}","gists_url":"https://api.github.com/users/KissKissBankBank/gists{/gist_id}","starred_url":"https://api.github.com/users/KissKissBankBank/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KissKissBankBank/subscriptions","organizations_url":"https://api.github.com/users/KissKissBankBank/orgs","repos_url":"https://api.github.com/users/KissKissBankBank/repos","events_url":"https://api.github.com/users/KissKissBankBank/events{/privacy}","received_events_url":"https://api.github.com/users/KissKissBankBank/received_events","type":"Organization","site_admin":false},"html_url":"https://github.com/KissKissBankBank/kitten","description":"KissKissBankBank's front-end components library","fork":false,"url":"https://api.github.com/repos/KissKissBankBank/kitten","forks_url":"https://api.github.com/repos/KissKissBankBank/kitten/forks","keys_url":"https://api.github.com/repos/KissKissBankBank/kitten/keys{/key_id}","collaborators_url":"https://api.github.com/repos/KissKissBankBank/kitten/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/KissKissBankBank/kitten/teams","hooks_url":"https://api.github.com/repos/KissKissBankBank/kitten/hooks","issue_events_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/events{/number}","events_url":"https://api.github.com/repos/KissKissBankBank/kitten/events","assignees_url":"https://api.github.com/repos/KissKissBankBank/kitten/assignees{/user}","branches_url":"https://api.github.com/repos/KissKissBankBank/kitten/branches{/branch}","tags_url":"https://api.github.com/repos/KissKissBankBank/kitten/tags","blobs_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/refs{/sha}","trees_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/trees{/sha}","statuses_url":"https://api.github.com/repos/KissKissBankBank/kitten/statuses/{sha}","languages_url":"https://api.github.com/repos/KissKissBankBank/kitten/languages","stargazers_url":"https://api.github.com/repos/KissKissBankBank/kitten/stargazers","contributors_url":"https://api.github.com/repos/KissKissBankBank/kitten/contributors","subscribers_url":"https://api.github.com/repos/KissKissBankBank/kitten/subscribers","subscription_url":"https://api.github.com/repos/KissKissBankBank/kitten/subscription","commits_url":"https://api.github.com/repos/KissKissBankBank/kitten/commits{/sha}","git_commits_url":"https://api.github.com/repos/KissKissBankBank/kitten/git/commits{/sha}","comments_url":"https://api.github.com/repos/KissKissBankBank/kitten/comments{/number}","issue_comment_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues/comments{/number}","contents_url":"https://api.github.com/repos/KissKissBankBank/kitten/contents/{+path}","compare_url":"https://api.github.com/repos/KissKissBankBank/kitten/compare/{base}...{head}","merges_url":"https://api.github.com/repos/KissKissBankBank/kitten/merges","archive_url":"https://api.github.com/repos/KissKissBankBank/kitten/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/KissKissBankBank/kitten/downloads","issues_url":"https://api.github.com/repos/KissKissBankBank/kitten/issues{/number}","pulls_url":"https://api.github.com/repos/KissKissBankBank/kitten/pulls{/number}","milestones_url":"https://api.github.com/repos/KissKissBankBank/kitten/milestones{/number}","notifications_url":"https://api.github.com/repos/KissKissBankBank/kitten/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/KissKissBankBank/kitten/labels{/name}","releases_url":"https://api.github.com/repos/KissKissBankBank/kitten/releases{/id}","deployments_url":"https://api.github.com/repos/KissKissBankBank/kitten/deployments","created_at":"2016-06-16T12:46:14Z","updated_at":"2018-11-28T15:30:07Z","pushed_at":"2018-11-28T15:46:15Z","git_url":"git://github.com/KissKissBankBank/kitten.git","ssh_url":"git@github.com:KissKissBankBank/kitten.git","clone_url":"https://github.com/KissKissBankBank/kitten.git","svn_url":"https://github.com/KissKissBankBank/kitten","homepage":"https://styleguide.kisskissbankbank.com","size":8175,"stargazers_count":29,"watchers_count":29,"language":"HTML","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":3,"mirror_url":null,"archived":false,"open_issues_count":92,"license":{"key":"mit","name":"MIT License","spdx_id":"MIT","url":"https://api.github.com/licenses/mit","node_id":"MDc6TGljZW5zZTEz"},"forks":3,"open_issues":92,"watchers":29,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419"},"html":{"href":"https://github.com/KissKissBankBank/kitten/pull/1419"},"issue":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/issues/1419"},"comments":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/issues/1419/comments"},"review_comments":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419/comments"},"review_comment":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/pulls/1419/commits"},"statuses":{"href":"https://api.github.com/repos/KissKissBankBank/kitten/statuses/0d8088b2b35a0ab4d051e3cdec101b30985d71f2"}},"author_association":"CONTRIBUTOR"}}
{"actor":{"display_login":"Ynote"}}