Hi all. I’m trying to add my own theme for OpenedX where $primary in _variables.scss isn’t a color, and when I compile the styles, I get the following error:
#0 9.541 Compiling Sass for theme at /openedx/themes/modern-theming...
#0 9.541 Compiling default LMS Sass with themed partials...
#0 9.541 Source: lms/static/sass
#0 9.541 Target: /openedx/themes/modern-theming/lms/static/css
#0 9.541 Include paths:
#0 9.541 common/static
#0 9.541 common/static/sass
#0 9.541 node_modules/@edx
#0 9.541 node_modules
#0 9.541 /openedx/themes/modern-theming/lms/static/sass/partials
#0 9.541 lms/static/sass/partials
#0 9.541 lms/static/sass
#0 9.541 Files:
#0 9.541 lms/static/sass/lms-mobile-rtl.scss -> /openedx/themes/modern-theming/lms/static/css/lms-mobile-rtl.css
#0 9.574 Traceback (most recent call last):
#0 9.574 File "/openedx/edx-platform/scripts/compile_sass.py", line 503, in <module>
#0 9.575 main(prog_name="npm run compile-sass --")
#0 9.575 File "/openedx/venv/lib/python3.11/site-packages/click/core.py", line 1157, in __call__
#0 9.575 return self.main(*args, **kwargs)
#0 9.575 ^^^^^^^^^^^^^^^^^^^^^^^^^^
#0 9.575 File "/openedx/venv/lib/python3.11/site-packages/click/core.py", line 1078, in main
#0 9.575 rv = self.invoke(ctx)
#0 9.575 ^^^^^^^^^^^^^^^^
#0 9.575 File "/openedx/venv/lib/python3.11/site-packages/click/core.py", line 1434, in invoke
#0 9.575 return ctx.invoke(self.callback, **ctx.params)
#0 9.576 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
#0 9.576 File "/openedx/venv/lib/python3.11/site-packages/click/core.py", line 783, in invoke
#0 9.576 return __callback(*args, **kwargs)
#0 9.576 ^^^^^^^^^^^^^^^^^^^^^^^^^^^
#0 9.576 File "/openedx/venv/lib/python3.11/site-packages/click/decorators.py", line 33, in new_func
#0 9.576 return f(get_current_context(), *args, **kwargs)
#0 9.576 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
#0 9.576 File "/openedx/edx-platform/scripts/compile_sass.py", line 397, in main
#0 9.576 compile_sass_dir(
#0 9.576 File "/openedx/edx-platform/scripts/compile_sass.py", line 252, in compile_sass_dir
#0 9.576 raise Exception(f"Failed to compile {source}: {output_text}")
#0 9.576 Exception: Failed to compile lms/static/sass/lms-mobile-rtl.scss: Error: argument `$color` of `darken($color, $amount)` must be a color
#0 9.576
#0 9.576 Backtrace:
#0 9.576 node_modules/bootstrap/scss/mixins/_background-variant.scss:11, in function `darken`
#0 9.576 node_modules/bootstrap/scss/mixins/_background-variant.scss:11, in mixin `@content`
#0 9.576 node_modules/bootstrap/scss/mixins/_hover.scss:21, in mixin `hover-focus`
#0 9.576 node_modules/bootstrap/scss/mixins/_background-variant.scss:10, in mixin `bg-variant`
#0 9.576 node_modules/bootstrap/scss/utilities/_background.scss:4
#0 9.576 on line 11 of node_modules/bootstrap/scss/mixins/_background-variant.scss
#0 9.576 >> @include hover-focus {
#0 9.576 ------------------------^
This happens because the bg-variant mixin in the darken function expects a color. I think the problem could be solved by overriding this mixin so that it stops using darken or by making it work for me… The problem is that I have tried everything to override this mixin and I can’t… What should the file be and in which path of my-theme/lms/static/sass/partials/lms/theme should I place it?