diff --git a/CHANGELOG.md b/CHANGELOG.md index d727de996e..cd1eb95c83 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,10 @@ Versioning](https://semver.org/spec/v2.0.0.html). ## [Unrealeased] +### Added + +- Notification plugin for Course Detail pages + ## [2.25.0-beta.1] ### Fixed diff --git a/sandbox/settings.py b/sandbox/settings.py index 30364cd0e7..4d9c91a646 100644 --- a/sandbox/settings.py +++ b/sandbox/settings.py @@ -420,6 +420,7 @@ class Base(StyleguideMixin, DRFMixin, RichieCoursesConfigurationMixin, Configura "richie.plugins.simple_picture", "richie.plugins.simple_text_ckeditor", "richie.plugins.lti_consumer", + "richie.plugins.notification", "richie", # Third party apps "dj_pagination", diff --git a/src/frontend/scss/colors/_theme.scss b/src/frontend/scss/colors/_theme.scss index 0ee5b3ce14..1624dd2ecc 100644 --- a/src/frontend/scss/colors/_theme.scss +++ b/src/frontend/scss/colors/_theme.scss @@ -557,6 +557,15 @@ $r-theme: ( content-color: r-color(purplish-grey), title-color: r-color('charcoal'), ), + notification-plugin: ( + info-background-color: r-color('info-300'), + text-color: r-color('black'), + warn-background-color: r-color('warning-400'), + border-radius: 10px, + icon-stroke-color: r-color('black'), + icon-width: 24px, + icon-height: 24px, + ) ) !default; // On a Richie child project you can easily change a specific value using: diff --git a/src/frontend/scss/components/_index.scss b/src/frontend/scss/components/_index.scss index 2dd0c102f4..ebdc460d63 100644 --- a/src/frontend/scss/components/_index.scss +++ b/src/frontend/scss/components/_index.scss @@ -53,6 +53,7 @@ @import './templates/courses/plugins/category_plugin'; @import './templates/courses/plugins/licence_plugin'; +@import './templates/courses/plugins/notifications_plugin'; @import './templates/richie/section/section'; @import './templates/richie/large_banner/large_banner'; @import './templates/richie/nesteditem/nesteditem'; diff --git a/src/frontend/scss/components/templates/courses/plugins/_notifications_plugin.scss b/src/frontend/scss/components/templates/courses/plugins/_notifications_plugin.scss new file mode 100644 index 0000000000..341c125dfe --- /dev/null +++ b/src/frontend/scss/components/templates/courses/plugins/_notifications_plugin.scss @@ -0,0 +1,48 @@ +// change measurement units to rem +.notification-alert { + &__wrapper { + display: flex; + padding: 1rem; + border-radius: r-theme-val(notification-plugin, border-radius); + width: 100%; + margin-block-end: 1rem; + } + + &__icon { + display: flex; + align-items: center; + padding: 1rem; + margin-inline-end: 0.4rem; + + & svg { + fill: none !important; + stroke: r-theme-val(notification-plugin, icon-stroke-color); + height: r-theme-val(notification-plugin, icon-height); + width: r-theme-val(notification-plugin, icon-width); + flex-shrink: 0; + } + } + + &__content { + h2 { + margin-block-start: 0.6rem; + font-size: 0.9rem; + } + + p { + margin-block-end: 0.6rem; + font-size: 0.9rem; + } + } +} + +.info { + background-color: r-theme-val(notification-plugin, info-background-color); + color: r-theme-val(notification-plugin, text-color); + +} + +.warning { + background-color: r-theme-val(notification-plugin, warn-background-color); + color: r-theme-val(notification-plugin, text-color); +} \ No newline at end of file diff --git a/src/richie/apps/courses/settings/__init__.py b/src/richie/apps/courses/settings/__init__.py index f73e39c328..9f2745af84 100644 --- a/src/richie/apps/courses/settings/__init__.py +++ b/src/richie/apps/courses/settings/__init__.py @@ -245,6 +245,10 @@ def richie_placeholder_conf(name): "name": _("Assessment and Certification"), "plugins": ["CKEditorPlugin"], }, + "courses/cms/course_detail.html course_notifications": { + "name": _("Notifications"), + "plugins": ["NotificationPlugin"], + }, # Organization detail "courses/cms/organization_detail.html banner": { "name": _("Banner"), diff --git a/src/richie/apps/courses/templates/courses/cms/course_detail.html b/src/richie/apps/courses/templates/courses/cms/course_detail.html index 1e4149d496..e098384287 100644 --- a/src/richie/apps/courses/templates/courses/cms/course_detail.html +++ b/src/richie/apps/courses/templates/courses/cms/course_detail.html @@ -61,6 +61,14 @@
{{ instance.message }}
+