Theming: Import basic theme builder error

[Saidabbos]

When I import ~truly-ui/css/theming/builders/basic/index in my style.scss , I'm getting error like this

ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):

@import "../../../accordion/accordion-theme";
@import "../../../accordion/parts/accordion-item/accordion-item-theme";
@import "../../../autocomplete/autocomplete-theme";
@import "../../../avatar/avatar-theme";
@import "../../../badge/badge-theme";
@import "../../../button/button-theme";
@import "../../../buttongroup/buttongroup-theme";
@import "../../../dropdownicon/dropdownicon-theme";
@import "../../../calendar/calendar-theme";
@import "../../../chatlist/chatlist-theme";
@import "../../../checkbox/checkbox-theme";
@import "../../../contextmenu/contextmenu-theme";
@import "../../../colorpicker/colorpicker-theme";
@import "../../../colorpicker/parts/colorpicker-content/colorpicker-content-theme";
@import "../../../colorpicker/parts/colorpicker-input/colorpicker-input-theme";
@import "../../../core/core";
@import "../../../datatable/datatable-theme";
@import "../../../date/date-theme";
@import "../../../dialog/dialog-error/dialog-error-theme";
@import "../../../dropdownlist/dropdownlist-theme";
@import "../../../editor/editor-theme";
@import "../../../form/form-theme";
@import "../../../input/input-theme";
@import "../../../listbox/listbox-theme";
@import "../../../popupmenu/popupmenu-theme";
@import "../../../menu/menu-theme";
@import "../../../menu/parts/simple/simple-sub-menu-theme";
@import "../../../menu/parts/advanced/parts/advanced-sub-menu-theme";
@import "../../../menu/parts/advanced/advanced-root-menu-theme";
@import "../../../modal/modal-theme";
@import "../../../modal/addons/modal-toolbar/modal-toolbar-theme";
@import "../../../multiselect/multiselect-theme";
@import "../../../navigator/navigator-theme";
@import "../../../overlaylist/overlaylist-theme";
@import "../../../overlaylist/list-item/list-item-theme";
@import "../../../overlaypanel/overlay-panel-theme";
@import "../../../panelgroup/panelgroup-theme";
@import "../../../progressbar/progressbar-theme";
@import "../../../permissions/permissions-theme";
@import "../../../radiobutton/radiobutton-theme";
@import "../../../splitbutton/splitbutton-theme";
@import "../../../stopwatch/stopwatch-theme";
@import "../../../switch/switch-theme";
@import "../../../tabcontrol/tabcontrol-theme";
@import "../../../textarea/textarea-theme";
@import "../../../timepicker/timepicker-theme";
@import "../../../time-available-picker/time-available-picker-theme";
@import "../../../internals/components/tag/tag-theme";
@import "../../../toaster/parts/toaster-theme";
@import "../../../toolbar/toolbar-theme";
@import "../../../clockpicker/clockpicker-theme";
@import "../../../timeline/timeline-theme";
@import "../../../timeline/parts/timeline-item/timeline-item-theme";

@mixin truly-all-components($theme) {
  @include tl-accordion-theme($theme);
  @include tl-accordion-item-theme($theme);
  @include tl-autocomplete-theme($theme);
  @include tl-avatar-theme($theme);
  @include tl-badge-theme($theme);
  @include tl-button-group-theme($theme);
  @include tl-button-theme($theme);
  @include tl-dropdown-icon-theme($theme);
  @include tl-calendar-theme($theme);
  @include tl-chatlist-theme($theme);
  @include tl-checkbox-theme($theme);
  @include tl-contextmenu-theme($theme);
  @include tl-colorpicker-theme($theme);
  @include tl-colorpicker-content-theme($theme);
  @include tl-colorpicker-input-theme($theme);
  @include tl-core-theme($theme);
  @include tl-date-theme($theme);
  @include tl-datatable-theme($theme);
  @include tl-dialog-error-theme($theme);
  @include tl-dropdonwlist-theme($theme);
  @include tl-editor-theme($theme);
  @include tl-form-theme($theme);
  @include tl-input-theme($theme);
  @include tl-listbox-theme($theme);
  @include tl-list-item-theme($theme);
  @include tl-popupmenu-theme($theme);
  @include tl-menu-theme($theme);
  @include tl-advanced-root-menu-theme($theme);
  @include tl-advanced-sub-menu-theme($theme);
  @include tl-simple-sub-menu-theme($theme);
  @include tl-modal-theme($theme);
  @include tl-modal-toolbar-theme($theme);
  @include tl-multiselect-theme($theme);
  @include tl-navigator-theme($theme);
  @include tl-overlaylist-theme($theme);
  @include tl-overlay-panel-theme($theme);
  @include tl-panelgroup-theme($theme);
  @include tl-permissions-theme($theme);
  @include tl-progressbar-theme($theme);
  @include tl-radiobutton-theme($theme);
  @include tl-splitbutton-theme($theme);
  @include tl-stopwatch-theme($theme);
  @include tl-switch-theme($theme);
  @include tl-tabcontrol-theme($theme);
  @include tl-textarea-theme($theme);
  @include tl-timepicker-theme($theme);
  @include tl-time-available-picker-theme($theme);
  @include tl-tag-theme($theme);
  @include tl-toaster-theme($theme);
  @include tl-toolbar-theme($theme);
  @include tl-clockpicker-theme($theme);
  @include tl-timeline-theme($theme);
  @include tl-timeline-item-theme($theme);
}

       ^
      Can't find stylesheet to import.
  ╷
1 │ @import "../../../accordion/accordion-theme";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  node_modules\truly-ui\css\theming\_components.scss 1:9            @import
  node_modules\truly-ui\css\theming\builders\basic\_index.scss 1:9  @import
  stdin 3:9                                                         root stylesheet

[welcome[bot]]

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

[abalad]

Hello @Saidabbos, are you trying to create a custom theme for your application? If so, we are correcting this implementation, but you can use the themes already created by our team.

You can view how to use themes already created in this session: http://truly-ui.com/theming - Using a pre-built theme

[Saidabbos]

@abalad thank you for response. As long as I'm using default theme. But I hope you'll fix it soon

[nascarjake]

@abalad I am trying to do the same thing @Saidabbos did - following the instructions to create a custom theme. All I'm concerned about is making a dark mode. I followed the instructions and got the same accordian error as above. I also tried going into the _default-theme.scss within my node_modules/truly-ui folder and make the changes there. But it didnt seem to take effect. I assume my changes arent built into whatever is being required.

Any solution to this? All I want is a dark theme.

[nascarjake]

@abalad Any news on this? I've seen that you guys are working on making the documentation better - so I know this is all being worked on, not trying to rush that - just wondering if theres something i can do in the interim to get a dark mode working. Thanks for all your hard work.

[CarlosBC]

TWO YEARS HAVE PAST! And anyone fixed this. Truly.ui is a great library, but it's support it's terrible, they never fixed the problems that i had. It's a shame for this good library, but it becomes not usable for simple errors like this.