mirror of
https://github.com/vale981/Vulcan
synced 2025-03-10 12:36:39 -04:00
85 lines
No EOL
1.5 KiB
SCSS
85 lines
No EOL
1.5 KiB
SCSS
$notifications-width: 260px;
|
|
|
|
.notifications{
|
|
@include small{
|
|
margin-bottom: 10px;
|
|
&.no-notifications{
|
|
display: none;
|
|
}
|
|
.read{
|
|
display: none;
|
|
}
|
|
}
|
|
@include medium-large{
|
|
position:fixed;
|
|
height:100%;
|
|
width:$notifications-width;
|
|
top:0px;
|
|
left:-$notifications-width;
|
|
}
|
|
background:#f3f3f3;
|
|
@include single-transition(left, 400ms, ease-out, 0ms);
|
|
z-index: 1000;
|
|
.mark-as-read{
|
|
display:block;
|
|
text-align:center;
|
|
padding:10px;
|
|
font-size:13px;
|
|
border-bottom:1px solid $lighter-grey;
|
|
background:#f3f3f3;
|
|
&:link, &:visited{
|
|
color:$blue;
|
|
}
|
|
}
|
|
ul{
|
|
height:100%;
|
|
overflow:auto;
|
|
li{
|
|
padding:10px;
|
|
border-bottom:1px solid $lighter-grey;
|
|
font-size:13px;
|
|
background:white;
|
|
.notification-timestamp{
|
|
color:$light-text;
|
|
font-size:12px;
|
|
}
|
|
&.read{
|
|
color:$light-text;
|
|
background:#f3f3f3;
|
|
}
|
|
}
|
|
}
|
|
.notifications-open &{
|
|
left:0px;
|
|
@include box-shadow(1px 0px 1px black(0.15));
|
|
}
|
|
}
|
|
|
|
.notifications-toggle{
|
|
@include single-transition(left, 400ms, ease-out, 0ms);
|
|
@include small{
|
|
display: none;
|
|
}
|
|
display:block;
|
|
position:absolute;
|
|
left:0px;
|
|
top:80px;
|
|
white-space:nowrap;
|
|
background:white;
|
|
@include border-radius(0px 3px 3px 0px);
|
|
@include box-shadow(0 1px 1px black(0.15));
|
|
padding:3px 10px;
|
|
font-size:13px;
|
|
z-index: 20;
|
|
&.no-notifications{
|
|
background:white(0.3);
|
|
@include box-shadow(none);
|
|
color:$light-text;
|
|
}
|
|
.notifications-open &{
|
|
@include box-shadow(0 1px 1px black(0.15));
|
|
left: $notifications-width;
|
|
background: white;
|
|
color: $text;
|
|
}
|
|
} |