From 12457d47a337cd413d044bc77fde544048c60857 Mon Sep 17 00:00:00 2001 From: Josh Perez Date: Thu, 5 Mar 2020 13:24:51 -0800 Subject: [PATCH] Move to new logo and primary blue color --- about.html | 4 ++-- background.html | 11 ++++----- images/icon_1024.png | Bin 58297 -> 83798 bytes images/icon_128.png | Bin 7053 -> 19070 bytes images/icon_16.png | Bin 621 -> 1239 bytes images/icon_250.png | Bin 14921 -> 51882 bytes images/icon_256.png | Bin 19254 -> 46083 bytes images/icon_32.png | Bin 1333 -> 2717 bytes images/icon_48.png | Bin 2115 -> 4864 bytes images/signal-logo.svg | 1 + index.html | 3 +-- main.js | 12 +++++----- stylesheets/_global.scss | 2 +- stylesheets/_modules.scss | 45 ++++++++++++++++++++++++++++++++---- stylesheets/_variables.scss | 6 ++++- test/index.html | 8 +++---- 16 files changed, 66 insertions(+), 26 deletions(-) create mode 100644 images/signal-logo.svg diff --git a/about.html b/about.html index 23e7a54ad..f910de355 100644 --- a/about.html +++ b/about.html @@ -18,7 +18,7 @@ - +
diff --git a/background.html b/background.html index 2b6e6aebc..fc1eb480b 100644 --- a/background.html +++ b/background.html @@ -20,7 +20,6 @@ style-src 'self' 'unsafe-inline';" > Signal - @@ -31,7 +30,7 @@
- +
diff --git a/main.js b/main.js index 6b4487881..f47f5ebfc 100644 --- a/main.js +++ b/main.js @@ -249,7 +249,7 @@ function createWindow() { backgroundColor: config.environment === 'test' || config.environment === 'test-lib' ? '#ffffff' // Tests should always be rendered on a white background - : '#2090EA', + : '#3a76f0', vibrancy: 'appearance-based', webPreferences: { nodeIntegration: false, @@ -494,7 +494,7 @@ function showAbout() { resizable: false, title: locale.messages.aboutSignalDesktop.message, autoHideMenuBar: true, - backgroundColor: '#2090EA', + backgroundColor: '#3a76f0', show: false, vibrancy: 'appearance-based', webPreferences: { @@ -542,7 +542,7 @@ async function showSettingsWindow() { resizable: false, title: locale.messages.signalDesktopPreferences.message, autoHideMenuBar: true, - backgroundColor: '#2090EA', + backgroundColor: '#3a76f0', show: false, modal: true, vibrancy: 'appearance-based', @@ -612,7 +612,7 @@ async function showStickerCreator() { height: 650, title: locale.messages.signalDesktopStickerCreator, autoHideMenuBar: true, - backgroundColor: '#2090EA', + backgroundColor: '#3a76f0', show: false, webPreferences: { nodeIntegration: false, @@ -662,7 +662,7 @@ async function showDebugLogWindow() { resizable: false, title: locale.messages.debugLog.message, autoHideMenuBar: true, - backgroundColor: '#2090EA', + backgroundColor: '#3a76f0', show: false, modal: true, vibrancy: 'appearance-based', @@ -711,7 +711,7 @@ async function showPermissionsPopupWindow() { resizable: false, title: locale.messages.allowAccess.message, autoHideMenuBar: true, - backgroundColor: '#2090EA', + backgroundColor: '#3a76f0', show: false, modal: true, vibrancy: 'appearance-based', diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss index 7484ac81a..0ed9be471 100644 --- a/stylesheets/_global.scss +++ b/stylesheets/_global.scss @@ -314,7 +314,7 @@ $loading-height: 16px; right: 0; top: 0; bottom: 0; - background-color: $color-signal-blue; + background-color: $color-ultramarine-brand-light; color: $color-white; display: flex; align-items: center; diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss index 97cc1a239..e9a7d0e6c 100644 --- a/stylesheets/_modules.scss +++ b/stylesheets/_modules.scss @@ -1,5 +1,34 @@ // Using BEM syntax explained here: https://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/ +.module-splash-screen__logo { + @include color-svg('../images/signal-logo.svg', $color-white); + margin: 24px auto; + + &.module-img--256 { + height: 256px; + width: 256px; + } + + &.module-img--200 { + height: 200px; + width: 200px; + } + + &.module-img--150 { + height: 150px; + width: 150px; + } + + &.module-img--128 { + height: 128px; + width: 128px; + } + + &.module-logo-blue { + background-color: $color-ultramarine-brand-light; + } +} + // Module: Contact Name .module-contact-name__profile-name { @@ -342,11 +371,11 @@ background-color: $color-gray-75; } @include ios-theme { - background-color: $color-signal-blue; + background-color: $color-ultramarine-ui-light; color: $color-white; } @include ios-dark-theme { - background-color: $color-signal-blue; + background-color: $color-ultramarine-ui-light; color: $color-gray-05; } } @@ -3152,7 +3181,14 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05', .module-conversation-list-item--has-unread { padding-left: 12px; - border-left: 4px solid $color-signal-blue; + + @include light-theme { + border-left: 4px solid $color-ultramarine-ui-light; + } + + @include dark-theme { + border-left: 4px solid $color-ultramarine-ui-dark; + } } .module-conversation-list-item--is-selected { @@ -3188,12 +3224,13 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05', border-radius: 10px; color: $color-white; - background-color: $color-signal-blue; @include light-theme { + background-color: $color-ultramarine-ui-light; box-shadow: 0px 0px 0px 1px $color-gray-02; } @include dark-theme { + background-color: $color-ultramarine-ui-dark; box-shadow: 0px 0px 0px 1px $color-gray-90; } } diff --git a/stylesheets/_variables.scss b/stylesheets/_variables.scss index 61578bcd0..ed89586ed 100644 --- a/stylesheets/_variables.scss +++ b/stylesheets/_variables.scss @@ -6,7 +6,7 @@ $inter: Inter, 'Helvetica Neue', 'Source Sans Pro', 'Source Han Sans SC', $color-signal-blue: #2090ea; -$color-accent-blue: #2090ea; +$color-accent-blue: #2c6bed; $color-accent-green: #4caf50; $color-accent-red: #f44336; $color-accent-yellow: #ffd624; @@ -35,6 +35,10 @@ $color-black-alpha-20: rgba($color-black, 0.2); $color-black-alpha-40: rgba($color-black, 0.4); $color-black-alpha-60: rgba($color-black, 0.6); +$color-ultramarine-brand-light: #3a76f0; +$color-ultramarine-brand-dark: #1851b4; +$color-ultramarine-ui-light: #2c6bed; +$color-ultramarine-ui-dark: #6191f3; $color-crimson: #cc163d; $color-vermilion: #c73800; $color-burlap: #746c53; diff --git a/test/index.html b/test/index.html index 8a0174a90..9eb925556 100644 --- a/test/index.html +++ b/test/index.html @@ -12,7 +12,7 @@