@deniskins23

Почему миксины sass выдают ошибку?

Доброго времени суток. ПОдскажите кто знает. Написал в sass с синтаксисом .sass такую миксину
=font($alias, $name)
  font-family: $alias
  src: url(./assets/fonts/" + $name + ".woff") format(woff), url(./assets/fonts/" + $name + ".woff2") format(woff2)
  font-weight: normal
  font-style: normal

Вызываю ее так
+font(Roboto, Roboto)
Проект собирается с помощью галпа и консоль выдает такую ошибку
Details:
    status: 1
    file: D:/project/tasia/app/config/_mixins.sass
    line: 28
    column: 3
    formatted: Error: Properties are only allowed w
ithin rules, directives, mixin includes, or other p
roperties.
        on line 28 of app/config/_mixins.sass
        from line 5 of app/blocks/common.sass
>>   font-family: $alias;

В чем может быть проблема?
  • Вопрос задан
  • 88 просмотров
Решения вопроса 1
Hyubert
@Hyubert
JS
а что такое =font?

sass mixin:
@mixin font-face($name, $source, $bold: normal, $italic: normal)
	@font-face
		font-family: $name
		src: url($source + ".ttf")
		src: url($source + ".woff") format('woff')
		font-weight: $bold
		font-style: $italic

// GothamPro
+font-face('GothamPro', '../fonts/GothamPro/GothamPro-Black', 900)


и да для IE10+ достаточно .ttf и .woff + для ретины можно добавить .svg

А если используете webfont то можна делать так
+font-face('GothamPro', '../fonts/GothamPro/GothamPro-Black', 900)
+font-face('GothamPro', '../fonts/GothamPro/GothamPro', 400)
+font-face('GothamPro', '../fonts/GothamPro/GothamPro-Light', 300)
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы