{"action":"created","comment":{"url":"https://api.github.com/repos/sky-uk/toolkit/pulls/comments/131130759","pull_request_review_id":54080410,"id":131130759,"diff_hunk":"@@ -51,16 +60,19 @@\n    * Transitions include the card moving up and the shadow increasing.\n    *\n    * For efficiencies sake, we use a pseudo element to create the shadow and its effect.\n+   *\n+   * 1. This is the offset value that moves the card up on hover.\n+   * 2. This brings the whole shadow spread into view to keep a 3D effect.\n    */\n-\n-  &:focus, &:hover {\n-    top: -6px;\n+  @include hocus {\n+    top: -6px; /* [1] */\n+    border-color: #dfdfdf;\n \n     &::after {\n-      width: 90%;\n-      margin-left: -45%;\n-      box-shadow: 0 9px 20px 0 rgba(0, 0, 0, 0.3);\n-      bottom: 0;\n+      width: $card-shadow-width-expanded;\n+      margin-left: -$card-shadow-width-expanded / 2;","path":"packages/sky-toolkit-ui/components/_card.scss","position":null,"original_position":94,"commit_id":"2b746950f596d3e2215166b80f8425f8b22260d8","original_commit_id":"bc7fb05971aeb2613db113a4ed75376d50a6db8c","user":{"login":"joebell93","id":7349341,"avatar_url":"https://avatars3.githubusercontent.com/u/7349341?v=4","gravatar_id":"","url":"https://api.github.com/users/joebell93","html_url":"https://github.com/joebell93","followers_url":"https://api.github.com/users/joebell93/followers","following_url":"https://api.github.com/users/joebell93/following{/other_user}","gists_url":"https://api.github.com/users/joebell93/gists{/gist_id}","starred_url":"https://api.github.com/users/joebell93/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/joebell93/subscriptions","organizations_url":"https://api.github.com/users/joebell93/orgs","repos_url":"https://api.github.com/users/joebell93/repos","events_url":"https://api.github.com/users/joebell93/events{/privacy}","received_events_url":"https://api.github.com/users/joebell93/received_events","type":"User","site_admin":false},"body":"Could this just to center align?","created_at":"2017-08-03T12:46:40Z","updated_at":"2017-08-03T12:46:40Z","html_url":"https://github.com/sky-uk/toolkit/pull/263#discussion_r131130759","pull_request_url":"https://api.github.com/repos/sky-uk/toolkit/pulls/263","_links":{"self":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/comments/131130759"},"html":{"href":"https://github.com/sky-uk/toolkit/pull/263#discussion_r131130759"},"pull_request":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/263"}}},"pull_request":{"url":"https://api.github.com/repos/sky-uk/toolkit/pulls/263","id":133479709,"html_url":"https://github.com/sky-uk/toolkit/pull/263","diff_url":"https://github.com/sky-uk/toolkit/pull/263.diff","patch_url":"https://github.com/sky-uk/toolkit/pull/263.patch","issue_url":"https://api.github.com/repos/sky-uk/toolkit/issues/263","number":263,"state":"open","locked":false,"title":"[Feature] - Card Component","user":{"login":"StefanMcCready","id":14904083,"avatar_url":"https://avatars0.githubusercontent.com/u/14904083?v=4","gravatar_id":"","url":"https://api.github.com/users/StefanMcCready","html_url":"https://github.com/StefanMcCready","followers_url":"https://api.github.com/users/StefanMcCready/followers","following_url":"https://api.github.com/users/StefanMcCready/following{/other_user}","gists_url":"https://api.github.com/users/StefanMcCready/gists{/gist_id}","starred_url":"https://api.github.com/users/StefanMcCready/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/StefanMcCready/subscriptions","organizations_url":"https://api.github.com/users/StefanMcCready/orgs","repos_url":"https://api.github.com/users/StefanMcCready/repos","events_url":"https://api.github.com/users/StefanMcCready/events{/privacy}","received_events_url":"https://api.github.com/users/StefanMcCready/received_events","type":"User","site_admin":false},"body":"## Description\r\n\r\nThis PR has been created to add the newly designed global Card styles into Toolkit. To put it simply its a container class that will apply some styles as shown in the anatomy diagram below:\r\n\r\n![screen shot 2017-08-01 at 14 51 27](https://user-images.githubusercontent.com/14904083/28828514-ed921d4e-76c8-11e7-95ae-a1e1c071e7f7.png)\r\n\r\nYou will then be allowed to put whatever content you want within the container and its size will adjust to what you put inside. Example below:\r\n\r\n![screen shot 2017-08-01 at 14 50 49](https://user-images.githubusercontent.com/14904083/28828563-0a2cf320-76c9-11e7-8f12-245598d22577.png)\r\n\r\n## Related Issue\r\n\r\nhttps://github.com/sky-uk/toolkit/issues/262\r\n\r\n## Motivation and Context\r\n\r\nWithin Shop we are currently in the process of redesigning how we show products. It is a desire to have an identical design across the board to give a consistent look and feel. The plan is for certain apps within service that will want to use this component as well. Below is a diagram detailing the anatomy of the card:\r\n\r\n## How Has This Been Tested?\r\nThese styles have been used in a local build of Sky Mobile sales for two weeks and have been seen to work effectively\r\n\r\n\r\n## Markup\r\n```\r\n    <button class=\"c-card\">\r\n        <p>You can place whatever content in here</p>\r\n    </button>\r\n```\r\n\r\n\r\n## Screenshots\r\n<!-- If appropriate, please provide screenshots. -->\r\n\r\n\r\n## Types of Changes\r\n\r\nWhat types of changes does your code introduce? Put an `x` in all the boxes that apply:\r\n\r\n- [ ] Bug fix (non-breaking change which fixes an issue)\r\n- [x] New feature (non-breaking change which adds functionality)\r\n- [ ] Breaking change (fix or feature that would cause existing functionality to change)\r\n\r\n## Browser Support\r\n\r\n- [x] Chrome\r\n- [x] Edge\r\n- [x] Firefox\r\n- [x] IE9\r\n- [x] IE10\r\n- [x] IE11\r\n- [x] Opera\r\n- [x] Safari\r\n- [x] Mobile Devices\r\n- [x] Screen-readers (e.g. JAWS, Apple VoiceOver)\r\n\r\n## Checklist\r\n\r\n- [ ] All code includes full inline documentation (as per the [template](https://github.com/sky-uk/toolkit/blob/master/_template.scss)).\r\n- [ ] All code conforms to the Toolkit [coding style](https://github.com/sky-uk/toolkit/wiki/Coding-Style).\r\n- [ ] All code conforms to [WCAG 2.0 level AA Accessibility Guidelines](https://www.w3.org/TR/WCAG20/).\r\n- [ ] New functions and mixins have appropriate tests.\r\n- [ ] All new and existing tests passed.\r\n- [ ] I have added instructions on how to test my changes.\r\n- [ ] Package version updated.\r\n- [ ] CHANGELOG.md updated.\r\n","created_at":"2017-08-01T13:56:49Z","updated_at":"2017-08-03T12:46:40Z","closed_at":null,"merged_at":null,"merge_commit_sha":"fda07cd179cc5f75289c7b06009dc1cea082edee","assignee":null,"assignees":[],"requested_reviewers":[],"milestone":null,"commits_url":"https://api.github.com/repos/sky-uk/toolkit/pulls/263/commits","review_comments_url":"https://api.github.com/repos/sky-uk/toolkit/pulls/263/comments","review_comment_url":"https://api.github.com/repos/sky-uk/toolkit/pulls/comments{/number}","comments_url":"https://api.github.com/repos/sky-uk/toolkit/issues/263/comments","statuses_url":"https://api.github.com/repos/sky-uk/toolkit/statuses/2b746950f596d3e2215166b80f8425f8b22260d8","head":{"label":"sky-uk:tkt-262","ref":"tkt-262","sha":"2b746950f596d3e2215166b80f8425f8b22260d8","user":{"login":"sky-uk","id":1391938,"avatar_url":"https://avatars1.githubusercontent.com/u/1391938?v=4","gravatar_id":"","url":"https://api.github.com/users/sky-uk","html_url":"https://github.com/sky-uk","followers_url":"https://api.github.com/users/sky-uk/followers","following_url":"https://api.github.com/users/sky-uk/following{/other_user}","gists_url":"https://api.github.com/users/sky-uk/gists{/gist_id}","starred_url":"https://api.github.com/users/sky-uk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sky-uk/subscriptions","organizations_url":"https://api.github.com/users/sky-uk/orgs","repos_url":"https://api.github.com/users/sky-uk/repos","events_url":"https://api.github.com/users/sky-uk/events{/privacy}","received_events_url":"https://api.github.com/users/sky-uk/received_events","type":"Organization","site_admin":false},"repo":{"id":51140534,"name":"toolkit","full_name":"sky-uk/toolkit","owner":{"login":"sky-uk","id":1391938,"avatar_url":"https://avatars1.githubusercontent.com/u/1391938?v=4","gravatar_id":"","url":"https://api.github.com/users/sky-uk","html_url":"https://github.com/sky-uk","followers_url":"https://api.github.com/users/sky-uk/followers","following_url":"https://api.github.com/users/sky-uk/following{/other_user}","gists_url":"https://api.github.com/users/sky-uk/gists{/gist_id}","starred_url":"https://api.github.com/users/sky-uk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sky-uk/subscriptions","organizations_url":"https://api.github.com/users/sky-uk/orgs","repos_url":"https://api.github.com/users/sky-uk/repos","events_url":"https://api.github.com/users/sky-uk/events{/privacy}","received_events_url":"https://api.github.com/users/sky-uk/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/sky-uk/toolkit","description":"Sky's CSS Toolkit","fork":false,"url":"https://api.github.com/repos/sky-uk/toolkit","forks_url":"https://api.github.com/repos/sky-uk/toolkit/forks","keys_url":"https://api.github.com/repos/sky-uk/toolkit/keys{/key_id}","collaborators_url":"https://api.github.com/repos/sky-uk/toolkit/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/sky-uk/toolkit/teams","hooks_url":"https://api.github.com/repos/sky-uk/toolkit/hooks","issue_events_url":"https://api.github.com/repos/sky-uk/toolkit/issues/events{/number}","events_url":"https://api.github.com/repos/sky-uk/toolkit/events","assignees_url":"https://api.github.com/repos/sky-uk/toolkit/assignees{/user}","branches_url":"https://api.github.com/repos/sky-uk/toolkit/branches{/branch}","tags_url":"https://api.github.com/repos/sky-uk/toolkit/tags","blobs_url":"https://api.github.com/repos/sky-uk/toolkit/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/sky-uk/toolkit/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/sky-uk/toolkit/git/refs{/sha}","trees_url":"https://api.github.com/repos/sky-uk/toolkit/git/trees{/sha}","statuses_url":"https://api.github.com/repos/sky-uk/toolkit/statuses/{sha}","languages_url":"https://api.github.com/repos/sky-uk/toolkit/languages","stargazers_url":"https://api.github.com/repos/sky-uk/toolkit/stargazers","contributors_url":"https://api.github.com/repos/sky-uk/toolkit/contributors","subscribers_url":"https://api.github.com/repos/sky-uk/toolkit/subscribers","subscription_url":"https://api.github.com/repos/sky-uk/toolkit/subscription","commits_url":"https://api.github.com/repos/sky-uk/toolkit/commits{/sha}","git_commits_url":"https://api.github.com/repos/sky-uk/toolkit/git/commits{/sha}","comments_url":"https://api.github.com/repos/sky-uk/toolkit/comments{/number}","issue_comment_url":"https://api.github.com/repos/sky-uk/toolkit/issues/comments{/number}","contents_url":"https://api.github.com/repos/sky-uk/toolkit/contents/{+path}","compare_url":"https://api.github.com/repos/sky-uk/toolkit/compare/{base}...{head}","merges_url":"https://api.github.com/repos/sky-uk/toolkit/merges","archive_url":"https://api.github.com/repos/sky-uk/toolkit/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/sky-uk/toolkit/downloads","issues_url":"https://api.github.com/repos/sky-uk/toolkit/issues{/number}","pulls_url":"https://api.github.com/repos/sky-uk/toolkit/pulls{/number}","milestones_url":"https://api.github.com/repos/sky-uk/toolkit/milestones{/number}","notifications_url":"https://api.github.com/repos/sky-uk/toolkit/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/sky-uk/toolkit/labels{/name}","releases_url":"https://api.github.com/repos/sky-uk/toolkit/releases{/id}","deployments_url":"https://api.github.com/repos/sky-uk/toolkit/deployments","created_at":"2016-02-05T10:35:04Z","updated_at":"2017-08-02T09:36:30Z","pushed_at":"2017-08-03T11:17:20Z","git_url":"git://github.com/sky-uk/toolkit.git","ssh_url":"git@github.com:sky-uk/toolkit.git","clone_url":"https://github.com/sky-uk/toolkit.git","svn_url":"https://github.com/sky-uk/toolkit","homepage":"http://sky.com/toolkit","size":1120,"stargazers_count":68,"watchers_count":68,"language":"CSS","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":3,"mirror_url":null,"open_issues_count":23,"forks":3,"open_issues":23,"watchers":68,"default_branch":"develop"}},"base":{"label":"sky-uk:develop","ref":"develop","sha":"bc602099a7aafa56396ac0a15e50bc8665d2ca12","user":{"login":"sky-uk","id":1391938,"avatar_url":"https://avatars1.githubusercontent.com/u/1391938?v=4","gravatar_id":"","url":"https://api.github.com/users/sky-uk","html_url":"https://github.com/sky-uk","followers_url":"https://api.github.com/users/sky-uk/followers","following_url":"https://api.github.com/users/sky-uk/following{/other_user}","gists_url":"https://api.github.com/users/sky-uk/gists{/gist_id}","starred_url":"https://api.github.com/users/sky-uk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sky-uk/subscriptions","organizations_url":"https://api.github.com/users/sky-uk/orgs","repos_url":"https://api.github.com/users/sky-uk/repos","events_url":"https://api.github.com/users/sky-uk/events{/privacy}","received_events_url":"https://api.github.com/users/sky-uk/received_events","type":"Organization","site_admin":false},"repo":{"id":51140534,"name":"toolkit","full_name":"sky-uk/toolkit","owner":{"login":"sky-uk","id":1391938,"avatar_url":"https://avatars1.githubusercontent.com/u/1391938?v=4","gravatar_id":"","url":"https://api.github.com/users/sky-uk","html_url":"https://github.com/sky-uk","followers_url":"https://api.github.com/users/sky-uk/followers","following_url":"https://api.github.com/users/sky-uk/following{/other_user}","gists_url":"https://api.github.com/users/sky-uk/gists{/gist_id}","starred_url":"https://api.github.com/users/sky-uk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sky-uk/subscriptions","organizations_url":"https://api.github.com/users/sky-uk/orgs","repos_url":"https://api.github.com/users/sky-uk/repos","events_url":"https://api.github.com/users/sky-uk/events{/privacy}","received_events_url":"https://api.github.com/users/sky-uk/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/sky-uk/toolkit","description":"Sky's CSS Toolkit","fork":false,"url":"https://api.github.com/repos/sky-uk/toolkit","forks_url":"https://api.github.com/repos/sky-uk/toolkit/forks","keys_url":"https://api.github.com/repos/sky-uk/toolkit/keys{/key_id}","collaborators_url":"https://api.github.com/repos/sky-uk/toolkit/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/sky-uk/toolkit/teams","hooks_url":"https://api.github.com/repos/sky-uk/toolkit/hooks","issue_events_url":"https://api.github.com/repos/sky-uk/toolkit/issues/events{/number}","events_url":"https://api.github.com/repos/sky-uk/toolkit/events","assignees_url":"https://api.github.com/repos/sky-uk/toolkit/assignees{/user}","branches_url":"https://api.github.com/repos/sky-uk/toolkit/branches{/branch}","tags_url":"https://api.github.com/repos/sky-uk/toolkit/tags","blobs_url":"https://api.github.com/repos/sky-uk/toolkit/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/sky-uk/toolkit/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/sky-uk/toolkit/git/refs{/sha}","trees_url":"https://api.github.com/repos/sky-uk/toolkit/git/trees{/sha}","statuses_url":"https://api.github.com/repos/sky-uk/toolkit/statuses/{sha}","languages_url":"https://api.github.com/repos/sky-uk/toolkit/languages","stargazers_url":"https://api.github.com/repos/sky-uk/toolkit/stargazers","contributors_url":"https://api.github.com/repos/sky-uk/toolkit/contributors","subscribers_url":"https://api.github.com/repos/sky-uk/toolkit/subscribers","subscription_url":"https://api.github.com/repos/sky-uk/toolkit/subscription","commits_url":"https://api.github.com/repos/sky-uk/toolkit/commits{/sha}","git_commits_url":"https://api.github.com/repos/sky-uk/toolkit/git/commits{/sha}","comments_url":"https://api.github.com/repos/sky-uk/toolkit/comments{/number}","issue_comment_url":"https://api.github.com/repos/sky-uk/toolkit/issues/comments{/number}","contents_url":"https://api.github.com/repos/sky-uk/toolkit/contents/{+path}","compare_url":"https://api.github.com/repos/sky-uk/toolkit/compare/{base}...{head}","merges_url":"https://api.github.com/repos/sky-uk/toolkit/merges","archive_url":"https://api.github.com/repos/sky-uk/toolkit/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/sky-uk/toolkit/downloads","issues_url":"https://api.github.com/repos/sky-uk/toolkit/issues{/number}","pulls_url":"https://api.github.com/repos/sky-uk/toolkit/pulls{/number}","milestones_url":"https://api.github.com/repos/sky-uk/toolkit/milestones{/number}","notifications_url":"https://api.github.com/repos/sky-uk/toolkit/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/sky-uk/toolkit/labels{/name}","releases_url":"https://api.github.com/repos/sky-uk/toolkit/releases{/id}","deployments_url":"https://api.github.com/repos/sky-uk/toolkit/deployments","created_at":"2016-02-05T10:35:04Z","updated_at":"2017-08-02T09:36:30Z","pushed_at":"2017-08-03T11:17:20Z","git_url":"git://github.com/sky-uk/toolkit.git","ssh_url":"git@github.com:sky-uk/toolkit.git","clone_url":"https://github.com/sky-uk/toolkit.git","svn_url":"https://github.com/sky-uk/toolkit","homepage":"http://sky.com/toolkit","size":1120,"stargazers_count":68,"watchers_count":68,"language":"CSS","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":3,"mirror_url":null,"open_issues_count":23,"forks":3,"open_issues":23,"watchers":68,"default_branch":"develop"}},"_links":{"self":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/263"},"html":{"href":"https://github.com/sky-uk/toolkit/pull/263"},"issue":{"href":"https://api.github.com/repos/sky-uk/toolkit/issues/263"},"comments":{"href":"https://api.github.com/repos/sky-uk/toolkit/issues/263/comments"},"review_comments":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/263/comments"},"review_comment":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/sky-uk/toolkit/pulls/263/commits"},"statuses":{"href":"https://api.github.com/repos/sky-uk/toolkit/statuses/2b746950f596d3e2215166b80f8425f8b22260d8"}}}}
{"actor":{"display_login":"joebell93"}}