dotfiles/.config/swaync/style.css

385 lines
6.7 KiB
CSS

/*
* vim: ft=less
*/
@import "dark.less";
* {
all: unset;
font-size: 14px;
transition: 200ms;
}
.floating-notifications.background .notification-row .notification-background {
box-shadow:
0 0 8px 0 rgba(0, 0, 0, 0.8),
inset 0 0 0 1px @bg-a;
border-radius: 12.6px;
margin: 18px;
background-color: @bg;
color: @fg;
padding: 0;
}
.floating-notifications.background
.notification-row
.notification-background
.notification {
padding: 7px;
border-radius: 12.6px;
}
.floating-notifications.background
.notification-row
.notification-background
.notification.critical {
box-shadow: inset 0 0 7px 0 @warning;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
.notification-content {
margin: 7px;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
.notification-content
.summary {
color: @fg;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
.notification-content
.time {
color: @gray;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
.notification-content
.body {
color: @fg;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
> *:last-child
> * {
min-height: 3.4em;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action {
border-radius: 7px;
color: @fg;
background-color: @bg-a;
box-shadow: inset 0 0 0 1px @bg-b;
margin: 7px;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action:hover {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @bg-a;
color: @fg;
}
.floating-notifications.background
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action:active {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @primary-dark;
color: @fg;
}
.floating-notifications.background
.notification-row
.notification-background
.close-button {
margin: 7px;
padding: 2px;
border-radius: 6.3px;
color: @bg;
background-color: @warning;
}
.floating-notifications.background
.notification-row
.notification-background
.close-button:hover {
background-color: #eba0ac;
color: @bg;
}
.floating-notifications.background
.notification-row
.notification-background
.close-button:active {
background-color: @warning;
color: @bg;
}
.control-center {
box-shadow:
0 0 8px 0 rgba(0, 0, 0, 0.8),
inset 0 0 0 1px @bg-a;
border-radius: 12.6px;
margin: 18px;
background-color: @bg;
color: @fg;
padding: 14px;
}
.control-center .widget-title {
color: @fg;
font-size: 1.3em;
}
.control-center .widget-title button {
border-radius: 7px;
color: @fg;
background-color: @bg-a;
box-shadow: inset 0 0 0 1px @bg-b;
padding: 8px;
}
.control-center .widget-title button:hover {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @bg-c;
color: @fg;
}
.control-center .widget-title button:active {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @primary-dark;
color: @bg;
}
.control-center .notification-row .notification-background {
border-radius: 7px;
color: @fg;
background-color: @bg-a;
box-shadow: inset 0 0 0 1px @bg-b;
margin-top: 14px;
}
.control-center .notification-row .notification-background .notification {
padding: 7px;
border-radius: 7px;
}
.control-center
.notification-row
.notification-background
.notification.critical {
box-shadow: inset 0 0 7px 0 @warning;
}
.control-center
.notification-row
.notification-background
.notification
.notification-content {
margin: 7px;
}
.control-center
.notification-row
.notification-background
.notification
.notification-content
.summary {
color: @fg;
}
.control-center
.notification-row
.notification-background
.notification
.notification-content
.time {
color: @gray;
}
.control-center
.notification-row
.notification-background
.notification
.notification-content
.body {
color: @fg;
}
.control-center
.notification-row
.notification-background
.notification
> *:last-child
> * {
min-height: 3.4em;
}
.control-center
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action {
border-radius: 7px;
color: @fg;
background-color: #11111b;
box-shadow: inset 0 0 0 1px @bg-b;
margin: 7px;
}
.control-center
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action:hover {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @bg-a;
color: @fg;
}
.control-center
.notification-row
.notification-background
.notification
> *:last-child
> *
.notification-action:active {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @primary-dark;
color: @fg;
}
.control-center .notification-row .notification-background .close-button {
margin: 7px;
padding: 2px;
border-radius: 6.3px;
color: @bg;
background-color: @fg;
}
.control-center .notification-row .notification-background .close-button:hover {
background-color: @warning;
color: @bg;
}
.control-center
.notification-row
.notification-background
.close-button:active {
background-color: @warning;
color: @bg;
}
.control-center .notification-row .notification-background:hover {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @bg-e;
color: @fg;
}
.control-center .notification-row .notification-background:active {
box-shadow: inset 0 0 0 1px @bg-b;
background-color: @primary-dark;
color: @fg;
}
progressbar,
progress,
through {
border-radius: 12.6px;
}
progressbar {
box-shadow: inset 0 0 0 1px @bg-b;
}
.notification.critical progress {
background-color: @warning;
}
.notification.low progress,
.notification.normal progress {
background-color: @secondary-dark;
}
through {
background-color: @bg-a;
}
.control-center through {
background-color: @bg-b;
}
.control-center-dnd {
margin-top: 5px;
border-radius: 8px;
background: @bg-a;
border: 1px solid @bg-b;
box-shadow: none;
}
.control-center-dnd:checked {
background: @bg-a;
}
.control-center-dnd slider {
background: @bg-b;
border-radius: 8px;
}
.widget-dnd {
margin: 0px;
font-size: 1.1rem;
}
.widget-dnd > switch {
font-size: initial;
border-radius: 8px;
background: @bg-a;
border: 1px solid @bg-b;
box-shadow: none;
}
.widget-dnd > switch:checked {
background: @bg-a;
}
.widget-dnd > switch slider {
background: @bg-b;
border-radius: 8px;
border: 1px solid @bg-d;
}