[SOLVED] Target navbar using css for specific page in iOS theme F7 v2.0.10

Questions
1

I am using latest version for Framewrok7 i.e v2.0.10 I have design that is tranparent navbar for inner pages in my app.

I have used “data-name” or added custom in page class for MD themes for adding custom css on Navbar. but for iOS theme there is common navbar and there is no any page specific class on above it.

I wants to remove the background, remove the harilines for few pages in iOS theme. also, no-hairline not working for iOS theme.

How can i target iOS theme navbar for specific inner pages?
How can i add data-name attribute in “view” like previous version of Framework7 did.

Capture
Capture.PNG1281×276 38.7 KB

2

You can use page events to assign required class or page name to the view/navbar, e.g.:

app.on('pageBeforeIn', function (e) {
  var page = e.detail;
  $('.view-main').attr('data-name', page.name);
});
1 Like
3

I got it what i want. It’s working !!
Thank you for your response.