codyhouse / codyhouse-framework

A lightweight front-end framework for building accessible, bespoke interfaces.
https://codyhouse.co/
MIT License
1.16k stars 171 forks source link

Using breakpoint mixin throws an error #137

Closed lro-tiierisch closed 1 year ago

lro-tiierisch commented 1 year ago

Hey, if I download the v3 framework master and follow your docs and change the file main/assets/css/style.scss to

@use 'base' with (
  $breakpoints: (
    'xs': 32rem, // ~512px
    'sm': 48rem, // ~768px
    'md': 64rem, // ~1024px
    'lg': 80rem, // ~1280px
    'xl': 90rem  // ~1440px
  ),
  $grid-columns: 12
);

@use 'custom-style';
@use 'components/**/*.scss';

@include breakpoint(md) {
  /* your code here */
}

I get an error message saying

Message:
    main\assets\css\style.scss
Error: Undefined mixin.
   ╷
15 │ ┌ @include breakpoint(md) {
16 │ │   /* your code here */
17 │ └ }
   ╵
  main\assets\css\style.scss 15:1  root stylesheet

I never worked with SASS mixins so I don't know if I'm missing something here.

lro-tiierisch commented 1 year ago

Ok it seems like I have to include the filename of the file from which I am importing the mixin when using it. So because I use the forwarded mixin from the _base.scss file, I have to @include it like this:

@include base.breakpoint(md) {
  /* your code here */
}