therwi/sunkkoma
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Mark unread notifs with the red line, make read notifs base01 again, center the heading text and move the button to the right of the panel.

Browse source
This commit is contained in:
shpuld 2017-02-24 18:53:53 +02:00
parent 9dfcf8a301
commit 2bfd2190a0
2 changed files with 60 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

94
src/components/notifications/notifications.scss
View file

@ -1,49 +1,65 @@
@import '../../_variables.scss';
.notifications button {
min-height: 20px;
}
.notification {
padding: 0.4em 0 0 0.7em;
display: flex;
border-bottom: 1px solid silver;
.notifications {
.text {
min-width: 0px;
word-wrap: break-word;
line-height:18px;
.icon-retweet {
color: $green;
}
.icon-reply {
color: $blue;
}
h1 {
margin: 0 0 0.3em;
padding: 0;
font-size: 1em;
line-height:20px;
}
padding: 0.3em 0.8em 0.5em;
p {
margin: 0;
margin-top: 0;
margin-bottom: 0.3em;
.panel-heading {
// force the text to stay centered, while keeping
// the button in the right side of the panel heading
position: relative;
button {
position: absolute;
padding: 0.1em 0.3em 0.25em 0.3em;
right: 0.6em;
}
}
.avatar {
padding-top: 0.3em;
width: 32px;
height: 32px;
border-radius: 50%;
.unseen {
border-left: 4px solid rgba(255, 48, 16, 0.65);
}
&:last-child {
border: none
.notification {
padding: 0.4em 0 0 0.7em;
display: flex;
border-bottom: 1px solid silver;
.text {
min-width: 0px;
word-wrap: break-word;
line-height:18px;
.icon-retweet {
color: $green;
}
.icon-reply {
color: $blue;
}
h1 {
margin: 0 0 0.3em;
padding: 0;
font-size: 1em;
line-height:20px;
}
padding: 0.3em 0.8em 0.5em;
p {
margin: 0;
margin-top: 0;
margin-bottom: 0.3em;
}
}
.avatar {
padding-top: 0.3em;
width: 32px;
height: 32px;
border-radius: 50%;
}
&:last-child {
border: none
}
}
}