add light theme support for desktop button

This commit is contained in:
hlechner
2020-07-29 22:50:18 -03:00
parent f32055034f
commit 9aa9d939ba
2 changed files with 32 additions and 13 deletions

View File

@@ -326,7 +326,7 @@ var dtpPanel = Utils.defineClass({
[
Utils.getStageTheme(),
'changed',
() => this._resetGeometry()
() => (this._resetGeometry(), this._setShowDesktopButtonStyle()),
],
[
// sync hover after a popupmenu is closed
@@ -663,8 +663,12 @@ var dtpPanel = Utils.defineClass({
],
[
Me.settings,
'changed::showdesktop-button-width',
() => this._setShowDesktopButtonSize()
[
'changed::showdesktop-button-width',
'changed::trans-use-custom-bg',
'changed::trans-bg-color'
],
() => this._setShowDesktopButtonStyle()
],
[
Me.desktopSettings,
@@ -1253,11 +1257,12 @@ var dtpPanel = Utils.defineClass({
y_fill: true,
track_hover: true });
this._setShowDesktopButtonSize();
this._setShowDesktopButtonStyle();
this._showDesktopButton.connect('button-press-event', () => this._onShowDesktopButtonPress());
this._showDesktopButton.connect('enter-event', () => {
this._showDesktopButton.add_style_class_name('showdesktop-button-hovered');
this._showDesktopButton.add_style_class_name(this._getBackgroundBrightness() ?
'showdesktop-button-light-hovered' : 'showdesktop-button-dark-hovered');
if (Me.settings.get_boolean('show-showdesktop-hover')) {
this._timeoutsHandler.add([T4, Me.settings.get_int('show-showdesktop-delay'), () => {
@@ -1268,7 +1273,8 @@ var dtpPanel = Utils.defineClass({
});
this._showDesktopButton.connect('leave-event', () => {
this._showDesktopButton.remove_style_class_name('showdesktop-button-hovered');
this._showDesktopButton.remove_style_class_name(this._getBackgroundBrightness() ?
'showdesktop-button-light-hovered' : 'showdesktop-button-dark-hovered');
if (Me.settings.get_boolean('show-showdesktop-hover')) {
if (this._timeoutsHandler.getId(T4)) {
@@ -1290,17 +1296,30 @@ var dtpPanel = Utils.defineClass({
}
},
_setShowDesktopButtonSize: function() {
_setShowDesktopButtonStyle: function() {
let rgb = this._getBackgroundBrightness() ? "55, 55, 55" : "200, 200, 200";
if (this._showDesktopButton) {
let buttonSize = Me.settings.get_int('showdesktop-button-width') + 'px;';
let isVertical = this.checkIfVertical();
let sytle = isVertical ? 'border-top-width:1px;height:' + buttonSize : 'border-left-width:1px;width:' + buttonSize;
let sytle = "border: 0 solid rgba(" + rgb + ", .2);"
sytle += isVertical ? 'border-top-width:1px;height:' + buttonSize : 'border-left-width:1px;width:' + buttonSize;
this._showDesktopButton.set_style(sytle);
this._showDesktopButton[(isVertical ? 'x' : 'y') + '_expand'] = true;
}
},
// _getBackgroundBrightness: return true if panel has a bright background color
_getBackgroundBrightness: function() {
let rgb = this.dynamicTransparency.currentBackgroundColor;
rgb = rgb.substring(5, rgb.length-3).split(',');
let brightness = 0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2];
return (brightness > 128) ? true : false;
},
_toggleWorkspaceWindows: function(hide, workspace) {
let tweenOpts = {
opacity: hide ? 0 : 255,

View File

@@ -114,12 +114,12 @@
spacing: 0px;
}
.showdesktop-button {
border: 0 solid rgba(200, 200, 200, .2);
.showdesktop-button-dark-hovered {
background-color: rgba(200, 200, 200, .4);
}
.showdesktop-button-hovered {
background-color: rgba(200, 200, 200, .4);
.showdesktop-button-light-hovered {
background-color: rgba(55, 55, 55, .4);
}
.panel-corner.hidden:active, .panel-corner.hidden:overview, .panel-corner.hidden:focus {