+
diff --git a/background.html b/background.html
index 2b6e6aebcfa0..fc1eb480b576 100644
--- a/background.html
+++ b/background.html
@@ -20,7 +20,6 @@
style-src 'self' 'unsafe-inline';"
>
+
diff --git a/main.js b/main.js
index 6b448788120e..f47f5ebfcb08 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 7484ac81a06a..0ed9be471449 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 97cc1a239f5b..e9a7d0e6cb64 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 61578bcd0114..ed89586ed707 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 8a0174a90303..9eb925556a79 100644
--- a/test/index.html
+++ b/test/index.html
@@ -12,7 +12,7 @@