Please help me out .scss file doesn't compile Sass map

Solved
Highlighted
Tourist
10 1 0

Hi guys,

 

I want to use Sass map in my .scss file, but it doesn't seem to compile successfully. In fact, it breaks everything declare a map variable. Does someone have a workaround for this? Thanks in adavance.

0 Likes
Highlighted
Shopify Partner
1777 211 370

Please share the snippet you are adding to a SCSS.

Sergiu Svinarciuc | CTO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes
Highlighted
Shopify Partner
380 28 48

@66zombiestech 

Please share the snippet code and store the URL. So I can give you a proper solution.

Thanks & Regards
Akshay Vaghasiya

Shopify Expert | Skype: akshayvaghasiya84
 - Like and Mark as an Accepted Solution if my reply helpful
 - Feel free to contact me on akshayvaghasiya84@gmail.com for any queries
 - Want to modify or custom changes on store hire me .
0 Likes
Highlighted
Tourist
10 1 0

Here it is.

$phablet-breakpoint: 37em;
$tablet-breakpoint: 48em;
$desktop-breakpoint: 64em;
$large-desktop-breakpoint: 80em;

$map-grid-props: (
   '-md': $tablet-breakpoint,
   '-lg': $desktop-breakpoint
 );

 

0 Likes
Highlighted
Shopify Partner
380 28 48

@66zombiestech 

check your scss file you had included that three variables or not?

$map-grid-props:
$tablet-breakpoint
$desktop-breakpoint

Thanks & Regards
Akshay Vaghasiya

Shopify Expert | Skype: akshayvaghasiya84
 - Like and Mark as an Accepted Solution if my reply helpful
 - Feel free to contact me on akshayvaghasiya84@gmail.com for any queries
 - Want to modify or custom changes on store hire me .
0 Likes
Highlighted
Shopify Partner
1777 211 370

that is really odd, just tried your snippet on one of the themes and it got saved just fine. Either the snippet is misplaced or maybe there is an issue with the encoding? Usually happens with quotes and double quotes.

Sergiu Svinarciuc | CTO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes
Highlighted
Tourist
10 1 0

They are included. My code works just fine on Codepen. I even tried a simple map variable like 

$map: (
  'foo': 'bar'
);
and the code breaks after compiled... :(
0 Likes
Highlighted
Tourist
10 1 0

Is it possible that this happens because I code it directly in application.scss in assets folder?

0 Likes
Highlighted
Shopify Partner
1777 211 370

Nope, you are supposed to do so, if you are referring to the Shopify Theme Code editor? Or you are doing that locally and use tools to build and deploy theme?

Sergiu Svinarciuc | CTO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes
Highlighted
Tourist
10 1 0

I tried both and they didn't work. This is kinda weird and frustrating...

0 Likes