mirrors/etherpad-lite
1
0
Fork 0
mirror of https://github.com/ether/etherpad-lite.git synced 2025-04-22 08:26:16 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 26

colibris: fix coloring text when authorship background color is activated #3641

Browse source
This commit is contained in:
Sebastian Castro 2020-04-16 08:20:57 +02:00 • committed by muxator
parent 5e6ceb071e
commit 2193875292
3 changed files with 11 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/static/js/ace2_inner.js
View file

@ -255,15 +255,9 @@ function Ace2Inner(){
authorStyle.backgroundColor = bgcolor; authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor; parentAuthorStyle.backgroundColor = bgcolor;
// text contrast var textColor = colorutils.textColorFromBackgroundColor(bgcolor, parent.parent.clientVars.skinName);
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5) authorStyle.color = textColor;
{ parentAuthorStyle.color = textColor;
authorStyle.color = '#ffffff';
parentAuthorStyle.color = '#ffffff';
}else{
authorStyle.color = null;
parentAuthorStyle.color = null;
}
// anchor text contrast // anchor text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55) if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)

8
src/static/js/colorutils.js
View file

@ -142,4 +142,12 @@ colorutils.complementary = function(c)
]; ];
} }
colorutils.textColorFromBackgroundColor = function(bgcolor, skinName)
{
var white = skinName == 'colibris' ? 'var(--super-light-color)' : '#fff';
var black = skinName == 'colibris' ? 'var(--super-dark-color)' : '#222';
return colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5 ? white : black;
}
exports.colorutils = colorutils; exports.colorutils = colorutils;

2
src/static/skins/colibris/src/components/toolbar.css
View file

@ -84,8 +84,6 @@
margin-left: 15px; margin-left: 15px;
width: 45px; width: 45px;
height: 100%; height: 100%;
background-color: var(--bg-color);
color: var(--text-color);
} }
.toolbar ul li[data-key=showusers] > a { .toolbar ul li[data-key=showusers] > a {
width: 100%; width: 100%;