fix CSS conflicts

override `reset.scss` with `title-bar.scss`

5 files changed, 12 insertions, 5 deletions

diff --git a/src/components/layout/AppLayout.js b/src/components/layout/AppLayout.js
index 4f047368a..20fe61092 100644
--- a/src/components/layout/AppLayout.js
+++ b/src/components/layout/AppLayout.js
@@ -89,9 +89,7 @@ export default class AppLayout extends Component {
     return (
       <div>
         <div className="app">
-          <TitleBar menu={window.franz.menu.template}>
-            <link rel="stylesheet" type="text/css" href={require.resolve('electron-react-titlebar/assets/style.css')} />
-          </TitleBar>
+          <TitleBar menu={window.franz.menu.template} icon={'assets/images/logo.svg'} />
           <div className="app__content">
             {sidebar}
             <div className="app__service">
diff --git a/src/index.js b/src/index.js
index f82bb3590..9ba6e0e43 100644
--- a/src/index.js
+++ b/src/index.js
@@ -72,7 +72,7 @@ const createWindow = () => {
     height: mainWindowState.height,
     minWidth: 600,
     minHeight: 500,
-    titleBarStyle: 'hidden',
+    titleBarStyle: process.env.FRANZ_PLATFORM || process.platform === 'win32' ? '' : 'hidden',
     backgroundColor: '#3498db',
     autoHideMenuBar: true,
   });
diff --git a/src/lib/Menu.js b/src/lib/Menu.js
index 0818c94fb..75f2efbea 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.js
@@ -124,7 +124,7 @@ export default class FranzMenu {
     autorun(this._build.bind(this));
   }
 
-  get template() {
+  @computed get template() {
     return toJS(this.tpl);
   }
 
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 446bdca14..388eb2f77 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -4,6 +4,7 @@ $mdi-font-path: '../node_modules/mdi/fonts';
 }
 
 @import './node_modules/mdi/scss/materialdesignicons.scss';
+@import './node_modules/electron-react-titlebar/assets/style.scss';
 
 // modules
 @import './reset.scss';
@@ -28,6 +29,7 @@ $mdi-font-path: '../node_modules/mdi/fonts';
 @import './subscription-popup.scss';
 @import './content-tabs.scss';
 @import './invite.scss';
+@import './title-bar.scss';
 
 // form
 @import './input.scss';
diff --git a/src/styles/title-bar.scss b/src/styles/title-bar.scss
new file mode 100644
index 000000000..67bf97008
--- /dev/null
+++ b/src/styles/title-bar.scss
@@ -0,0 +1,7 @@
+#electron-app-title-bar span {
+  line-height: normal;
+}
+
+#electron-app-title-bar div {
+  height: auto;
+}