191 lines
3.2 KiB
SCSS
191 lines
3.2 KiB
SCSS
|
//
|
||
|
// Panel
|
||
|
//
|
||
|
#panel {
|
||
|
font-weight: bold;
|
||
|
/* sets the height of horizontal panels */
|
||
|
height: 40px;
|
||
|
/* sets the width of vertical panels */
|
||
|
width: 32px;
|
||
|
/* Set the symbolic foreground color for icons, and importantly, the system tray applet icons */
|
||
|
color: $fg_color;
|
||
|
background-color: rgba(16, 16, 16, 0.1);
|
||
|
|
||
|
&:highlight {
|
||
|
border-image: none;
|
||
|
background-color: transparentize($error_color, 0.5);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.panel {
|
||
|
&Left {
|
||
|
spacing: 4px;
|
||
|
|
||
|
&:dnd {
|
||
|
background-gradient-direction: vertical;
|
||
|
background-gradient-start: rgba(255, 0, 0, 0.05);
|
||
|
background-gradient-end: rgba(255, 0, 0, 0.2);
|
||
|
}
|
||
|
&:ltr {
|
||
|
padding-right: 4px;
|
||
|
}
|
||
|
&:rtl {
|
||
|
padding-left: 4px;
|
||
|
}
|
||
|
|
||
|
&.vertical {
|
||
|
padding: 0px;
|
||
|
&:ltr {
|
||
|
padding-right: 0px;
|
||
|
}
|
||
|
&:rtl {
|
||
|
padding-left: 0px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&Right {
|
||
|
&:dnd {
|
||
|
background-gradient-direction: vertical;
|
||
|
background-gradient-start: rgba(0, 0, 255, 0.05);
|
||
|
background-gradient-end: rgba(0, 0, 255, 0.2);
|
||
|
}
|
||
|
&:ltr {
|
||
|
padding-left: 4px;
|
||
|
spacing: 0px;
|
||
|
}
|
||
|
&:rtl {
|
||
|
padding-right: 4px;
|
||
|
spacing: 0px;
|
||
|
}
|
||
|
|
||
|
&.vertical {
|
||
|
padding: 0px;
|
||
|
&:ltr {
|
||
|
padding-left: 0px;
|
||
|
spacing: 0px;
|
||
|
}
|
||
|
&:rtl {
|
||
|
padding-right: 0px;
|
||
|
spacing: 0px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&Center {
|
||
|
spacing: 4px;
|
||
|
|
||
|
&.vertical {
|
||
|
padding-left: 0px;
|
||
|
padding-right: 0px;
|
||
|
}
|
||
|
|
||
|
&:dnd {
|
||
|
background-gradient-direction: vertical;
|
||
|
background-gradient-start: rgba(0, 255, 0, 0.05);
|
||
|
background-gradient-end: rgba(0, 255, 0, 0.2);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&-top,
|
||
|
&-bottom,
|
||
|
&-left,
|
||
|
&-right {
|
||
|
color: $selected_fg_color;
|
||
|
border: none;
|
||
|
background-color: transparentize($panel_bg, 0.01);
|
||
|
font-size: 1em;
|
||
|
padding: 0px;
|
||
|
}
|
||
|
|
||
|
&-top {
|
||
|
padding-right: 12px;
|
||
|
box-shadow: 0 1px $borders_color;
|
||
|
}
|
||
|
|
||
|
&-bottom {
|
||
|
padding-right: 12px;
|
||
|
box-shadow: 0 -1px $borders_color;
|
||
|
}
|
||
|
|
||
|
&-left {
|
||
|
box-shadow: 1px 0 $borders_color;
|
||
|
}
|
||
|
|
||
|
&-right {
|
||
|
box-shadow: -1px 0 $borders_color;
|
||
|
}
|
||
|
|
||
|
&-dummy {
|
||
|
background-color: transparentize($error_color, 0.5);
|
||
|
|
||
|
&:entered {
|
||
|
background-color: transparentize($error_color, 0.4);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&-status-button {
|
||
|
border-width: 0;
|
||
|
-natural-hpadding: 3px;
|
||
|
-minimum-hpadding: 3px;
|
||
|
font-weight: bold;
|
||
|
color: $panel_fg;
|
||
|
|
||
|
&:hover {
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&-button {
|
||
|
-natural-hpadding: 6px;
|
||
|
-minimum-hpadding: 2px;
|
||
|
font-weight: bold;
|
||
|
color: green;
|
||
|
transition-duration: 100;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.system-status-icon {
|
||
|
icon-size: 16px;
|
||
|
padding: 0 1px;
|
||
|
|
||
|
&.warning {
|
||
|
color: $warning_color;
|
||
|
}
|
||
|
&.error {
|
||
|
color: $error_color;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
//
|
||
|
// Panel Launchers Applet (panelLaunchers.js)
|
||
|
//
|
||
|
.panel-launchers {
|
||
|
padding-left: 7px;
|
||
|
spacing: 2px;
|
||
|
|
||
|
& .launcher {
|
||
|
padding-left: 2px;
|
||
|
padding-right: 2px;
|
||
|
padding-bottom: 2px;
|
||
|
// border-bottom-width: 1px;
|
||
|
transition-duration: 200;
|
||
|
|
||
|
&:hover {
|
||
|
background-color: $selected_bg_color;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
&.vertical {
|
||
|
padding-top: 2px;
|
||
|
padding-bottom: 2px;
|
||
|
padding-left: 0px;
|
||
|
padding-right: 0px;
|
||
|
spacing: 1px;
|
||
|
|
||
|
& .launcher {
|
||
|
padding-top: 2px;
|
||
|
padding-bottom: 2px;
|
||
|
}
|
||
|
}
|
||
|
}
|