127 lines
2.9 KiB
CSS
127 lines
2.9 KiB
CSS
|
/*******
|
||
|
|
* Gala *
|
||
|
|
*******/
|
||
|
|
|
||
|
|
.gala-notification {
|
||
|
|
border: none;
|
||
|
|
border-radius: 4px;
|
||
|
|
background-color: transparent;
|
||
|
|
background-image:
|
||
|
|
linear-gradient(
|
||
|
|
to bottom,
|
||
|
|
@bg_color,
|
||
|
|
@bg_color 80%,
|
||
|
|
shade (
|
||
|
|
@bg_color,
|
||
|
|
0.94
|
||
|
|
)
|
||
|
|
);
|
||
|
|
box-shadow:
|
||
|
|
inset 0 0 0 1px alpha (@bg_highlight_color, 0.1),
|
||
|
|
inset 0 1px 0 0 alpha (@bg_highlight_color, 0.9),
|
||
|
|
inset 0 -1px 0 0 alpha (@bg_highlight_color, 0.3),
|
||
|
|
0 0 0 1px alpha (#000, 0.2),
|
||
|
|
0 3px 6px alpha (#000, 0.16),
|
||
|
|
0 5px 5px -3px alpha (#000, 0.4);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gala-notification .title,
|
||
|
|
.gala-notification .label {
|
||
|
|
color: @text_color;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gala-notification GtkImage {
|
||
|
|
color: alpha (@text_color, 0.8);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gala-button {
|
||
|
|
padding: 3px;
|
||
|
|
color: #fff;
|
||
|
|
border: none;
|
||
|
|
border-radius: 100px;
|
||
|
|
background-image:
|
||
|
|
linear-gradient(
|
||
|
|
to bottom,
|
||
|
|
#7e7e7e,
|
||
|
|
#3e3e3e
|
||
|
|
);
|
||
|
|
box-shadow:
|
||
|
|
inset 0 0 0 1px alpha (#fff, 0.02),
|
||
|
|
inset 0 1px 0 0 alpha (#fff, 0.07),
|
||
|
|
inset 0 -1px 0 0 alpha (#fff, 0.01),
|
||
|
|
0 0 0 1px alpha (#000, 0.4),
|
||
|
|
0 3px 6px alpha (#000, 0.16),
|
||
|
|
0 3px 6px alpha (#000, 0.23);
|
||
|
|
text-shadow: 0 1px 1px alpha (#000, 0.6);
|
||
|
|
}
|
||
|
|
|
||
|
|
/*********
|
||
|
|
* Panel *
|
||
|
|
********/
|
||
|
|
|
||
|
|
.panel {
|
||
|
|
background-color: transparent;
|
||
|
|
transition: all 100ms ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
.panel.maximized {
|
||
|
|
background-color: alpha(#000, 0);
|
||
|
|
}
|
||
|
|
|
||
|
|
.panel.translucent {
|
||
|
|
background-color: alpha(#000, 0);
|
||
|
|
}
|
||
|
|
|
||
|
|
.composited-indicator > revealer label,
|
||
|
|
.composited-indicator > revealer image,
|
||
|
|
.composited-indicator > GtkRevealer {
|
||
|
|
color: #fff;
|
||
|
|
font-weight: bold;
|
||
|
|
text-shadow:
|
||
|
|
0 0 2px alpha (#000, 0.3),
|
||
|
|
0 1px 2px alpha (#000, 0.6);
|
||
|
|
icon-shadow:
|
||
|
|
0 0 2px alpha (#000, 0.3),
|
||
|
|
0 1px 2px alpha (#000, 0.6);
|
||
|
|
transition: all 200ms ease-in-out;
|
||
|
|
}
|
||
|
|
|
||
|
|
.composited-indicator .keyboard {
|
||
|
|
background-color: #fff;
|
||
|
|
border-radius: 2px;
|
||
|
|
box-shadow:
|
||
|
|
0 0 2px alpha (#000, 0.3),
|
||
|
|
0 1px 2px alpha (#000, 0.6);
|
||
|
|
color: #333;
|
||
|
|
font-weight: 600;
|
||
|
|
padding: 0 3px;
|
||
|
|
text-shadow: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.panel.color-light .composited-indicator > revealer label,
|
||
|
|
.panel.color-light .composited-indicator > revealer image,
|
||
|
|
.panel.color-light .composited-indicator > GtkRevealer {
|
||
|
|
color: alpha (#000, 0.65);
|
||
|
|
text-shadow:
|
||
|
|
0 0 2px alpha (#fff, 0.3),
|
||
|
|
0 1px 0 alpha (#fff, 0.25);
|
||
|
|
icon-shadow:
|
||
|
|
0 0 2px alpha (#fff, 0.3),
|
||
|
|
0 1px 0 alpha (#fff, 0.25);
|
||
|
|
}
|
||
|
|
|
||
|
|
.panel.color-light .composited-indicator .keyboard {
|
||
|
|
background-color: alpha (#000, 0);
|
||
|
|
box-shadow:
|
||
|
|
0 0 2px alpha (#fff, 0.3),
|
||
|
|
0 1px 0 alpha (#fff, 0.25);
|
||
|
|
color: #fff;
|
||
|
|
text-shadow: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.panel .popover {
|
||
|
|
box-shadow:
|
||
|
|
inset 0 -1px 0 0 alpha (@bg_highlight_color, 0.5),
|
||
|
|
0 3px 4px alpha (#000, 0.15),
|
||
|
|
0 3px 3px -3px alpha (#000, 0.35);
|
||
|
|
}
|