{"action":"created","issue":{"url":"https://api.github.com/repos/aslansky/css-sprite/issues/44","labels_url":"https://api.github.com/repos/aslansky/css-sprite/issues/44/labels{/name}","comments_url":"https://api.github.com/repos/aslansky/css-sprite/issues/44/comments","events_url":"https://api.github.com/repos/aslansky/css-sprite/issues/44/events","html_url":"https://github.com/aslansky/css-sprite/issues/44","id":56202805,"number":44,"title":"SCSS generated doesn't generate \"concrete\" sprite classes","user":{"login":"bguiz","id":1773785,"avatar_url":"https://avatars.githubusercontent.com/u/1773785?v=3","gravatar_id":"","url":"https://api.github.com/users/bguiz","html_url":"https://github.com/bguiz","followers_url":"https://api.github.com/users/bguiz/followers","following_url":"https://api.github.com/users/bguiz/following{/other_user}","gists_url":"https://api.github.com/users/bguiz/gists{/gist_id}","starred_url":"https://api.github.com/users/bguiz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bguiz/subscriptions","organizations_url":"https://api.github.com/users/bguiz/orgs","repos_url":"https://api.github.com/users/bguiz/repos","events_url":"https://api.github.com/users/bguiz/events{/privacy}","received_events_url":"https://api.github.com/users/bguiz/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2015-02-02T07:02:01Z","updated_at":"2015-02-05T09:24:26Z","closed_at":"2015-02-05T09:23:40Z","body":"I could be wrong about this, but the SCSS that is output does not appear to include the actual class names for each of the generates sprites.\r\n\r\nUsing the follwing options (as part of a gulp stream):\r\n\r\n    .pipe(\r\n      cssSprite.stream({\r\n        name: 'sprite',\r\n        style: '_sprite.scss',\r\n        processor: 'scss',\r\n        cssPath: 'build/sprite/',\r\n        // \"generate both retina and standard sprites. src images have to be in retina resolution\"\r\n        retina: true,\r\n        orientation: 'binary-tree',\r\n      })\r\n    )\r\n\r\nThe following files do get generated correctly within 'build/sprite':\r\n\r\n    sprite@2x.png  sprite.png  _sprite.scss\r\n\r\nHowever, the contents of `_sprite.sccs` is as follows:\r\n\r\n    $main-logo: -2px -2px 200px 100px;\r\n    $js-logo: -2px -107px 200px 100px;\r\n\r\n    @mixin sprite-width($sprite) {\r\n      width: nth($sprite, 3);\r\n    }\r\n\r\n    @mixin sprite-height($sprite) {\r\n      height: nth($sprite, 4);\r\n    }\r\n\r\n    @function sprite-width($sprite) {\r\n      @return nth($sprite, 3);\r\n    }\r\n\r\n    @function sprite-height($sprite) {\r\n      @return nth($sprite, 4);\r\n    }\r\n\r\n    @mixin sprite-position($sprite) {\r\n      $sprite-offset-x: nth($sprite, 1);\r\n      $sprite-offset-y: nth($sprite, 2);\r\n      background-position: $sprite-offset-x  $sprite-offset-y;\r\n    }\r\n\r\n    @mixin sprite($sprite) {\r\n      @include sprite-position($sprite);\r\n      background-repeat: no-repeat;\r\n      overflow: hidden;\r\n      display: block;\r\n      @include sprite-width($sprite);\r\n      @include sprite-height($sprite);\r\n    }\r\n\r\n    .icon {\r\n      background-image: url('app-build/sprite/sprite.png');\r\n    }\r\n\r\n    @media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {\r\n      .icon {\r\n        background-image: url('app-build/sprite/sprite@2x.png');\r\n        background-size: 410px 210px;\r\n      }\r\n    }\r\n\r\nIt appears that the required mixins and functions are all in place, however the onlty \"instantiated\" or \"concrete\" CSS classes generated are:\r\n\r\n- `.icon`, and\r\n- `@media ... .icon`\r\n\r\nThe dimension variables that were defined right up the top, `$main-logo` and `$js-logo` have not been used in any of the mixins or functions to generate actual classes.\r\n\r\nIn the *usage* section for SCSS, we have the instrucrtions:\r\n\r\n    @import 'sprite'; // the generated style file (sprite.scss)\r\n\r\n    // camera icon (camera.png in src directory)\r\n    .icon-camera {\r\n      @include sprite($camera);\r\n    }\r\n\r\n    // cart icon (cart.png in src directory)\r\n    .icon-cart {\r\n      @include sprite($cart);\r\n    }\r\n\r\nHowever, wouldn't it be easier to simply generate the classes automatically rather than require that they be done by hand?\r\n"},"comment":{"url":"https://api.github.com/repos/aslansky/css-sprite/issues/comments/73016965","html_url":"https://github.com/aslansky/css-sprite/issues/44#issuecomment-73016965","issue_url":"https://api.github.com/repos/aslansky/css-sprite/issues/44","id":73016965,"user":{"login":"bguiz","id":1773785,"avatar_url":"https://avatars.githubusercontent.com/u/1773785?v=3","gravatar_id":"","url":"https://api.github.com/users/bguiz","html_url":"https://github.com/bguiz","followers_url":"https://api.github.com/users/bguiz/followers","following_url":"https://api.github.com/users/bguiz/following{/other_user}","gists_url":"https://api.github.com/users/bguiz/gists{/gist_id}","starred_url":"https://api.github.com/users/bguiz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bguiz/subscriptions","organizations_url":"https://api.github.com/users/bguiz/orgs","repos_url":"https://api.github.com/users/bguiz/repos","events_url":"https://api.github.com/users/bguiz/events{/privacy}","received_events_url":"https://api.github.com/users/bguiz/received_events","type":"User","site_admin":false},"created_at":"2015-02-05T09:24:26Z","updated_at":"2015-02-05T09:24:26Z","body":"Yup, I am aware of that.\n\nThe thing is that I am not sure why that should be the case. Generally I\nwant to have sprite classes generated for every single sprite that is\ninside the output image.\n\nIt is quite a simple addition to the basic template too, like I have done\nhere:\nhttps://github.com/bguiz/node-angularity/blob/feature/sprites/tasks/sprites.scss.mustache#L51-L53\n\nI know I can always create a custom template, just think that this should\nbe the default behaviour.\n\nW: http://bguiz.com\n\nOn 5 February 2015 at 20:23, Alexander Slansky <notifications@github.com>\nwrote:\n\n> Or you could also create your own template for generating scss. Have a\n> look at the templates that come with css-sprite in lib/templates.\n>\n> —\n> Reply to this email directly or view it on GitHub\n> <https://github.com/aslansky/css-sprite/issues/44#issuecomment-73016854>.\n>\n"}}