{"action":"created","comment":{"url":"https://api.github.com/repos/guardian/frontend/pulls/comments/90631475","pull_request_review_id":11150153,"id":90631475,"diff_hunk":"@@ -0,0 +1,196 @@\n+@import '../../icons/video-icons-svg';\n+\n+@mixin hide {\n+    visibility: hidden;\n+    opacity: 0;\n+}\n+\n+@mixin show {\n+    visibility: visible;\n+    opacity: 1;\n+}\n+\n+@mixin fade-in {\n+    @include show;\n+    transition: opacity 1s linear, visibility 0s;\n+}\n+\n+@mixin fade-out {\n+    @include hide;\n+    transition: opacity 1s linear, visibility 1s;\n+}\n+\n+.atom--media--youtube {\n+\tposition: relative;\n+\n+\t.atom--media--youtube--iframe,\n+\t.atom--media--youtube--overlay,\n+\t.atom--media--youtube--placeholder {\n+\t\theight: 100%;\n+        width: 100%;\n+        position: absolute;\n+\t}\n+\n+\t.atom--media--youtube--iframe {\n+\t\ttop: 1px;\n+\n+        &:not(.youtube__video-ready),\n+        &.youtube__video-ended {\n+            ~ .atom--media--youtube--overlay .atom--media--youtube--controls {\n+                 @include hide;\n+            }\n+        }\n+\n+        &.youtube__video-ready:not(.youtube__video-started) {\n+            ~ .atom--media--youtube--overlay .atom--media--youtube--controls {\n+                @include fade-in;    \n+            }\n+        }\n+\n+        &.youtube__video-started:not(.youtube__video-ended) {\n+            ~ .atom--media--youtube--overlay,\n+            ~ .atom--media--youtube--overlay .atom--media--youtube--controls {\n+                @include fade-out;\n+                transition-delay: 500ms;\n+                transition-duration: 500ms;     \n+            }\n+        }\n+\n+        &.youtube__video-ended.youtube__video-started {\n+            ~ .atom--media--youtube--overlay .atom--media--youtube--controls {\n+                @include fade-in;\n+            }\n+        }\n+\t}\n+\n+    .atom--media--youtube--overlay {\n+        pointer-events: none;\n+    }\n+\n+\t.atom--media--youtube--placeholder {\n+\t\tbackground-size: cover;\n+        background-position: 50% 50%;\n+        background-repeat: no-repeat;\n+\t}\n+\n+\t.atom--media--youtube--controls {\n+\t    cursor: pointer;\n+\t    position: absolute;\n+\t    width: 100%;\n+\t    height: 100%;\n+\t    box-sizing: border-box;\n+\t    text-align: center;\n+\n+        .atom--media--youtube--play-button {\n+            // Magic numbers are used here to draw the play arrow and circle as pseudo elements.\n+            @include video-play-button-size($vjs-small-button-size);\n+            position: absolute;\n+            top: 50%;\n+            left: 50%;\n+            transform: translate(-50%, -50%);\n+            transition: transform 300ms cubic-bezier(.25, .46, .45, .94);\n+            user-select: none;\n+            overflow: hidden !important;\n+            display: inline-block;\n+\n+            @include mq(mobileLandscape) {\n+                @include video-play-button-size($vjs-large-button-size);\n+            }\n+\n+            &:before {\n+                @include circular;\n+                @include video-play-button-size($vjs-small-button-size);\n+                content: '';\n+                display: block;\n+                @include mq(mobileLandscape) {\n+                    @include video-play-button-size($vjs-large-button-size);\n+                }\n+                background-color: $media-default;\n+            }\n+\n+            &:after {\n+                content: '';\n+                position: absolute;\n+                top: 50%;\n+                left: 50%;\n+                transform: translate(-40%, -50%);\n+                border-style: solid;\n+                border-width: 1em 0 1em 2.4em;\n+                border-color: transparent transparent transparent $neutral-1;\n+\n+                @include mq(tablet) { // 0 border radius on mobile because stock android has a render bug with it here\n+                    border-radius: .2em;\n+                }\n+            }\n+        }\n+\n+        .atom--media--youtube--control-bar {\n+            position: absolute;\n+            left: 0;\n+            bottom: 0;\n+            width: 100%;\n+            height: 34px;\n+\n+            &::before,\n+            &::after,\n+            .atom--media--youtube--control-bar--content {\n+                position: absolute;\n+                height: 100%;\n+                width: 100%;\n+                left: 0;\n+            }\n+\n+            &::before {\n+                content: '';\n+                opacity: 0.1;\n+                background: #333333;","path":"static/src/stylesheets/module/atoms/_youtube.scss","position":146,"original_position":146,"commit_id":"3bbc554e40daa291470d507d9fe16ee22ff0d60c","original_commit_id":"3bbc554e40daa291470d507d9fe16ee22ff0d60c","user":{"login":"SiAdcock","id":5931528,"avatar_url":"https://avatars.githubusercontent.com/u/5931528?v=3","gravatar_id":"","url":"https://api.github.com/users/SiAdcock","html_url":"https://github.com/SiAdcock","followers_url":"https://api.github.com/users/SiAdcock/followers","following_url":"https://api.github.com/users/SiAdcock/following{/other_user}","gists_url":"https://api.github.com/users/SiAdcock/gists{/gist_id}","starred_url":"https://api.github.com/users/SiAdcock/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SiAdcock/subscriptions","organizations_url":"https://api.github.com/users/SiAdcock/orgs","repos_url":"https://api.github.com/users/SiAdcock/repos","events_url":"https://api.github.com/users/SiAdcock/events{/privacy}","received_events_url":"https://api.github.com/users/SiAdcock/received_events","type":"User","site_admin":false},"body":"Can we use `$neutral-1`?","created_at":"2016-12-02T12:07:54Z","updated_at":"2016-12-02T12:07:54Z","html_url":"https://github.com/guardian/frontend/pull/15193#discussion_r90631475","pull_request_url":"https://api.github.com/repos/guardian/frontend/pulls/15193","_links":{"self":{"href":"https://api.github.com/repos/guardian/frontend/pulls/comments/90631475"},"html":{"href":"https://github.com/guardian/frontend/pull/15193#discussion_r90631475"},"pull_request":{"href":"https://api.github.com/repos/guardian/frontend/pulls/15193"}}},"pull_request":{"url":"https://api.github.com/repos/guardian/frontend/pulls/15193","id":96266313,"html_url":"https://github.com/guardian/frontend/pull/15193","diff_url":"https://github.com/guardian/frontend/pull/15193.diff","patch_url":"https://github.com/guardian/frontend/pull/15193.patch","issue_url":"https://api.github.com/repos/guardian/frontend/issues/15193","number":15193,"state":"open","locked":false,"title":"Add youtube atom placeholder image and play button","user":{"login":"GHaberis","id":1590704,"avatar_url":"https://avatars.githubusercontent.com/u/1590704?v=3","gravatar_id":"","url":"https://api.github.com/users/GHaberis","html_url":"https://github.com/GHaberis","followers_url":"https://api.github.com/users/GHaberis/followers","following_url":"https://api.github.com/users/GHaberis/following{/other_user}","gists_url":"https://api.github.com/users/GHaberis/gists{/gist_id}","starred_url":"https://api.github.com/users/GHaberis/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/GHaberis/subscriptions","organizations_url":"https://api.github.com/users/GHaberis/orgs","repos_url":"https://api.github.com/users/GHaberis/repos","events_url":"https://api.github.com/users/GHaberis/events{/privacy}","received_events_url":"https://api.github.com/users/GHaberis/received_events","type":"User","site_admin":false},"body":"## What does this change?\r\n\r\n- If youtube atom has posterURL show placeholder image/overlay\r\n- fade in button/control bar on video ready\r\n- fade out overlay on video start\r\n- fade in on video end\r\n\r\n## What is the value of this and can you measure success?\r\n\r\n- Adds Guardian styles to initial youtube atom\r\n\r\n## Does this affect other platforms - Amp, Apps, etc?\r\n\r\n- No\r\n\r\n## Screenshots\r\n\r\n![youtube](https://cloud.githubusercontent.com/assets/1590704/20832931/f01c4a38-b884-11e6-84d6-1bcf467fa769.gif)","created_at":"2016-12-02T11:46:48Z","updated_at":"2016-12-02T12:07:54Z","closed_at":null,"merged_at":null,"merge_commit_sha":"da36b1f0fa615709a301d019059bb0e0fb635bf3","assignee":null,"assignees":[],"milestone":null,"commits_url":"https://api.github.com/repos/guardian/frontend/pulls/15193/commits","review_comments_url":"https://api.github.com/repos/guardian/frontend/pulls/15193/comments","review_comment_url":"https://api.github.com/repos/guardian/frontend/pulls/comments{/number}","comments_url":"https://api.github.com/repos/guardian/frontend/issues/15193/comments","statuses_url":"https://api.github.com/repos/guardian/frontend/statuses/3bbc554e40daa291470d507d9fe16ee22ff0d60c","head":{"label":"guardian:gh-youtube-atom-placeholder","ref":"gh-youtube-atom-placeholder","sha":"3bbc554e40daa291470d507d9fe16ee22ff0d60c","user":{"login":"guardian","id":164318,"avatar_url":"https://avatars.githubusercontent.com/u/164318?v=3","gravatar_id":"","url":"https://api.github.com/users/guardian","html_url":"https://github.com/guardian","followers_url":"https://api.github.com/users/guardian/followers","following_url":"https://api.github.com/users/guardian/following{/other_user}","gists_url":"https://api.github.com/users/guardian/gists{/gist_id}","starred_url":"https://api.github.com/users/guardian/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/guardian/subscriptions","organizations_url":"https://api.github.com/users/guardian/orgs","repos_url":"https://api.github.com/users/guardian/repos","events_url":"https://api.github.com/users/guardian/events{/privacy}","received_events_url":"https://api.github.com/users/guardian/received_events","type":"Organization","site_admin":false},"repo":{"id":4370755,"name":"frontend","full_name":"guardian/frontend","owner":{"login":"guardian","id":164318,"avatar_url":"https://avatars.githubusercontent.com/u/164318?v=3","gravatar_id":"","url":"https://api.github.com/users/guardian","html_url":"https://github.com/guardian","followers_url":"https://api.github.com/users/guardian/followers","following_url":"https://api.github.com/users/guardian/following{/other_user}","gists_url":"https://api.github.com/users/guardian/gists{/gist_id}","starred_url":"https://api.github.com/users/guardian/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/guardian/subscriptions","organizations_url":"https://api.github.com/users/guardian/orgs","repos_url":"https://api.github.com/users/guardian/repos","events_url":"https://api.github.com/users/guardian/events{/privacy}","received_events_url":"https://api.github.com/users/guardian/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/guardian/frontend","description":"Source for theguardian.com","fork":false,"url":"https://api.github.com/repos/guardian/frontend","forks_url":"https://api.github.com/repos/guardian/frontend/forks","keys_url":"https://api.github.com/repos/guardian/frontend/keys{/key_id}","collaborators_url":"https://api.github.com/repos/guardian/frontend/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/guardian/frontend/teams","hooks_url":"https://api.github.com/repos/guardian/frontend/hooks","issue_events_url":"https://api.github.com/repos/guardian/frontend/issues/events{/number}","events_url":"https://api.github.com/repos/guardian/frontend/events","assignees_url":"https://api.github.com/repos/guardian/frontend/assignees{/user}","branches_url":"https://api.github.com/repos/guardian/frontend/branches{/branch}","tags_url":"https://api.github.com/repos/guardian/frontend/tags","blobs_url":"https://api.github.com/repos/guardian/frontend/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/guardian/frontend/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/guardian/frontend/git/refs{/sha}","trees_url":"https://api.github.com/repos/guardian/frontend/git/trees{/sha}","statuses_url":"https://api.github.com/repos/guardian/frontend/statuses/{sha}","languages_url":"https://api.github.com/repos/guardian/frontend/languages","stargazers_url":"https://api.github.com/repos/guardian/frontend/stargazers","contributors_url":"https://api.github.com/repos/guardian/frontend/contributors","subscribers_url":"https://api.github.com/repos/guardian/frontend/subscribers","subscription_url":"https://api.github.com/repos/guardian/frontend/subscription","commits_url":"https://api.github.com/repos/guardian/frontend/commits{/sha}","git_commits_url":"https://api.github.com/repos/guardian/frontend/git/commits{/sha}","comments_url":"https://api.github.com/repos/guardian/frontend/comments{/number}","issue_comment_url":"https://api.github.com/repos/guardian/frontend/issues/comments{/number}","contents_url":"https://api.github.com/repos/guardian/frontend/contents/{+path}","compare_url":"https://api.github.com/repos/guardian/frontend/compare/{base}...{head}","merges_url":"https://api.github.com/repos/guardian/frontend/merges","archive_url":"https://api.github.com/repos/guardian/frontend/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/guardian/frontend/downloads","issues_url":"https://api.github.com/repos/guardian/frontend/issues{/number}","pulls_url":"https://api.github.com/repos/guardian/frontend/pulls{/number}","milestones_url":"https://api.github.com/repos/guardian/frontend/milestones{/number}","notifications_url":"https://api.github.com/repos/guardian/frontend/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/guardian/frontend/labels{/name}","releases_url":"https://api.github.com/repos/guardian/frontend/releases{/id}","deployments_url":"https://api.github.com/repos/guardian/frontend/deployments","created_at":"2012-05-18T15:39:15Z","updated_at":"2016-12-02T08:01:58Z","pushed_at":"2016-12-02T12:02:13Z","git_url":"git://github.com/guardian/frontend.git","ssh_url":"git@github.com:guardian/frontend.git","clone_url":"https://github.com/guardian/frontend.git","svn_url":"https://github.com/guardian/frontend","homepage":"http://www.theguardian.com","size":555468,"stargazers_count":3425,"watchers_count":3425,"language":"HTML","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":365,"mirror_url":null,"open_issues_count":58,"forks":365,"open_issues":58,"watchers":3425,"default_branch":"master"}},"base":{"label":"guardian:master","ref":"master","sha":"2e9406411413be0df5a0c5f53003efb2887b0ff4","user":{"login":"guardian","id":164318,"avatar_url":"https://avatars.githubusercontent.com/u/164318?v=3","gravatar_id":"","url":"https://api.github.com/users/guardian","html_url":"https://github.com/guardian","followers_url":"https://api.github.com/users/guardian/followers","following_url":"https://api.github.com/users/guardian/following{/other_user}","gists_url":"https://api.github.com/users/guardian/gists{/gist_id}","starred_url":"https://api.github.com/users/guardian/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/guardian/subscriptions","organizations_url":"https://api.github.com/users/guardian/orgs","repos_url":"https://api.github.com/users/guardian/repos","events_url":"https://api.github.com/users/guardian/events{/privacy}","received_events_url":"https://api.github.com/users/guardian/received_events","type":"Organization","site_admin":false},"repo":{"id":4370755,"name":"frontend","full_name":"guardian/frontend","owner":{"login":"guardian","id":164318,"avatar_url":"https://avatars.githubusercontent.com/u/164318?v=3","gravatar_id":"","url":"https://api.github.com/users/guardian","html_url":"https://github.com/guardian","followers_url":"https://api.github.com/users/guardian/followers","following_url":"https://api.github.com/users/guardian/following{/other_user}","gists_url":"https://api.github.com/users/guardian/gists{/gist_id}","starred_url":"https://api.github.com/users/guardian/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/guardian/subscriptions","organizations_url":"https://api.github.com/users/guardian/orgs","repos_url":"https://api.github.com/users/guardian/repos","events_url":"https://api.github.com/users/guardian/events{/privacy}","received_events_url":"https://api.github.com/users/guardian/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/guardian/frontend","description":"Source for theguardian.com","fork":false,"url":"https://api.github.com/repos/guardian/frontend","forks_url":"https://api.github.com/repos/guardian/frontend/forks","keys_url":"https://api.github.com/repos/guardian/frontend/keys{/key_id}","collaborators_url":"https://api.github.com/repos/guardian/frontend/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/guardian/frontend/teams","hooks_url":"https://api.github.com/repos/guardian/frontend/hooks","issue_events_url":"https://api.github.com/repos/guardian/frontend/issues/events{/number}","events_url":"https://api.github.com/repos/guardian/frontend/events","assignees_url":"https://api.github.com/repos/guardian/frontend/assignees{/user}","branches_url":"https://api.github.com/repos/guardian/frontend/branches{/branch}","tags_url":"https://api.github.com/repos/guardian/frontend/tags","blobs_url":"https://api.github.com/repos/guardian/frontend/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/guardian/frontend/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/guardian/frontend/git/refs{/sha}","trees_url":"https://api.github.com/repos/guardian/frontend/git/trees{/sha}","statuses_url":"https://api.github.com/repos/guardian/frontend/statuses/{sha}","languages_url":"https://api.github.com/repos/guardian/frontend/languages","stargazers_url":"https://api.github.com/repos/guardian/frontend/stargazers","contributors_url":"https://api.github.com/repos/guardian/frontend/contributors","subscribers_url":"https://api.github.com/repos/guardian/frontend/subscribers","subscription_url":"https://api.github.com/repos/guardian/frontend/subscription","commits_url":"https://api.github.com/repos/guardian/frontend/commits{/sha}","git_commits_url":"https://api.github.com/repos/guardian/frontend/git/commits{/sha}","comments_url":"https://api.github.com/repos/guardian/frontend/comments{/number}","issue_comment_url":"https://api.github.com/repos/guardian/frontend/issues/comments{/number}","contents_url":"https://api.github.com/repos/guardian/frontend/contents/{+path}","compare_url":"https://api.github.com/repos/guardian/frontend/compare/{base}...{head}","merges_url":"https://api.github.com/repos/guardian/frontend/merges","archive_url":"https://api.github.com/repos/guardian/frontend/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/guardian/frontend/downloads","issues_url":"https://api.github.com/repos/guardian/frontend/issues{/number}","pulls_url":"https://api.github.com/repos/guardian/frontend/pulls{/number}","milestones_url":"https://api.github.com/repos/guardian/frontend/milestones{/number}","notifications_url":"https://api.github.com/repos/guardian/frontend/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/guardian/frontend/labels{/name}","releases_url":"https://api.github.com/repos/guardian/frontend/releases{/id}","deployments_url":"https://api.github.com/repos/guardian/frontend/deployments","created_at":"2012-05-18T15:39:15Z","updated_at":"2016-12-02T08:01:58Z","pushed_at":"2016-12-02T12:02:13Z","git_url":"git://github.com/guardian/frontend.git","ssh_url":"git@github.com:guardian/frontend.git","clone_url":"https://github.com/guardian/frontend.git","svn_url":"https://github.com/guardian/frontend","homepage":"http://www.theguardian.com","size":555468,"stargazers_count":3425,"watchers_count":3425,"language":"HTML","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":365,"mirror_url":null,"open_issues_count":58,"forks":365,"open_issues":58,"watchers":3425,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/guardian/frontend/pulls/15193"},"html":{"href":"https://github.com/guardian/frontend/pull/15193"},"issue":{"href":"https://api.github.com/repos/guardian/frontend/issues/15193"},"comments":{"href":"https://api.github.com/repos/guardian/frontend/issues/15193/comments"},"review_comments":{"href":"https://api.github.com/repos/guardian/frontend/pulls/15193/comments"},"review_comment":{"href":"https://api.github.com/repos/guardian/frontend/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/guardian/frontend/pulls/15193/commits"},"statuses":{"href":"https://api.github.com/repos/guardian/frontend/statuses/3bbc554e40daa291470d507d9fe16ee22ff0d60c"}}}}
{"actor":{"display_login":"SiAdcock"}}