{"action":"created","issue":{"url":"https://api.github.com/repos/cozy/cozy-ui/issues/1190","repository_url":"https://api.github.com/repos/cozy/cozy-ui","labels_url":"https://api.github.com/repos/cozy/cozy-ui/issues/1190/labels{/name}","comments_url":"https://api.github.com/repos/cozy/cozy-ui/issues/1190/comments","events_url":"https://api.github.com/repos/cozy/cozy-ui/issues/1190/events","html_url":"https://github.com/cozy/cozy-ui/pull/1190","id":504550079,"node_id":"MDExOlB1bGxSZXF1ZXN0MzI2MTczODI0","number":1190,"title":"Composite row","user":{"login":"ptbrowne","id":465582,"node_id":"MDQ6VXNlcjQ2NTU4Mg==","avatar_url":"https://avatars1.githubusercontent.com/u/465582?v=4","gravatar_id":"","url":"https://api.github.com/users/ptbrowne","html_url":"https://github.com/ptbrowne","followers_url":"https://api.github.com/users/ptbrowne/followers","following_url":"https://api.github.com/users/ptbrowne/following{/other_user}","gists_url":"https://api.github.com/users/ptbrowne/gists{/gist_id}","starred_url":"https://api.github.com/users/ptbrowne/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ptbrowne/subscriptions","organizations_url":"https://api.github.com/users/ptbrowne/orgs","repos_url":"https://api.github.com/users/ptbrowne/repos","events_url":"https://api.github.com/users/ptbrowne/events{/privacy}","received_events_url":"https://api.github.com/users/ptbrowne/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2019-10-09T10:11:24Z","updated_at":"2019-10-14T17:47:42Z","closed_at":null,"author_association":"MEMBER","pull_request":{"url":"https://api.github.com/repos/cozy/cozy-ui/pulls/1190","html_url":"https://github.com/cozy/cozy-ui/pull/1190","diff_url":"https://github.com/cozy/cozy-ui/pull/1190.diff","patch_url":"https://github.com/cozy/cozy-ui/pull/1190.patch"},"body":"Add to styleguide different variants of composite row layouts that Joel has on Sketch/Zeplin.\r\n\r\nVisible on https://ptbrowne.github.io/cozy-ui/react/#/CompositeRow\r\n\r\n\r\n- [x] Montant doit être aligné au milieu avec le Primary/Secondary text\r\n- [x] Icône ne doit pas dépasser du cadre même quand la card est petite\r\n- [x] Sans secondary text, le Primary text doit être aligné au milieu avec l'icône\r\n\r\n~~I find the implementation a bit verbose, I will try to use utility classes instead of Bd/Img/Media to have less nesting.~~ With the help of utility classes, nesting is reduced, see https://github.com/cozy/cozy-ui/pull/1190/commits/4d76fc38209eb98d6b308431563e29de53d4949c\r\n\r\nI also want to gather feedback on the following API: \r\n\r\nProposition of names for the component (with my preference next to it):\r\n\r\n- ComplexRow -\r\n- RichRow +\r\n- InfoRow -\r\n- CompositeRow ++\r\n\r\nProposition of props:\r\n\r\n<p align='center'><img width=\"456\" alt=\"image\" src=\"https://user-images.githubusercontent.com/465582/66564725-f9b09d80-eb60-11e9-945a-022449bc5ec6.png\"></p>\r\n\r\n- I hesitate on \"chips\" since we maybe would want to have another kind of components there, do you have any thoughts on this @joel-costa  ? Alternatives\r\n\r\n  - `chips` - \r\n  - `belowLeft` +\r\n  - `extra` -\r\n  - `belowRight` +\r\n\r\nI think `belowLeft` and `belowRight` are actually better since they are more generic and at the same time, they are more descriptive.\r\n\r\nUtility classes introduced:\r\n\r\n- u-media, u-media-grow, u-media-fixed (Bd -> u-media-grow, Img -> u-media-fixed)\r\n\r\nThis is more flexible than Bd, Img since you can compose classes without introducing more divs\r\n\r\n```patch\r\n <Media>\r\n-  <Bd>\r\n-    <Media>\r\n-    </Media>\r\n-  </Bd>\r\n+  <div class='u-media-grow u-media'>\r\n+  </div>\r\n </Media>\r\n```\r\n\r\n- u-row + variants (like u-stack but horizontal) cc @Crash-- ;)"},"comment":{"url":"https://api.github.com/repos/cozy/cozy-ui/issues/comments/541820898","html_url":"https://github.com/cozy/cozy-ui/pull/1190#issuecomment-541820898","issue_url":"https://api.github.com/repos/cozy/cozy-ui/issues/1190","id":541820898,"node_id":"MDEyOklzc3VlQ29tbWVudDU0MTgyMDg5OA==","user":{"login":"ptbrowne","id":465582,"node_id":"MDQ6VXNlcjQ2NTU4Mg==","avatar_url":"https://avatars1.githubusercontent.com/u/465582?v=4","gravatar_id":"","url":"https://api.github.com/users/ptbrowne","html_url":"https://github.com/ptbrowne","followers_url":"https://api.github.com/users/ptbrowne/followers","following_url":"https://api.github.com/users/ptbrowne/following{/other_user}","gists_url":"https://api.github.com/users/ptbrowne/gists{/gist_id}","starred_url":"https://api.github.com/users/ptbrowne/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ptbrowne/subscriptions","organizations_url":"https://api.github.com/users/ptbrowne/orgs","repos_url":"https://api.github.com/users/ptbrowne/repos","events_url":"https://api.github.com/users/ptbrowne/events{/privacy}","received_events_url":"https://api.github.com/users/ptbrowne/received_events","type":"User","site_admin":false},"created_at":"2019-10-14T17:47:42Z","updated_at":"2019-10-14T17:47:42Z","author_association":"MEMBER","body":"Yes for hardcoded the dot, this is not supposed to be the final API, I did it quick to have feedback ;)"}}
{"actor":{"display_login":"ptbrowne"}}