Default to transparent title bar (--title-bar-style hidden / hiddenInset) on macOS

[sirpooya]

• I looked at nativefier --help and https://github.com/jiahaog/nativefier/blob/master/docs/api.md , no existing option fits my needs.
• I searched existing issues, open & closed. Yes, my feature request is new.
• I'm using the latest version available at https://github.com/jiahaog/nativefier/releases

Problem statement
After Build, the App has the default OS Titlebar which is not bad, but It would be much better to be transparent & merge with whole window.

Suggested solution
The is an electron app built in Flotato app which transparents the default Titlebar.

Context

• Nativefier: 10.1.0
• Node.js: v14.5.0
• Npm: 6.14.5
• OS: macOS X Catalina 10.15.4

[ronjouch]

@sirpooya from the initial title of your issue, I'm not entirely sure if you don't know this is already supported (see api docs / --title-bar-style), or if you do and what you're asking for is to change the defaults.

I like the idea, but I don't have a Mac to fiddle with it and see how it behaves. I'll happily merge a PR checking these three boxes:

1. Should we use hidden or hiddenInset or hiddenInset or customButtonsOnHover ? (Electron docs)
2. How do we make sure the window remains draggable, always, regardless of the website? Our api docs (written by the implementer of --title-bar-style) notes you need custom, site-specific CSS for that. Do we really?

And once these are clear,

3. Identify a dozen Nativefier Mac active users (look at macos-tagged issues and see commenters) and @mention them asking for their feedback and potential undesirable side-effects

[Aiyush-G]

Hi @sirpooya did you get it to work? If so how?

Cheers

[FranzTscharf]

I think this can be cloes due to:

nativefier --name "Google" https://google.com --title-bar-style 'hiddenInset' --inject ./style.css

style.css content:
`
body {
-webkit-app-region: drag;
}

/* make class elements draggable */
.aside-brand-wrapper {
-webkit-app-region: drag;
padding-top: 5px;
}

div#kt_header {
-webkit-app-region: drag;
}

/* make element with ID not draggable */
div#kt_aside_menu_wrapper {
-webkit-app-region: no-drag!important;
}

div#kt_content {
-webkit-app-region: no-drag!important;
}

`