Signal/Desktop
1
0
Fork 0
mirror of https://github.com/signalapp/Signal-Desktop.git synced 2026-05-08 08:58:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

Properly style call buttons across app, when already in a call

Browse Source
This commit is contained in:
Scott Nonnenberg
2024-08-27 06:48:41 +10:00
committed by GitHub
parent 3c25092f50
commit c251867699
39 changed files with 610 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stylesheets/components/Button.scss
+47
View File
@@ -71,6 +71,15 @@
background: fade-out($background-color, 0.6);
}
&--discouraged {
@include light-theme {
opacity: 0.4;
}
@include dark-theme {
opacity: 0.5;
}
}
@include light-theme {
@include hover-and-active-states($background-color, $color-black);
}
@@ -96,10 +105,16 @@
&--affirmative {
color: $color-ultramarine;
}
&--affirmative--discouraged {
color: fade-out($color-ultramarine, 0.5);
}
&--destructive {
color: $color-accent-red;
}
&--destructive--discouraged {
color: fade-out($color-ultramarine, 0.5);
}
@include hover-and-active-states($background-color, $color-black);
}
@@ -119,10 +134,16 @@
&--affirmative {
color: $color-ultramarine-light;
}
&--affirmative--discouraged {
color: fade-out($color-ultramarine-light, 0.5);
}
&--destructive {
color: $color-accent-red;
}
&--destructive--discouraged {
color: fade-out($color-accent-red, 0.5);
}
@include hover-and-active-states($background-color, $color-white);
}
@@ -162,6 +183,15 @@
background: fade-out($background-color, 0.6);
}
&--discouraged {
@include light-theme {
opacity: 0.4;
}
@include dark-theme {
opacity: 0.5;
}
}
@include light-theme {
@include hover-and-active-states($background-color, $color-black);
}
@@ -191,6 +221,10 @@
color: fade-out($color, 0.4);
background: fade-out($background-color, 0.6);
}
&--discouraged {
color: fade-out($color, 0.5);
}
@include hover-and-active-states($background-color, $color-black);
}
@@ -205,6 +239,10 @@
color: fade-out($color, 0.4);
background: fade-out($background-color, 0.6);
}
&--discouraged {
color: fade-out($color, 0.5);
}
@include hover-and-active-states($background-color, $color-white);
}
}
@@ -221,6 +259,15 @@
min-width: 68px;
padding: 8px;
&--discouraged {
@include light-theme {
opacity: 0.4;
}
@include dark-theme {
opacity: 0.5;
}
}
@include light-theme {
background-color: $color-gray-05;
color: $color-black;
stylesheets/components/CallsTab.scss
+6 -1
View File
@@ -406,7 +406,12 @@
}
.CallsNewCall__ItemActionButton--join-call-disabled {
opacity: 0.5;
@include light-theme {
opacity: 0.4;
}
@include dark-theme {
opacity: 0.5;
}
}
.CallsNewCall__ItemActionButtonTooltip {
stylesheets/components/ContactModal.scss
-4
View File
@@ -309,8 +309,4 @@
margin-block: 8px 5px;
}
&__tooltip {
@include tooltip;
}
}
stylesheets/components/ConversationHeader.scss
+24 -7
View File
@@ -171,21 +171,38 @@
opacity: 0.5;
}
&--in-another-call {
@include light-theme {
opacity: 0.5;
}
@include dark-theme {
opacity: 0.4;
}
}
&:not(:disabled) {
@include light-theme {
&:hover,
&:focus {
&:hover {
background: $color-gray-02;
}
&:focus {
@include keyboard-mode {
background: $color-gray-02;
}
}
&:active {
background: $color-gray-05;
}
}
@include dark-theme {
&:hover,
&:focus {
&:hover {
background: $color-gray-80;
}
&:focus {
@include keyboard-mode {
background: $color-gray-02;
}
}
&:active {
background: $color-gray-75;
}
@@ -281,13 +298,13 @@
}
&:not(:disabled) {
// Override hover state coming from __button above.
&:hover {
// Override hover/focus/active state coming from __button above.
&:hover,
&:active {
@include any-theme {
background-color: darken($background, 16%);
}
}
&:focus {
@include keyboard-mode {
background-color: darken($background, 16%);
stylesheets/components/InAnotherCallTooltip.scss
+6
View File
@@ -0,0 +1,6 @@
// Copyright 2024 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
.InAnotherCallTooltip {
@include tooltip;
}