CODEWITHSUNDEEP
csssass
Abhi
Abhi

Reputation: 4261

Importing SASS mixin into SCSS

I have a file called mixins.sass with following code:

=loader
  .loader
    margin: 100px auto
    font-size: 25px
    width: 1em
    height: 1em
    border-radius: 50%
    position: relative
    text-indent: -9999em
    -webkit-animation: load5 1.1s infinite ease
    animation: load5 1.1s infinite ease
    -webkit-transform: translateZ(0)
    -ms-transform: translateZ(0)
    transform: translateZ(0)

I'm trying to import it into a SCSS file, like:

#loader_div {
  +loader
  position: absolute;
  height: 100%;
  width: 100%;

But, I get error:

Invalid CSS after "...ition: absolute": expected "{", was ";"

How can I import SASS mixin into SCSS?

Upvotes: 2

Views: 781

Answers (1)

Abhi
Abhi

Reputation: 4261

Ok I got my answer, the difference lies in way of defining and importing SASS/SCSS mixin.

SCSS

@mixin border-radius($radius) {
  .
  .
  .
}

.box { @include border-radius(10px); }

SASS

=border-radius($radius)
  .
  .
  .

.box
  +border-radius(10px)

So, for my case when I did @include loader;, it fixed my issue.

Hope This Helps Someone

Upvotes: 1

Related Questions