Adwaita: colorpicker and colorbutton fixes.

With nasty gross ugly code, no other ways, sorry.
This commit is contained in:
Lapo Calamandrei 2015-04-15 21:43:59 +02:00
parent 149e7df608
commit a9addf14b7
3 changed files with 20 additions and 24 deletions

View File

@ -812,9 +812,11 @@ $_dot_color: if($variant=='light', $selected_bg_color,
}
}
GtkColorButton.button {
padding: 5px; // Uniform padding on the GtkColorButton
GtkColorSwatch {
GtkColorSwatch:only-child:first-child:last-child { //*-child mess needed since we get overridden by the colorpicker selectors
border-radius: 0;
box-shadow: inset 0 1px 1px transparentize(black, 0.9),
_widget_edge();
@ -3086,7 +3088,7 @@ GtkInfoBar {
GtkColorSwatch {
// This widget is made of two boxes one on top of the other, the lower box is GtkColorSwatch {} the other one
// is GtkColorSwatch .overlay {}, GtkColorSwatch has the programmatically set background, so most of the style
// is GtkColorSwatch > .overlay {}, GtkColorSwatch has the programmatically set background, so most of the style
// is applied to the overlay box.
$_colorswatch_shadow: inset 0 1px transparentize(black, 0.9), _widget_edge();
@ -3113,18 +3115,18 @@ GtkColorSwatch {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
&.left, &:first-child, &:first-child .overlay {
&.left, &:first-child:not(.overlay), &:first-child:not(.top) > .overlay {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
&.right, &:last-child, &:last-child .overlay {
&.right, &:last-child:not(.overlay), &:last-child:not(.bottom) > .overlay {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
&:only-child, &:only-child .overlay {
border-radius: 5px;
}
// nth-child works just on the custom colors row
&:only-child:not(.overlay), &:only-child > .overlay { border-radius: 5px; }
// nth-child is used for the custom colors row.
// the :not() madness is needed since actually the overlay is selectable by GtkColorSwatch > .overlay
// and GtkColorSwatch.overlay, I know it's weird, but this is gtk+.
// hover effect
&:hover,

View File

@ -1316,13 +1316,10 @@ GtkComboBox.combobox-entry .titlebar .button.titlebutton,
GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
.titlebar GtkColorButton.button.titlebutton {
padding: 5px; }
GtkColorButton.button GtkColorSwatch, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch {
GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child {
border-radius: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
GtkColorButton.button GtkColorSwatch:insensitive, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch:insensitive,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch:insensitive, GtkColorButton.button GtkColorSwatch:backdrop, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch:backdrop,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch:backdrop {
GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child:insensitive, GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child:backdrop {
box-shadow: none; }
/*********
@ -4246,13 +4243,13 @@ GtkColorSwatch {
GtkColorSwatch.bottom {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px; }
GtkColorSwatch.left, GtkColorSwatch:first-child, GtkColorSwatch:first-child .overlay {
GtkColorSwatch.left, GtkColorSwatch:first-child:not(.overlay), GtkColorSwatch:first-child:not(.top) > .overlay {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px; }
GtkColorSwatch.right, GtkColorSwatch:last-child, GtkColorSwatch:last-child .overlay {
GtkColorSwatch.right, GtkColorSwatch:last-child:not(.overlay), GtkColorSwatch:last-child:not(.bottom) > .overlay {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px; }
GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay {
GtkColorSwatch:only-child:not(.overlay), GtkColorSwatch:only-child > .overlay {
border-radius: 5px; }
GtkColorSwatch:hover, GtkColorSwatch:hover:selected {
background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%);

View File

@ -1316,13 +1316,10 @@ GtkComboBox.combobox-entry .titlebar .button.titlebutton,
GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
.titlebar GtkColorButton.button.titlebutton {
padding: 5px; }
GtkColorButton.button GtkColorSwatch, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch {
GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child {
border-radius: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
GtkColorButton.button GtkColorSwatch:insensitive, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch:insensitive,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch:insensitive, GtkColorButton.button GtkColorSwatch:backdrop, .header-bar GtkColorButton.button.titlebutton GtkColorSwatch:backdrop,
.titlebar GtkColorButton.button.titlebutton GtkColorSwatch:backdrop {
GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child:insensitive, GtkColorButton.button GtkColorSwatch:only-child:first-child:last-child:backdrop {
box-shadow: none; }
/*********
@ -4418,13 +4415,13 @@ GtkColorSwatch {
GtkColorSwatch.bottom {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px; }
GtkColorSwatch.left, GtkColorSwatch:first-child, GtkColorSwatch:first-child .overlay {
GtkColorSwatch.left, GtkColorSwatch:first-child:not(.overlay), GtkColorSwatch:first-child:not(.top) > .overlay {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px; }
GtkColorSwatch.right, GtkColorSwatch:last-child, GtkColorSwatch:last-child .overlay {
GtkColorSwatch.right, GtkColorSwatch:last-child:not(.overlay), GtkColorSwatch:last-child:not(.bottom) > .overlay {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px; }
GtkColorSwatch:only-child, GtkColorSwatch:only-child .overlay {
GtkColorSwatch:only-child:not(.overlay), GtkColorSwatch:only-child > .overlay {
border-radius: 5px; }
GtkColorSwatch:hover, GtkColorSwatch:hover:selected {
background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0) 50%);