{"action":"created","issue":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/2828","labels_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/2828/labels{/name}","comments_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/2828/comments","events_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/2828/events","html_url":"https://github.com/code-dot-org/code-dot-org/pull/2828","id":89081513,"number":2828,"title":"Applab: Header button styles","user":{"login":"islemaster","id":1615761,"avatar_url":"https://avatars.githubusercontent.com/u/1615761?v=3","gravatar_id":"","url":"https://api.github.com/users/islemaster","html_url":"https://github.com/islemaster","followers_url":"https://api.github.com/users/islemaster/followers","following_url":"https://api.github.com/users/islemaster/following{/other_user}","gists_url":"https://api.github.com/users/islemaster/gists{/gist_id}","starred_url":"https://api.github.com/users/islemaster/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/islemaster/subscriptions","organizations_url":"https://api.github.com/users/islemaster/orgs","repos_url":"https://api.github.com/users/islemaster/repos","events_url":"https://api.github.com/users/islemaster/events{/privacy}","received_events_url":"https://api.github.com/users/islemaster/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-06-17T17:51:14Z","updated_at":"2015-06-17T18:28:09Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/pulls/2828","html_url":"https://github.com/code-dot-org/code-dot-org/pull/2828","diff_url":"https://github.com/code-dot-org/code-dot-org/pull/2828.diff","patch_url":"https://github.com/code-dot-org/code-dot-org/pull/2828.patch"},"body":"The \"Start Over\" and \"Show Code\" buttons get a design overhaul!\r\n\r\n![screenshot from 2015-06-17 10 38 16](https://cloud.githubusercontent.com/assets/1615761/8214303/298f3fac-14dd-11e5-84e9-478c5aed9e3a.png)\r\n\r\nIn AppLab we've changed \"Show Code\" to \"Show Text,\" since both the blocks and text are kinds of code.  They look more like buttons now and have associated icons.  Here's the mockup for comparison:\r\n\r\n![new_buttons_mockup](https://cloud.githubusercontent.com/assets/1615761/8214360/85b53570-14dd-11e5-921c-42ce85e7f3fa.png)\r\n\r\nClicking the \"Show Text\" button changes it to a \"Show Blocks\" button with its own icon.\r\n\r\n![screenshot from 2015-06-17 10 38 37](https://cloud.githubusercontent.com/assets/1615761/8214372/9e62de88-14dd-11e5-8005-5ac964411b54.png)\r\n\r\nThis button change is retroactive to our blockly tutorials as well; for those, we've left the \"Show Code\" text as-is.\r\n\r\n![screenshot from 2015-06-17 10 39 25](https://cloud.githubusercontent.com/assets/1615761/8214395/c5d86bfe-14dd-11e5-9b40-12c09942fbd2.png)\r\n\r\nThe buttons still have the rollover colors they had before this PR:\r\n\r\n![new_buttons_rollover_colors](https://cloud.githubusercontent.com/assets/1615761/8214435/1128eb1a-14de-11e5-9b2a-73c681d3248f.png)\r\n\r\nWe went back and forth about the </> icon for \"Show Text\" for quite a while, since we're not actually teaching any markup and it's a little bit of a misrepresentation (for the record, that is the fa-code icon for font-awesome).  We tried curly braces but the at a glance it just looked a bit like a circle:\r\n\r\n![show_code_test_01](https://cloud.githubusercontent.com/assets/1615761/8214496/9957bf84-14de-11e5-9e7b-439054a6dd65.png)\r\n\r\nBrendan suggested we use something like the \"Show Blocks\" icon but with twice as many lines - when we tried something similar it looked like the letter \"E\" at a glance, but we could give that another shot if people are really unhappy with </>"},"comment":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/comments/112904798","html_url":"https://github.com/code-dot-org/code-dot-org/pull/2828#issuecomment-112904798","issue_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/2828","id":112904798,"user":{"login":"breville","id":2205926,"avatar_url":"https://avatars.githubusercontent.com/u/2205926?v=3","gravatar_id":"","url":"https://api.github.com/users/breville","html_url":"https://github.com/breville","followers_url":"https://api.github.com/users/breville/followers","following_url":"https://api.github.com/users/breville/following{/other_user}","gists_url":"https://api.github.com/users/breville/gists{/gist_id}","starred_url":"https://api.github.com/users/breville/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/breville/subscriptions","organizations_url":"https://api.github.com/users/breville/orgs","repos_url":"https://api.github.com/users/breville/repos","events_url":"https://api.github.com/users/breville/events{/privacy}","received_events_url":"https://api.github.com/users/breville/received_events","type":"User","site_admin":false},"created_at":"2015-06-17T18:28:09Z","updated_at":"2015-06-17T18:28:09Z","body":"nice use of sass variables.  lgtm."}}