From 378aaefbbf60698c7b8faafc20f6b8cb22357e31 Mon Sep 17 00:00:00 2001 From: Thomas Citharel Date: Thu, 15 Jun 2017 09:43:48 +0200 Subject: Notifications Signed-off-by: Thomas Citharel --- .../static/themes/material/css/index.scss | 1 + app/Resources/static/themes/material/css/nav.scss | 4 +++ .../static/themes/material/css/notifications.scss | 38 ++++++++++++++++++++++ .../static/themes/material/css/sidenav.scss | 11 +++++++ .../static/themes/material/css/various.scss | 6 ++++ app/Resources/static/themes/material/index.js | 3 +- app/Resources/static/themes/material/js/tools.js | 9 ++++- 7 files changed, 70 insertions(+), 2 deletions(-) create mode 100644 app/Resources/static/themes/material/css/notifications.scss (limited to 'app/Resources/static/themes') diff --git a/app/Resources/static/themes/material/css/index.scss b/app/Resources/static/themes/material/css/index.scss index 285a6504..8300e430 100644 --- a/app/Resources/static/themes/material/css/index.scss +++ b/app/Resources/static/themes/material/css/index.scss @@ -8,6 +8,7 @@ @import 'layout'; @import 'nav'; @import 'sidenav'; +@import 'notifications'; @import 'various'; /* Tools */ diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index 1a25a5be..601aada2 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -104,3 +104,7 @@ nav { #button_export { display: none; } + +#button_notifications a.nav-panel-menu { + max-height: 65px; +} diff --git a/app/Resources/static/themes/material/css/notifications.scss b/app/Resources/static/themes/material/css/notifications.scss new file mode 100644 index 00000000..60114ce4 --- /dev/null +++ b/app/Resources/static/themes/material/css/notifications.scss @@ -0,0 +1,38 @@ +@mixin notification { + .notifications-area { + flex-grow: 1; + + .collection { + margin: auto; + } + } + + .no-notifications { + position: absolute; + top: 40%; + left: 50%; + transform: translate(-40%, -50%); + } + + .view-more { + display: block; + margin: auto 5px 10px; + flex: 0 1 2.5em; + } + + .btn.notification-action-button { + display: block; + line-height: 25px; + height: auto; + } +} + +.notifications-page { + @include notification; + + .pagination { + float: none; + text-align: center; + margin-top: 30px; + } +} diff --git a/app/Resources/static/themes/material/css/sidenav.scss b/app/Resources/static/themes/material/css/sidenav.scss index 416dc1c7..a86eed17 100644 --- a/app/Resources/static/themes/material/css/sidenav.scss +++ b/app/Resources/static/themes/material/css/sidenav.scss @@ -2,6 +2,8 @@ Side-nav ========================================================================== */ +@import 'notifications'; + .side-nav { width: 240px; @@ -36,6 +38,15 @@ } } +#notifications { + width: 300px; + display: flex; + flex-flow: column; + justify-content: space-between; + + @include notification; +} + .bold > a { font-weight: bold; } diff --git a/app/Resources/static/themes/material/css/various.scss b/app/Resources/static/themes/material/css/various.scss index 7daf40ec..300015ab 100644 --- a/app/Resources/static/themes/material/css/various.scss +++ b/app/Resources/static/themes/material/css/various.scss @@ -30,3 +30,9 @@ nav .input-field input { .tab { flex: 1; } + +#notifications-count { + position: relative; + top: -50px; + left: 15px; +} diff --git a/app/Resources/static/themes/material/index.js b/app/Resources/static/themes/material/index.js index d6afbb8a..435cd02f 100755 --- a/app/Resources/static/themes/material/index.js +++ b/app/Resources/static/themes/material/index.js @@ -8,7 +8,7 @@ import 'materialize-css/dist/js/materialize'; import '../_global/index'; /* Tools */ -import { initExport, initFilters } from './js/tools'; +import { initExport, initFilters, initNotifications } from './js/tools'; /* Import shortcuts */ import './js/shortcuts/main'; @@ -34,6 +34,7 @@ $(document).ready(() => { }); initFilters(); initExport(); + initNotifications(); $('#nav-btn-add-tag').on('click', () => { $('.nav-panel-add-tag').toggle(100); diff --git a/app/Resources/static/themes/material/js/tools.js b/app/Resources/static/themes/material/js/tools.js index 39398fd8..492640a0 100644 --- a/app/Resources/static/themes/material/js/tools.js +++ b/app/Resources/static/themes/material/js/tools.js @@ -21,4 +21,11 @@ function initExport() { } } -export { initExport, initFilters }; +function initNotifications() { + if ($('div').is('#notifications')) { + $('#button_notifications').show(); + $('.js-notifications-action').sideNav({ edge: 'right' }); + } +} + +export { initExport, initFilters, initNotifications }; -- cgit v1.2.3