{"action":"reopened","issue":{"url":"https://api.github.com/repos/driftyco/ionic/issues/3329","labels_url":"https://api.github.com/repos/driftyco/ionic/issues/3329/labels{/name}","comments_url":"https://api.github.com/repos/driftyco/ionic/issues/3329/comments","events_url":"https://api.github.com/repos/driftyco/ionic/issues/3329/events","html_url":"https://github.com/driftyco/ionic/issues/3329","id":62033187,"number":3329,"title":"bug: [with solution] iOS header bar bar-positive background overlaps the system top bar","user":{"login":"Zorgatone","id":2664036,"avatar_url":"https://avatars.githubusercontent.com/u/2664036?v=3","gravatar_id":"","url":"https://api.github.com/users/Zorgatone","html_url":"https://github.com/Zorgatone","followers_url":"https://api.github.com/users/Zorgatone/followers","following_url":"https://api.github.com/users/Zorgatone/following{/other_user}","gists_url":"https://api.github.com/users/Zorgatone/gists{/gist_id}","starred_url":"https://api.github.com/users/Zorgatone/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Zorgatone/subscriptions","organizations_url":"https://api.github.com/users/Zorgatone/orgs","repos_url":"https://api.github.com/users/Zorgatone/repos","events_url":"https://api.github.com/users/Zorgatone/events{/privacy}","received_events_url":"https://api.github.com/users/Zorgatone/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-03-16T10:08:22Z","updated_at":"2015-03-16T10:10:48Z","closed_at":null,"body":"**Type**: <span ionic-type>bug</span>\n\n**Platform**: <span ionic-platform>ios</span> <span ionic-platform-version>8</span>  <span ionic-webview>webview</span>\n\n<span ionic-description>I've been trying to use different header bars for my modals with ionic.\r\nFrom what I've seen on iOS (need testing on other devices) the header bar is behind the system top bar, which is transparent. That means that if I have header bar with a different background I will see the system top bar with a color different from the system one (which imo shouldn't be changed).\r\n\r\nI made a quick-fix including a conditional css just for iOS, which sets a filler background-image with repeat-x to force the system bar default color, and allowing the ionic header-bar to be with a different background color.\r\n\r\nmy bad JS (should be possible to add it when building the app):\r\n```\r\n(function (d, s) {\r\n    var css, link = d.getElementsByTagName(s);\r\n    link = link[link.length - 1];\r\n    if(window.device && window.device.platform && window.device.platform === 'iOS') {\r\n        console.log('^_^');\r\n        css = d.createElement(s);\r\n        css.href = \"css/iOS.css\";\r\n        css.rel = \"stylesheet\";\r\n        link.parentNode.insertBefore(css, link.nextSibling);\r\n    }\r\n}(document, 'link'));\r\n```\r\n\r\nCSS:\r\n```\r\n.bar.bar-header {\r\n    background-image: url(\"../img/filler.gif\") !important;\r\n    background-repeat: repeat-x !important;\r\n    background-position: right top !important;\r\n}\r\n```</span>\n\n<span is-issue-template></span>\n"}}