Style info bar and calendar
parent
005e5f8ee9
commit
cceeb065f8
|
@ -0,0 +1,24 @@
|
||||||
|
@import "functions";
|
||||||
|
@import "global";
|
||||||
|
|
||||||
|
|
||||||
|
/**********
|
||||||
|
! Calendar
|
||||||
|
***********/
|
||||||
|
|
||||||
|
GtkCalendar {
|
||||||
|
padding: $spacing;
|
||||||
|
outline-offset: -1px;
|
||||||
|
|
||||||
|
&:inconsistent { color: mix($fg_color, $bg_color, 0.5); }
|
||||||
|
|
||||||
|
&.view, &.highlight, &.header, &.button {
|
||||||
|
&, &:hover, &:insensitive {
|
||||||
|
border: none;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.highlight { color: $selected_bg_color; }
|
||||||
|
}
|
|
@ -0,0 +1,56 @@
|
||||||
|
@import "functions";
|
||||||
|
@import "global";
|
||||||
|
|
||||||
|
|
||||||
|
/*********
|
||||||
|
! Infobar
|
||||||
|
**********/
|
||||||
|
|
||||||
|
GtkInfoBar {
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
$types: (
|
||||||
|
info: ( $info_fg_color, $info_bg_color ),
|
||||||
|
warning: ( $warning_fg_color, $warning_bg_color ),
|
||||||
|
question: ( $question_fg_color, $question_bg_color ),
|
||||||
|
error: ( $error_fg_color, $error_bg_color ),
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
@each $type, $colors in $types {
|
||||||
|
$fg_color: nth($colors, 1);
|
||||||
|
$bg_color: nth($colors, 2);
|
||||||
|
|
||||||
|
&.#{$type} {
|
||||||
|
border: 1px solid shade($bg_color, 0.8);
|
||||||
|
background-color: $bg_color;
|
||||||
|
background-image: none;
|
||||||
|
color: $fg_color;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
@include button($bg_color, $fg_color);
|
||||||
|
|
||||||
|
&.close {
|
||||||
|
border: 1px solid transparent;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
&:focus, &:hover {
|
||||||
|
border: 1px solid alpha(black, 0.3);
|
||||||
|
background-color: alpha(white, 0.2);
|
||||||
|
background-image: none;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active, &:checked, &:active:hover, &:checked:hover {
|
||||||
|
border: 1px solid alpha(black, 0.3);
|
||||||
|
background-color: alpha(black, 0.1);
|
||||||
|
background-image: none;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -12,247 +12,9 @@
|
||||||
@import "progress";
|
@import "progress";
|
||||||
@import "spinner";
|
@import "spinner";
|
||||||
@import "window";
|
@import "window";
|
||||||
|
@import "calendar";
|
||||||
|
@import "infobar";
|
||||||
|
|
||||||
/***********
|
|
||||||
* calendar *
|
|
||||||
************/
|
|
||||||
GtkCalendar {
|
|
||||||
padding: 4px;
|
|
||||||
outline-offset: -1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
GtkCalendar:inconsistent {
|
|
||||||
color: mix($fg_color, $bg_color, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
GtkCalendar.view,
|
|
||||||
GtkCalendar.header,
|
|
||||||
GtkCalendar.button,
|
|
||||||
GtkCalendar.button:hover,
|
|
||||||
GtkCalendar.button:insensitive {
|
|
||||||
border-width: 0;
|
|
||||||
background-color: transparent;
|
|
||||||
background-image: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.highlight,
|
|
||||||
GtkCalendar.highlight {
|
|
||||||
border-width: 0;
|
|
||||||
background-color: transparent;
|
|
||||||
color: $selected_bg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
/***********
|
|
||||||
* infobar *
|
|
||||||
***********/
|
|
||||||
GtkInfoBar {
|
|
||||||
border-width: 0;
|
|
||||||
border-style: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: shade($info_bg_color, 0.8);
|
|
||||||
background-color: $info_bg_color;
|
|
||||||
background-image: none;
|
|
||||||
color: $info_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button {
|
|
||||||
border-top-color: shade($info_bg_color, 0.8);
|
|
||||||
border-right-color: shade($info_bg_color, 0.72);
|
|
||||||
border-left-color: shade($info_bg_color, 0.72);
|
|
||||||
border-bottom-color: shade($info_bg_color, 0.7);
|
|
||||||
background-color: shade($info_bg_color, 1.08);
|
|
||||||
color: $info_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button:hover {
|
|
||||||
border-top-color: shade($info_bg_color, 0.85);
|
|
||||||
border-right-color: shade($info_bg_color, 0.78);
|
|
||||||
border-left-color: shade($info_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($info_bg_color, 0.7);
|
|
||||||
background-color: shade($info_bg_color, 1.10);
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button:active {
|
|
||||||
border-color: shade($info_bg_color, 0.6);
|
|
||||||
background-color: shade($info_bg_color, 0.95);
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button:active:hover {
|
|
||||||
border-top-color: shade($info_bg_color, 0.85);
|
|
||||||
border-right-color: shade($info_bg_color, 0.78);
|
|
||||||
border-left-color: shade($info_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($info_bg_color, 0.7);
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button.close {
|
|
||||||
color: $info_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button.close:hover {
|
|
||||||
background-color: alpha(white, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.info .button.close:active {
|
|
||||||
color: $info_fg_color;
|
|
||||||
background-color: alpha(black, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning {
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: shade($warning_bg_color, 0.8);
|
|
||||||
background-color: $warning_bg_color;
|
|
||||||
background-image: none;
|
|
||||||
color: $warning_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button {
|
|
||||||
border-top-color: shade($warning_bg_color, 0.8);
|
|
||||||
border-right-color: shade($warning_bg_color, 0.72);
|
|
||||||
border-left-color: shade($warning_bg_color, 0.72);
|
|
||||||
border-bottom-color: shade($warning_bg_color, 0.7);
|
|
||||||
background-color: shade($warning_bg_color, 1.08);
|
|
||||||
color: $warning_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button:hover {
|
|
||||||
border-top-color: shade($warning_bg_color, 0.85);
|
|
||||||
border-right-color: shade($warning_bg_color, 0.78);
|
|
||||||
border-left-color: shade($warning_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($warning_bg_color, 0.7);
|
|
||||||
background-color: shade($warning_bg_color, 1.10);
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button:active {
|
|
||||||
border-color: shade($warning_bg_color, 0.6);
|
|
||||||
background-color: shade($warning_bg_color, 0.95);
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button:active:hover {
|
|
||||||
border-top-color: shade($warning_bg_color, 0.85);
|
|
||||||
border-right-color: shade($warning_bg_color, 0.78);
|
|
||||||
border-left-color: shade($warning_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($warning_bg_color, 0.7);
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button.close {
|
|
||||||
color: $warning_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button.close:hover {
|
|
||||||
background-color: alpha(white, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning .button.close:active {
|
|
||||||
color: $warning_fg_color;
|
|
||||||
background-color: alpha(black, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.question {
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: shade($question_bg_color, 0.8);
|
|
||||||
background-color: $question_bg_color;
|
|
||||||
background-image: none;
|
|
||||||
color: $question_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button {
|
|
||||||
border-top-color: shade($question_bg_color, 0.8);
|
|
||||||
border-right-color: shade($question_bg_color, 0.72);
|
|
||||||
border-left-color: shade($question_bg_color, 0.72);
|
|
||||||
border-bottom-color: shade($question_bg_color, 0.7);
|
|
||||||
background-color: shade($question_bg_color, 1.08);
|
|
||||||
color: $question_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button:hover {
|
|
||||||
border-top-color: shade($question_bg_color, 0.85);
|
|
||||||
border-right-color: shade($question_bg_color, 0.78);
|
|
||||||
border-left-color: shade($question_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($question_bg_color, 0.7);
|
|
||||||
background-color: shade($question_bg_color, 1.10);
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button:active {
|
|
||||||
border-color: shade($question_bg_color, 0.6);
|
|
||||||
background-color: shade($question_bg_color, 0.95);
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button:active:hover {
|
|
||||||
border-top-color: shade($question_bg_color, 0.85);
|
|
||||||
border-right-color: shade($question_bg_color, 0.78);
|
|
||||||
border-left-color: shade($question_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($question_bg_color, 0.7);
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button.close {
|
|
||||||
color: $question_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button.close:hover {
|
|
||||||
background-color: alpha(white, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.question .button.close:active {
|
|
||||||
color: $question_fg_color;
|
|
||||||
background-color: alpha(black, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: shade($error_bg_color, 0.8);
|
|
||||||
background-color: $error_bg_color;
|
|
||||||
background-image: none;
|
|
||||||
color: $error_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button {
|
|
||||||
border-top-color: shade($error_bg_color, 0.8);
|
|
||||||
border-right-color: shade($error_bg_color, 0.72);
|
|
||||||
border-left-color: shade($error_bg_color, 0.72);
|
|
||||||
border-bottom-color: shade($error_bg_color, 0.7);
|
|
||||||
background-color: shade($error_bg_color, 1.08);
|
|
||||||
color: $error_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button:hover {
|
|
||||||
border-top-color: shade($error_bg_color, 0.85);
|
|
||||||
border-right-color: shade($error_bg_color, 0.78);
|
|
||||||
border-left-color: shade($error_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($error_bg_color, 0.7);
|
|
||||||
background-color: shade($error_bg_color, 1.10);
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button:active {
|
|
||||||
border-color: shade($error_bg_color, 0.6);
|
|
||||||
background-color: shade($error_bg_color, 0.95);
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button:active:hover {
|
|
||||||
border-top-color: shade($error_bg_color, 0.85);
|
|
||||||
border-right-color: shade($error_bg_color, 0.78);
|
|
||||||
border-left-color: shade($error_bg_color, 0.78);
|
|
||||||
border-bottom-color: shade($error_bg_color, 0.7);
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button.close {
|
|
||||||
color: $error_fg_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button.close:hover {
|
|
||||||
background-color: alpha(white, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.error .button.close:active {
|
|
||||||
color: $error_fg_color;
|
|
||||||
background-color: alpha(black, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*****************
|
/*****************
|
||||||
* miscellaneous *
|
* miscellaneous *
|
||||||
|
|
Loading…
Reference in New Issue