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

Merged from develop, made 'new notices' into a 'show new' button placed on the heading element, updated headings and buttons to be more consistent with new changes (log-in, notifications/read, conversation/collapse), changed bottom 'load older' block to not disappear on click to keep screen from scrolling and changed its styling more consistent with everything else.

Browse source
This commit is contained in:
shpuld 2017-03-05 19:00:35 +02:00
commit e19bfb9a22
14 changed files with 88 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -9,16 +9,16 @@
button {
position: absolute;
padding: 0.1em 0.3em 0.25em 0.3em;
right: 0.6em;
right: 0.7em;
}
}
.unseen {
border-left: 4px solid rgba(255, 48, 16, 0.65);
}
.notification {
padding: 0.4em 0 0 0.7em;
// Will have to use pixels here to ensure consistent distance with
// pad alone and pad + border, browsers bad at rounding this with em,
// they love to give a 1 pixel ghost offset with 0.7em vs 0.3em + 0.4em,
// which does not happen with 10px vs 4px + 6px.
padding: 0.4em 0 0 10px;
display: flex;
border-bottom: 1px solid silver;
@ -62,4 +62,9 @@
border: none
}
}
.unseen {
border-left: 4px solid rgba(255, 48, 16, 0.65);
padding-left: 6px;
}
}

2
src/components/notifications/notifications.vue
View file

@ -3,7 +3,7 @@
<div class="panel panel-default base00-background">
<div class="panel-heading base01-background base04">
Notifications ({{unseenCount}})
<button @click.prevent="markAsSeen" class="base05 base02-background">Read!</button>
<button @click.prevent="markAsSeen" class="base06 base02-background">Read!</button>
</div>
<div class="panel-body">
<div v-for="notification in visibleNotifications" class="notification" :class='{"unseen": !notification.seen}'>