petr/www.tagesschule-elementa.ch
2
1
Fork 0
forked from TagesschuleElementa/www.tagesschule-elementa.ch
Code Issues Pull Requests Releases Wiki Activity

various fixes

Browse Source
This commit is contained in:
Simon Caminada
2018-03-22 21:15:26 +01:00
parent 81dadc6351
commit 858bfaec98
12 changed files with 44 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
private/js/modules/notifications.js
View File

@@ -1,8 +1,20 @@
$(function() {
var $body = $('body');
var cookie_name = 'last_notification_update';
var last_notification = getCookie(cookie_name);
var $header_button_notification = $('.header__button--notification');
var current_notification = $header_button_notification.attr('data-updated');
if (last_notification !== current_notification) {
$header_button_notification.addClass('new');
}
$body.on('click', '.header__button--notification', function(event) {
event.preventDefault();
setCookie(cookie_name, current_notification, 90);
$(this).removeClass('new');
$body.toggleClass('notification_open');
});

8
private/scss/modules/_header.scss
View File

@@ -368,9 +368,11 @@
.header__button--notification {
font-size: 0;
padding-left: 0;
.header__button__icon {
transform-origin: 50% 30%;
animation: ring 2s $easeOutQuad infinite;
&.new {
.header__button__icon {
transform-origin: 50% 30%;
animation: ring 2s $easeOutQuad infinite;
}
}
svg {
transform: none;

8
private/scss/modules/_notification.scss
View File

@@ -9,7 +9,7 @@
box-shadow: 0 0 em(30px) rgba($black, 0.2);
transform: scale(0);
opacity: 0;
transform-origin: 23% 5%;
transform-origin: 50% 5%;
transition: transform 0.3s $easeOutQuad, opacity 0.3s $easeOutQuad;
&:before {
content: '';
@@ -18,7 +18,7 @@
z-index: -2;
position: absolute;
top: em(-10px);
right: em(187px);
right: em(122px);
width: em(20px);
height: em(20px);
transform: rotate(45deg);
@@ -32,9 +32,9 @@
margin-top: 46px;
}
@media screen and (max-width: $small_breakpoint) {
transform-origin: 36% 5%;
transform-origin: 58% 5%;
&:before {
right: em(157px);
right: em(102px);
}
}
}