{"action":"created","issue":{"url":"https://api.github.com/repos/jenius/axis/issues/171","labels_url":"https://api.github.com/repos/jenius/axis/issues/171/labels{/name}","comments_url":"https://api.github.com/repos/jenius/axis/issues/171/comments","events_url":"https://api.github.com/repos/jenius/axis/issues/171/events","html_url":"https://github.com/jenius/axis/issues/171","id":68364585,"number":171,"title":"Feature: Hover Gradient","user":{"login":"abstracthat","id":5805280,"avatar_url":"https://avatars.githubusercontent.com/u/5805280?v=3","gravatar_id":"","url":"https://api.github.com/users/abstracthat","html_url":"https://github.com/abstracthat","followers_url":"https://api.github.com/users/abstracthat/followers","following_url":"https://api.github.com/users/abstracthat/following{/other_user}","gists_url":"https://api.github.com/users/abstracthat/gists{/gist_id}","starred_url":"https://api.github.com/users/abstracthat/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/abstracthat/subscriptions","organizations_url":"https://api.github.com/users/abstracthat/orgs","repos_url":"https://api.github.com/users/abstracthat/repos","events_url":"https://api.github.com/users/abstracthat/events{/privacy}","received_events_url":"https://api.github.com/users/abstracthat/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-04-14T12:57:33Z","updated_at":"2015-04-14T18:24:11Z","closed_at":"2015-04-14T18:24:11Z","body":"This is a handy one I use for buttons a lot. Pass a background color and it sets a gradient (using the Axis gradient mixin) as a background and a stronger gradient as a hover state. You can optionally pass a color for the text and set the the strength of the gradient for each state: normal, hover, active.\r\n\r\nShould this go in `interaction.styl` with the other `hover-*` mixins or in `gradients.styl`?\r\n\r\n```stylus\r\nhover-gradient(background-color, color = #fff, strength = null, hover-strength = 15, active-strength = 5)\r\n  hover-strength = unit(remove-unit(hover-strength), '%')\r\n  active-strength = unit(remove-unit(active-strength), '%')\r\n\r\n  gradient background-color strength\r\n  color color\r\n\r\n  &:hover\r\n    gradient background-color hover-strength\r\n    \r\n  &:active\r\n    gradient background-color active-strength\r\n```"},"comment":{"url":"https://api.github.com/repos/jenius/axis/issues/comments/93007579","html_url":"https://github.com/jenius/axis/issues/171#issuecomment-93007579","issue_url":"https://api.github.com/repos/jenius/axis/issues/171","id":93007579,"user":{"login":"abstracthat","id":5805280,"avatar_url":"https://avatars.githubusercontent.com/u/5805280?v=3","gravatar_id":"","url":"https://api.github.com/users/abstracthat","html_url":"https://github.com/abstracthat","followers_url":"https://api.github.com/users/abstracthat/followers","following_url":"https://api.github.com/users/abstracthat/following{/other_user}","gists_url":"https://api.github.com/users/abstracthat/gists{/gist_id}","starred_url":"https://api.github.com/users/abstracthat/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/abstracthat/subscriptions","organizations_url":"https://api.github.com/users/abstracthat/orgs","repos_url":"https://api.github.com/users/abstracthat/repos","events_url":"https://api.github.com/users/abstracthat/events{/privacy}","received_events_url":"https://api.github.com/users/abstracthat/received_events","type":"User","site_admin":false},"created_at":"2015-04-14T18:24:11Z","updated_at":"2015-04-14T18:24:11Z","body":"Ok, no problem. I don't use the axis buttons as I find I end up overwriting most of the styles. I'll have another look at how you structured glossy-button as I do like the idea of transitioning the background."}}