{"action":"created","issue":{"url":"https://api.github.com/repos/kenwheeler/slick/issues/1246","labels_url":"https://api.github.com/repos/kenwheeler/slick/issues/1246/labels{/name}","comments_url":"https://api.github.com/repos/kenwheeler/slick/issues/1246/comments","events_url":"https://api.github.com/repos/kenwheeler/slick/issues/1246/events","html_url":"https://github.com/kenwheeler/slick/issues/1246","id":69164118,"number":1246,"title":"Slick 1.4 up and Zurb's Foundation Dots and Arrows","user":{"login":"arielnoname","id":11996305,"avatar_url":"https://avatars.githubusercontent.com/u/11996305?v=3","gravatar_id":"","url":"https://api.github.com/users/arielnoname","html_url":"https://github.com/arielnoname","followers_url":"https://api.github.com/users/arielnoname/followers","following_url":"https://api.github.com/users/arielnoname/following{/other_user}","gists_url":"https://api.github.com/users/arielnoname/gists{/gist_id}","starred_url":"https://api.github.com/users/arielnoname/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/arielnoname/subscriptions","organizations_url":"https://api.github.com/users/arielnoname/orgs","repos_url":"https://api.github.com/users/arielnoname/repos","events_url":"https://api.github.com/users/arielnoname/events{/privacy}","received_events_url":"https://api.github.com/users/arielnoname/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2015-04-17T15:45:21Z","updated_at":"2015-09-21T14:46:58Z","closed_at":null,"body":"From v1.4 and up there's a problem with the CSS rendering DOTS and ARROWS using Zurb's Foundation.\r\n\r\n![screen shot 2015-04-17 at 12 40 34](https://cloud.githubusercontent.com/assets/11996305/7205336/f8b53778-e4fe-11e4-8b68-cb3c6a4966c2.png)\r\n\r\nMy quick fix: using v1.3.13 CSS for arrows and dots:\r\n\r\n```\r\n.slick-slider { margin-bottom: 30px; }\r\n\r\n.slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0; width: 100%; }\r\n.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }\r\n.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; }\r\n.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }\r\n.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }\r\n.slick-dots li button:before { position: absolute; top: 0; left: 0; content: \"•\"; width: 20px; height: 20px; font-family: \"slick\"; font-size: 20px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }\r\n.slick-dots li.slick-active button:before { color: black; opacity: 0.75; }\r\n\r\n\r\n.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px; padding: 0; border: none; outline: none; }\r\n.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }\r\n.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }\r\n.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }\r\n\r\n.slick-prev:before, .slick-next:before { font-family: \"slick\"; font-size: 20px; line-height: 1; color: white; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }\r\n\r\n.slick-prev { left: -25px; }\r\n[dir=\"rtl\"] .slick-prev { left: auto; right: -25px; }\r\n.slick-prev:before { content: \"←\"; }\r\n[dir=\"rtl\"] .slick-prev:before { content: \"→\"; }\r\n\r\n.slick-next { right: -25px; }\r\n[dir=\"rtl\"] .slick-next { left: -25px; right: auto; }\r\n.slick-next:before { content: \"→\"; }\r\n[dir=\"rtl\"] .slick-next:before { content: \"←\"; }\r\n```\r\n\r\n![screen shot 2015-04-17 at 12 44 06](https://cloud.githubusercontent.com/assets/11996305/7205401/7c109202-e4ff-11e4-934a-ede392af56ee.png)\r\n\r\nIn Foundation's site they recommend this slider so I think this is going to be useful to some people.\r\n"},"comment":{"url":"https://api.github.com/repos/kenwheeler/slick/issues/comments/142004314","html_url":"https://github.com/kenwheeler/slick/issues/1246#issuecomment-142004314","issue_url":"https://api.github.com/repos/kenwheeler/slick/issues/1246","id":142004314,"user":{"login":"Groschenroman","id":7312890,"avatar_url":"https://avatars.githubusercontent.com/u/7312890?v=3","gravatar_id":"","url":"https://api.github.com/users/Groschenroman","html_url":"https://github.com/Groschenroman","followers_url":"https://api.github.com/users/Groschenroman/followers","following_url":"https://api.github.com/users/Groschenroman/following{/other_user}","gists_url":"https://api.github.com/users/Groschenroman/gists{/gist_id}","starred_url":"https://api.github.com/users/Groschenroman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Groschenroman/subscriptions","organizations_url":"https://api.github.com/users/Groschenroman/orgs","repos_url":"https://api.github.com/users/Groschenroman/repos","events_url":"https://api.github.com/users/Groschenroman/events{/privacy}","received_events_url":"https://api.github.com/users/Groschenroman/received_events","type":"User","site_admin":false},"created_at":"2015-09-21T14:46:58Z","updated_at":"2015-09-21T14:46:58Z","body":"Yes, still an issue in Foundation 1.5.7 and therefor helpful indeed. Thank you!\r\n"}}