⬆️(funmooc) upgrade richie to v2.14.0

Changelog available at: https://github.com/openfun/richie/releases/tag/v2.14.0
openfun · Apr 4, 2022 · ff40f7e · ff40f7e
1 parent 8f54d35
commit ff40f7e
Show file tree

Hide file tree

Showing 12 changed files with 648 additions and 503 deletions.
diff --git a/sites/funmooc/CHANGELOG.md b/sites/funmooc/CHANGELOG.md
@@ -12,7 +12,7 @@ Versioning](https://semver.org/spec/v2.0.0.html).
 
 ### Added
 
-- Enable Xiti course enrollment analytics 
+- Enable Xiti course enrollment analytics
 
 ### Changed
 

diff --git a/sites/funmooc/requirements/base.txt b/sites/funmooc/requirements/base.txt
@@ -7,5 +7,5 @@ django-storages==1.11.1
 dockerflow==2022.1.0
 gunicorn==20.1.0
 psycopg2-binary==2.9.3
-richie==2.13.0
+richie==2.14.0
 sentry-sdk==1.5.5
diff --git a/sites/funmooc/src/backend/base/tests/test_templates.py b/sites/funmooc/src/backend/base/tests/test_templates.py
diff --git a/sites/funmooc/src/backend/templates/courses/cms/course_detail.html b/sites/funmooc/src/backend/templates/courses/cms/course_detail.html
diff --git a/sites/funmooc/src/frontend/overrides.json b/sites/funmooc/src/frontend/overrides.json
@@ -1,5 +1,5 @@
 {
   "overrides": {
-    "^.*|(utils/api/web-analytics/index.ts)": "../../../../../../js/utils/api/web-analytics/index.ts"
+    "utils/api/web-analytics/index.ts": "../../../../../../js/utils/api/web-analytics/index.ts"
   }
 }
diff --git a/sites/funmooc/src/frontend/package.json b/sites/funmooc/src/frontend/package.json
@@ -35,7 +35,7 @@
   },
   "homepage": "https://github.com/openfun/richie-site-factory#readme",
   "dependencies": {
-    "richie-education": "2.13.0",
+    "richie-education": "2.14.0",
     "tarteaucitronjs": "1.9.5"
   },
   "devDependencies": {

diff --git a/sites/funmooc/src/frontend/scss/_main.scss b/sites/funmooc/src/frontend/scss/_main.scss
@@ -32,6 +32,7 @@
 
 // Internal addons (import order does matter due to some mixin usage from
 // deeper mixins)
+@import 'richie-education/scss/tools/utils';
 @import 'richie-education/scss/tools/shapes';
 @import 'richie-education/scss/tools/flexbox';
 @import 'richie-education/scss/tools/empty';
@@ -70,14 +71,25 @@
 @import 'richie-education/scss/objects/search-filter-value';
 @import 'richie-education/scss/objects/selector';
 @import 'richie-education/scss/objects/form';
+@import 'richie-education/js/components/AddressesManagement/styles';
+@import 'richie-education/js/components/CourseProductCertificateItem/styles';
+@import 'richie-education/js/components/CourseProductCourseRuns/styles';
+@import 'richie-education/js/components/CourseProductItem/styles';
 @import 'richie-education/js/components/CourseRunEnrollment/styles';
 @import 'richie-education/js/components/LtiConsumer/styles';
 @import 'richie-education/js/components/Modal/styles';
+@import 'richie-education/js/components/PaymentButton/styles';
+@import 'richie-education/js/components/RegisteredCreditCard/styles';
+@import 'richie-education/js/components/SaleTunnel/styles';
+@import 'richie-education/js/components/SaleTunnelStepPayment/styles';
+@import 'richie-education/js/components/SaleTunnelStepResume/styles';
+@import 'richie-education/js/components/SaleTunnelStepValidation/styles';
 @import 'richie-education/js/components/SearchFilterGroup/styles';
 @import 'richie-education/js/components/SearchFilterGroupModal/styles';
 @import 'richie-education/js/components/SearchFiltersPane/styles';
 @import 'richie-education/js/components/SearchInput/styles';
 @import 'richie-education/js/components/Spinner/styles';
+@import 'richie-education/js/components/StepBreadcrumb/styles';
 @import 'richie-education/js/components/UserLogin/styles';
 @import 'richie-education/js/components/UserMenu/styles';
 @import 'richie-education/scss/components/templates/courses/plugins/category_plugin';
@@ -96,12 +108,12 @@
 @import 'richie-education/scss/components/error';
 @import 'richie-education/scss/components/templates/search/search';
 @import 'richie-education/scss/components/templates/richie/single-column';
+@import 'richie-education/scss/components/templates/richie/multiple-columns';
 @import './components/templates/courses/cms/homepage';
 @import 'richie-education/scss/components/templates/courses/cms/organization_list';
 @import 'richie-education/scss/components/templates/courses/cms/organization_detail';
 @import 'richie-education/scss/components/templates/courses/cms/category_list';
 @import 'richie-education/scss/components/templates/courses/cms/category_detail';
-@import './components/templates/courses/cms/course_detail';
 @import 'richie-education/scss/components/templates/courses/cms/person_list';
 @import 'richie-education/scss/components/templates/courses/cms/person_detail';
 @import 'richie-education/scss/components/templates/courses/cms/blogpost_list';

diff --git a/sites/funmooc/src/frontend/scss/colors/_palette.scss b/sites/funmooc/src/frontend/scss/colors/_palette.scss
@@ -24,4 +24,5 @@ $palette: (
   'navy-blue': #001f50,
   'lipstick': #e51a2d,
   'indianred3': #df484b,
+  'mantis': #76ce68,
 );
diff --git a/sites/funmooc/src/frontend/scss/colors/_schemes.scss b/sites/funmooc/src/frontend/scss/colors/_schemes.scss
@@ -8,13 +8,19 @@ $lipstick-scheme: (
   hover-font-color: r-color('white'),
   hover-background: scale-color(r-color('lipstick'), $lightness: -10%),
 );
+$active-scheme: (
+  font-color: r-color('lipstick'),
+  svg-color: r-color('lipstick'),
+  background: transparent,
+  hover-font-color: r-color('indianred3'),
+);
 $indianred3-scheme: (
   font-color: r-color('white'),
   link-color: r-color('light-grey'),
   svg-color: r-color('white'),
   background: r-color('indianred3'),
   hover-font-color: r-color('white'),
-  hover-background: r-color('firebrick6'),
+  hover-background: r-color('lipstick'),
 );
 $darkish-blue-scheme: (
   font-color: r-color('white'),

diff --git a/sites/funmooc/src/frontend/scss/colors/_theme.scss b/sites/funmooc/src/frontend/scss/colors/_theme.scss
@@ -7,22 +7,23 @@ $r-theme: (
     info: $light-scheme,
   ),
   base-schemes: (
-    primary: $lipstick-scheme,
-    secondary: $ocean-blue-scheme,
-    tertiary: $darkish-blue-scheme,
+    active: $active-scheme,
+    clear-red: $clear-red-scheme,
     clear: $white-scheme,
-    light: $light-scheme,
-    lightest: $lightest-scheme,
+    clouds: $clouds-scheme,
+    dark-gradient: $dark-gradient-scheme,
     indianred3: $indianred3-scheme,
-    clear-red: $clear-red-scheme,
-    neutral-gradient: $neutral-gradient-scheme,
     light-gradient: $light-gradient-scheme,
+    light: $light-scheme,
+    lightest: $lightest-scheme,
     middle-gradient: $middle-gradient-scheme,
-    dark-gradient: $dark-gradient-scheme,
-    white-mask-gradient: $white-mask-gradient-scheme,
-    clouds: $clouds-scheme,
+    neutral-gradient: $neutral-gradient-scheme,
+    primary: $lipstick-scheme,
+    secondary: $ocean-blue-scheme,
+    tertiary: $darkish-blue-scheme,
     transparent-clear: $transparent-clear-scheme,
     transparent-darkest: $transparent-darkest-scheme,
+    white-mask-gradient: $white-mask-gradient-scheme,
   ),
   base-gradients: (
     neutral-gradient: $neutral-gradient,
@@ -359,6 +360,7 @@ $r-theme: (
     plan-title-color: r-color('lipstick'),
     license-label-color: r-color('ocean-blue'),
     checkmark-list-decoration: url('../../richie/images/components/checkmark.svg'),
+    checkmark-list-decoration-color:  r-color('ocean-blue'),
     view-more-runs-color: r-color('lipstick'),
     run-catalog-visibility-hidden-logo: url('../../richie/images/catalog_visibility/hidden.svg'),
     run-catalog-visibility-course-only-logo: url('../../richie/images/catalog_visibility/course_only.svg'),
@@ -402,6 +404,19 @@ $r-theme: (
     close-color: r-color('black'),
     overlay-background: r-color('white'),
   ),
+  product-item: (
+    base-background: r-color('white'),
+    base-border: r-color('purplish-grey'),
+    light-color: r-color('white'),
+    base-color: r-color('charcoal'),
+    lighter-color: r-color('battleship-grey'),
+    button-color: r-color('white'),
+    button-background: r-color('firebrick6'),
+  ),
+  registered-credit-card: (
+    title-color: r-color('charcoal'),
+    base-color: r-color('purplish-grey'),
+  ),
   search-filters-group-modal: (
     button-background: r-color('lipstick'),
     button-color: r-color('white'),
@@ -437,8 +452,36 @@ $r-theme: (
     hover-color: r-color('dark'),
     base-border: r-color('light-grey'),
   ),
+  shadowed-box: (
+    base-background: r-color('white'),
+    base-shadow: 0 2px 4px rgba(5, 18, 42, 0.19),
+  ),
   spinner: (
     base-color: r-color('ocean-blue'),
     base-color-light: r-color('white'),
   ),
+  steps-breadcrumb: (
+    icon-background-active: r-color(purplish-grey),
+    icon-background: transparent,
+    icon-border-active: transparent,
+    icon-border: r-color('light-grey'),
+    icon-fill-active: r-color('white'),
+    icon-fill: r-color('light-grey'),
+    icon-outline: rgba(r-color(purplish-grey), 0.25),
+    label-color-active: r-color('charcoal'),
+    label-color: r-color('light-grey'),
+    separator-background-active: rgba(r-color(purplish-grey), 0.6),
+    separator-background: rgba(r-color(purplish-grey), 0.25),
+  ),
+  steps-content: (
+    content-color: r-color(purplish-grey),
+    icon-background: r-color(indianred3),
+    icon-color: r-color('white'),
+    icon-big-background: transparent,
+    icon-big-color: r-color('charcoal'),
+    icon-success-background: r-color('mantis'),
+    icon-success-color: r-color('white'),
+    title-color: r-color('charcoal'),
+    subtitle-color: r-color(purplish-grey),
+  )
 );
diff --git a/sites/funmooc/src/frontend/scss/components/templates/courses/cms/_course_detail.scss b/sites/funmooc/src/frontend/scss/components/templates/courses/cms/_course_detail.scss