{"action":"created","issue":{"url":"https://api.github.com/repos/thoughtbot/neat/issues/502","repository_url":"https://api.github.com/repos/thoughtbot/neat","labels_url":"https://api.github.com/repos/thoughtbot/neat/issues/502/labels{/name}","comments_url":"https://api.github.com/repos/thoughtbot/neat/issues/502/comments","events_url":"https://api.github.com/repos/thoughtbot/neat/issues/502/events","html_url":"https://github.com/thoughtbot/neat/issues/502","id":181630512,"number":502,"title":"I want to use omega(3n+1), but Neat disallows this. What's the alternative?","user":{"login":"xaliber","id":22586164,"avatar_url":"https://avatars.githubusercontent.com/u/22586164?v=3","gravatar_id":"","url":"https://api.github.com/users/xaliber","html_url":"https://github.com/xaliber","followers_url":"https://api.github.com/users/xaliber/followers","following_url":"https://api.github.com/users/xaliber/following{/other_user}","gists_url":"https://api.github.com/users/xaliber/gists{/gist_id}","starred_url":"https://api.github.com/users/xaliber/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/xaliber/subscriptions","organizations_url":"https://api.github.com/users/xaliber/orgs","repos_url":"https://api.github.com/users/xaliber/repos","events_url":"https://api.github.com/users/xaliber/events{/privacy}","received_events_url":"https://api.github.com/users/xaliber/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":13,"created_at":"2016-10-07T10:04:49Z","updated_at":"2016-10-24T03:58:18Z","closed_at":null,"body":"My first div spans 12 columns while the next divs only spans 3 columns. Something like this:\r\n\r\nhttp://i.stack.imgur.com/t8XRP.png\r\n\r\nSo I thought having omega(3n+1) to select the third div after the first one would be manageable. Turns out, as it's said in Neat documentation, composite argument such as 3n+1 is not supported.\r\n\r\nI have tried `div:first-of-type ~ div { @include omega (3n); }` to select the third occurrence after the first div, but to no avail.\r\n\r\nAny idea what's the alternative?"},"comment":{"url":"https://api.github.com/repos/thoughtbot/neat/issues/comments/255643325","html_url":"https://github.com/thoughtbot/neat/issues/502#issuecomment-255643325","issue_url":"https://api.github.com/repos/thoughtbot/neat/issues/502","id":255643325,"user":{"login":"nickngqs","id":3901903,"avatar_url":"https://avatars.githubusercontent.com/u/3901903?v=3","gravatar_id":"","url":"https://api.github.com/users/nickngqs","html_url":"https://github.com/nickngqs","followers_url":"https://api.github.com/users/nickngqs/followers","following_url":"https://api.github.com/users/nickngqs/following{/other_user}","gists_url":"https://api.github.com/users/nickngqs/gists{/gist_id}","starred_url":"https://api.github.com/users/nickngqs/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nickngqs/subscriptions","organizations_url":"https://api.github.com/users/nickngqs/orgs","repos_url":"https://api.github.com/users/nickngqs/repos","events_url":"https://api.github.com/users/nickngqs/events{/privacy}","received_events_url":"https://api.github.com/users/nickngqs/received_events","type":"User","site_admin":false},"created_at":"2016-10-24T03:58:18Z","updated_at":"2016-10-24T03:58:18Z","body":"I knew it, thats why I added 'the guys working on Neat' :)\r\n\r\nAnyway, currently I feel the grid-media is pretty underwhelming to use.\r\n\r\nSo right now I do something like this\r\n```\r\n$s-bp  : 544px\r\n$m-bp  : 768px\r\n$l-bp  : 1024px\r\n$xl-bp : 1200px\r\n\r\n$s  : \"(min-width: #{$s-bp}) and (max-width: #{$m-bp - 1px})\"\r\n$m  : \"(min-width: #{$m-bp}) and (max-width: #{$l-bp - 1px})\"\r\n$l  : \"(min-width: #{$l-bp}) and (max-width: #{$xl-bp - 1px})\"\r\n$xl : \"(min-width: #{$xl-bp})\"\r\n\r\n$s-up  : \"(min-width: #{$s-bp})\"\r\n$m-up  : \"(min-width: #{$m-bp})\"\r\n$l-up  : \"(min-width: #{$l-bp})\"\r\n$xl-up : \"(min-width: #{$xl-bp})\"\r\n```\r\n\r\nI then use SASS @media depending on how I need them. I use mobile first approach and work up the screens. So I'll use \r\n\r\n```\r\n@media #{$s-up}\r\n    +grid-column(12)\r\n\r\n@media #{$m-up}\r\n    +grid-column(4)\r\n```\r\n\r\nHowever, with nth-child selectors since if you do the mobile first approach, the nth-selectors will be bring forward to the next breakpoint as well. And then you'll have to keep overriding something like nth-child(2n): margin-bottom: none;\r\n\r\nBut that's bad.\r\n\r\nSo I'll make sure the nth-selectors are only happening within the grid range like this\r\n\r\n```\r\n@media #{$s}\r\n    &:nth-child(2n)\r\n        margin-bottom: 25px\r\n```"}}
{"actor":{"display_login":"nickngqs"}}