imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix colour of avatar and colour matching with username (#11470)

Browse source 
* Use consistent colouring of username with avatar

* Upgrade Compound to fix Firefox issue

* Use the approapriate color shade for usernames

* Use the approapriate color shade for usernames

* Upgrade Compound

* Fix tests
This commit is contained in:
Germain 2023-08-24 18:12:28 +01:00 • committed by GitHub
parent 195dc4716b
commit 23897dff4f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
31 changed files with 269 additions and 125 deletions
Download patch file Download diff file Expand all files Collapse all files

16
res/themes/legacy-light/css/_legacy-light.pcss
View file

@ -186,14 +186,14 @@ $call-background: #15191e;
$call-primary-content: #ffffff;
$call-light-quaternary-content: #c1c6cd;
$username-variant1-color: var(--cpd-color-blue-900);
$username-variant2-color: var(--cpd-color-fuchsia-900);
$username-variant3-color: var(--cpd-color-green-900);
$username-variant4-color: var(--cpd-color-pink-900);
$username-variant5-color: var(--cpd-color-orange-900);
$username-variant6-color: var(--cpd-color-cyan-900);
$username-variant7-color: var(--cpd-color-purple-900);
$username-variant8-color: var(--cpd-color-lime-900);
$username-variant1-color: var(--cpd-color-blue-1200);
$username-variant2-color: var(--cpd-color-fuchsia-1200);
$username-variant3-color: var(--cpd-color-green-1200);
$username-variant4-color: var(--cpd-color-pink-1200);
$username-variant5-color: var(--cpd-color-orange-1200);
$username-variant6-color: var(--cpd-color-cyan-1200);
$username-variant7-color: var(--cpd-color-purple-1200);
$username-variant8-color: var(--cpd-color-lime-1200);
/**
* Creating a `semantic` color scale. This will not be needed with the new

16
res/themes/light-high-contrast/css/_light-high-contrast.pcss
View file

@ -8,14 +8,14 @@ $tertiary-content: var(--cpd-color-gray-800);
$quaternary-content: var(--cpd-color-gray-600);
$quinary-content: var(--cpd-color-gray-400);
$username-variant1-color: var(--cpd-color-blue-900);
$username-variant2-color: var(--cpd-color-fuchsia-900);
$username-variant3-color: var(--cpd-color-green-900);
$username-variant4-color: var(--cpd-color-pink-900);
$username-variant5-color: var(--cpd-color-orange-900);
$username-variant6-color: var(--cpd-color-cyan-900);
$username-variant7-color: var(--cpd-color-purple-900);
$username-variant8-color: var(--cpd-color-lime-900);
$username-variant1-color: var(--cpd-color-blue-1200);
$username-variant2-color: var(--cpd-color-fuchsia-1200);
$username-variant3-color: var(--cpd-color-green-1200);
$username-variant4-color: var(--cpd-color-pink-1200);
$username-variant5-color: var(--cpd-color-orange-1200);
$username-variant6-color: var(--cpd-color-cyan-1200);
$username-variant7-color: var(--cpd-color-purple-1200);
$username-variant8-color: var(--cpd-color-lime-1200);
$accent-alt: $links;
$input-border-color: $secondary-content;

16
res/themes/light/css/_light.pcss
View file

@ -36,14 +36,14 @@ $alert: var(--cpd-color-text-critical-primary);
$links: var(--cpd-color-text-link-external);
$link-external: var(--cpd-color-text-link-external);
$username-variant1-color: var(--cpd-color-blue-900);
$username-variant2-color: var(--cpd-color-fuchsia-900);
$username-variant3-color: var(--cpd-color-green-900);
$username-variant4-color: var(--cpd-color-pink-900);
$username-variant5-color: var(--cpd-color-orange-900);
$username-variant6-color: var(--cpd-color-cyan-900);
$username-variant7-color: var(--cpd-color-purple-900);
$username-variant8-color: var(--cpd-color-lime-900);
$username-variant1-color: var(--cpd-color-blue-1200);
$username-variant2-color: var(--cpd-color-fuchsia-1200);
$username-variant3-color: var(--cpd-color-green-1200);
$username-variant4-color: var(--cpd-color-pink-1200);
$username-variant5-color: var(--cpd-color-orange-1200);
$username-variant6-color: var(--cpd-color-cyan-1200);
$username-variant7-color: var(--cpd-color-purple-1200);
$username-variant8-color: var(--cpd-color-lime-1200);
/* ******************** */
/**