diff --git a/config/titleBarStyles.css b/config/titleBarStyles.css
index 9d441b855..06ab86378 100644
--- a/config/titleBarStyles.css
+++ b/config/titleBarStyles.css
@@ -1,4 +1,3 @@
-
/*---
title: Tile bar
section: div
@@ -13,20 +12,20 @@ Typically you'll want to set background-image: url(""); and background-size: cov
*/
#title-bar {
- display: flex;
- position: fixed;
- background: rgba(74,74,74,1);
- top: 0;
- left: 0;
- width: 100%;
- height: 32px;
- padding-left: 0;
- justify-content: center;
- align-items: center;
- -webkit-app-region: drag;
- -webkit-user-select: none;
- box-sizing: content-box;
- z-index: 1000;
+ display: flex;
+ position: fixed;
+ background: rgba(74, 74, 74, 1);
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 32px;
+ padding-left: 0;
+ justify-content: center;
+ align-items: center;
+ -webkit-app-region: drag;
+ -webkit-user-select: none;
+ box-sizing: content-box;
+ z-index: 1000;
}
/*---
@@ -59,96 +58,101 @@ Typically you'll want to set content: url("") and adjust the width property
```
*/
.branding-logo {
- height: 32px;
+ height: 32px;
}
.hamburger-menu-button {
- color: rgba(255,255,255,1);
- text-align: center;
- width: 40px;
- height: 32px;
- background: center;
- border: none;
- border-image: initial;
- display: inline-grid;
- border-radius: 0;
- padding: 11px;
- box-sizing: border-box;
- cursor: default;
+ color: rgba(255, 255, 255, 1);
+ text-align: center;
+ width: 40px;
+ height: 32px;
+ background: center;
+ border: none;
+ border-image: initial;
+ display: inline-grid;
+ border-radius: 0;
+ padding: 11px;
+ box-sizing: border-box;
+ cursor: default;
}
.hamburger-menu-button:focus {
- outline: none;
+ outline: none;
}
.title-container {
- height: 32px;
- flex: 1;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- white-space: nowrap;
- overflow: hidden;
+ height: 32px;
+ flex: 1;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ white-space: nowrap;
+ overflow: hidden;
+}
+
+.symphony-messaging-logo {
+ width: 20px;
+ height: 20px;
}
#title-bar-title {
- font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
- color: white;
- margin: 0;
- padding-left: 10px;
- font-size: 13px;
+ font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
+ color: white;
+ margin: 0;
+ padding-left: 10px;
+ font-size: 13px;
}
.title-bar-button-container {
- justify-content: center;
- align-items: center;
- right: 0;
- color: rgba(255,255,255,1);
- -webkit-app-region: no-drag;
- text-align: center;
- width: 45px;
- height: 32px;
- margin: 0;
- box-sizing: border-box !important;
- cursor: default;
+ justify-content: center;
+ align-items: center;
+ right: 0;
+ color: rgba(255, 255, 255, 1);
+ -webkit-app-region: no-drag;
+ text-align: center;
+ width: 45px;
+ height: 32px;
+ margin: 0;
+ box-sizing: border-box !important;
+ cursor: default;
}
.title-bar-button {
- color: rgba(255,255,255,1);
- text-align: center;
- width: 45px;
- height: 32px;
- background: center;
- border: none;
- border-image: initial;
- display: inline-grid;
- border-radius: 0;
- padding: 10px 15px;
- cursor: default;
- align-content: center;
+ color: rgba(255, 255, 255, 1);
+ text-align: center;
+ width: 45px;
+ height: 32px;
+ background: center;
+ border: none;
+ border-image: initial;
+ display: inline-grid;
+ border-radius: 0;
+ padding: 10px 15px;
+ cursor: default;
+ align-content: center;
}
.title-bar-button:hover {
- background-color: rgba(255,255,255,0.2);
+ background-color: rgba(255, 255, 255, 0.2);
}
.title-bar-button:focus {
- outline: none;
+ outline: none;
}
.title-bar-button-container:hover {
- background-color: rgba(255,255,255,0.2);
+ background-color: rgba(255, 255, 255, 0.2);
}
.window-border {
- border-left: 1px solid rgba(74,74,74,1);
- border-right: 1px solid rgba(74,74,74,1);
+ border-left: 1px solid rgba(74, 74, 74, 1);
+ border-right: 1px solid rgba(74, 74, 74, 1);
}
.bottom-window-border {
- position: fixed;
- border-bottom: 1px solid rgba(74,74,74,1);
- width: 100%;
- z-index: 3000;
- bottom: 0;
+ position: fixed;
+ border-bottom: 1px solid rgba(74, 74, 74, 1);
+ width: 100%;
+ z-index: 3000;
+ bottom: 0;
}
diff --git a/images/icon.ico b/images/icon.ico
index f93720cb3..70c8b5136 100644
Binary files a/images/icon.ico and b/images/icon.ico differ
diff --git a/package-lock.json b/package-lock.json
index 99e511fba..f468e3a22 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -43,7 +43,7 @@
"cheerio": "v1.0.0-rc.12",
"cross-env": "7.0.3",
"del": "3.0.0",
- "electron": "33.3.0",
+ "electron": "34.0.0",
"electron-builder": "^24.13.2",
"electron-devtools-installer": "^3.2.0",
"electron-icon-maker": "0.0.5",
@@ -6442,9 +6442,9 @@
}
},
"node_modules/electron": {
- "version": "33.3.0",
- "resolved": "https://repo.symphony.com/artifactory/api/npm/npm-virtual-dev/electron/-/electron-33.3.0.tgz",
- "integrity": "sha512-316ZlFUHJmzGrhRj87tVStxyYvknDqVR9eYSsGKAHY7auhVWFLIcPPGxcnbD/H1mez8CpDjXvEjcz76zpWxsXw==",
+ "version": "34.0.0",
+ "resolved": "https://repo.symphony.com/artifactory/api/npm/npm-virtual-dev/electron/-/electron-34.0.0.tgz",
+ "integrity": "sha512-fpaPb0lifoUJ6UJa4Lk8/0B2Ku/xDZWdc1Gkj67jbygTCrvSon0qquju6Ltx1Kz23GRqqlIHXiy9EvrjpY7/Wg==",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
diff --git a/package.json b/package.json
index e4e420db4..8b55a9273 100644
--- a/package.json
+++ b/package.json
@@ -186,7 +186,7 @@
"cheerio": "v1.0.0-rc.12",
"cross-env": "7.0.3",
"del": "3.0.0",
- "electron": "33.3.0",
+ "electron": "34.0.0",
"electron-builder": "^24.13.2",
"electron-devtools-installer": "^3.2.0",
"electron-icon-maker": "0.0.5",
diff --git a/spec/__snapshots__/windowsTitleBar.spec.ts.snap b/spec/__snapshots__/windowsTitleBar.spec.ts.snap
index b6b95e99e..efc5c9615 100644
--- a/spec/__snapshots__/windowsTitleBar.spec.ts.snap
+++ b/spec/__snapshots__/windowsTitleBar.spec.ts.snap
@@ -43,44 +43,15 @@ exports[`windows title bar should render correctly 1`] = `
-
+
- Symphony
+ Symphony Messaging
{
constructor(props) {
super(props);
this.state = {
- title: document.title || 'Symphony',
+ title: document.title || i18n.t('Symphony Messaging')(),
isMaximized: false,
isDisabled: false,
};
@@ -55,7 +55,7 @@ export default class WindowsTitleBar extends React.Component<{}, IState> {
this.observer = new MutationObserver((mutations) => {
const title: string = mutations[0].target.textContent
? mutations[0].target.textContent
- : 'Symphony';
+ : i18n.t('Symphony Messaging')();
this.setState({ title });
});
if (target) {
@@ -118,7 +118,11 @@ export default class WindowsTitleBar extends React.Component<{}, IState> {
- {this.getSymphonyLogo()}
+
{title}
@@ -279,37 +283,6 @@ export default class WindowsTitleBar extends React.Component<{}, IState> {
document.body.classList.add('window-border');
}
- /**
- * Returns the title bar logo
- */
- private getSymphonyLogo(): JSX.Element {
- return (
-
- );
- }
-
/**
* Disables context menu for action buttons
*
diff --git a/src/renderer/styles/windows-title-bar.less b/src/renderer/styles/windows-title-bar.less
index ace701515..eee6bde4f 100644
--- a/src/renderer/styles/windows-title-bar.less
+++ b/src/renderer/styles/windows-title-bar.less
@@ -50,6 +50,11 @@
overflow: hidden;
}
+.symphony-messaging-logo {
+ width: 20px;
+ height: 20px;
+}
+
#title-bar-title {
font-family: @font-family;
color: @color_2;