diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/index.js b/src/Bundle/ChillMainBundle/Resources/public/chill/index.js index 2e13bcc06..dda7b7e67 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/index.js +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/index.js @@ -25,6 +25,7 @@ import { chill } from './js/chill.js'; global.chill = chill; require('./js/date.js'); +require('./js/counter.js'); /// Load fonts require('./fonts/OpenSans/OpenSans.scss') diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/js/counter.js b/src/Bundle/ChillMainBundle/Resources/public/chill/js/counter.js new file mode 100644 index 000000000..c5cad2f0a --- /dev/null +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/js/counter.js @@ -0,0 +1,35 @@ +/** + * + * This script search for span.counter elements like + * Il y a 4 notifications + * and return + * Il y a 4 notifications + * + */ +const isNum = (v) => !isNaN(v); + +const parseCounter = () => { + document.querySelectorAll('span.counter') + .forEach(el => { + let r = []; + el.innerText + .trim() + .split(' ') + .forEach(w => { + if (isNum(w)) { + r.push(`${w}`); + } else { + r.push(w); + } + }) + ; + el.innerHTML = r.join(' '); + }) + ; +}; + +window.addEventListener('DOMContentLoaded', function (e) { + parseCounter(); +}); + +export { parseCounter }; diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss index 15f6deb3a..3f7601721 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss @@ -82,7 +82,7 @@ div#notification-fold { // Counter div.notification-counter { - span { + span.counter { &:not(:first-child) { &::before { content: '/ '; @@ -90,3 +90,11 @@ div.notification-counter { } } } +span.counter { + & > span { + font-weight: bold; + background-color: $chill-ll-gray; + padding: 0 0.4rem; + border-radius: 50%; + } +} \ No newline at end of file diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index b87fd11e8..a32cc7a55 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -73,8 +73,8 @@