hyprcrux/.config/ags/old/scss/_notifications.scss
2024-04-11 00:21:35 -04:00

96 lines
1.9 KiB
SCSS

window.notifications {
.notification {
border-radius: 15px;
background-color: $base;
margin: 25px 25px 20px 0px;
font-family: "Iosevka";
padding: 5px;
// border: 2px solid $rosewater;
box-shadow: rgba(0, 0, 0, 0.4) 5px 5px 5px;
&.critical {
box-shadow: inset 0 0 .5em 0 $red;
}
&:hover button.close-button {
// @include button-hover;
background-color: transparentize($red, .5);
}
.content {
.title {
margin-top: 5px;
margin-right: 10px;
color: $text;
font-size: 1.2em;
}
.time {
color: transparentize($text, .2);
margin: 5px 10px;
}
.description {
font-size: .9em;
color: transparentize($text, .2);
}
.icon {
border-radius: 10px;
margin-right: 10px;
&.img {
border: 2px solid $green;
}
}
}
box.actions {
// @include spacing(0.5);
margin-top: 10px;
button {
// @include button;
background-color: $surface0;
border: 2px solid $surface0;
border-radius: 10px;
font-size: 1.2em;
margin: 0px 10px 10px 0px;
padding: 10px;
&:first-child {
margin: 0px 10px 10px 10px;
}
&:hover {
background-color: $surface2;
border: 2px solid $rosewater;
}
}
}
button.close-button {
// @include button($flat: true);
margin: 0px 0px 0px 0px;
border-radius: 10px;
min-width: 30px;
min-height: 30px;
background-color: rgba(0, 0, 0, 0); //$crust;
padding: 0px;
&:hover {
background-color: transparentize($red, .5);
}
&:active {
background-image: none;
background-color: $red;
}
}
.description {
min-width: 350px;
}
}
}