Ошибка при попытке скомпилировать SASS в CSS для веб-сайта

Удалите {} ... они вам не нужны

@mixin something
  attribute: value

Я починил твой файл за тебя.

Найдите его в конце этого поста.

Основная проблема заключается в том, что вы смешали некоторый CSS (от строки 1 до 148) с остальной частью вашего файла Sass (от 148 до конца файла). Вы не можете просто скопировать вставку CSS в файл Sass. Вы должны адаптировать это.

Вот ваши проблемы:

1. Строка 1 и 148, была странная вещь **' (я думаю, это из-за некоторый копипастинг), удалил его.
2. Sass не использует точки с запятой для завершения строк, я удалил их все
3. @mixin - это ключевое слово SCSS, а не ключевое слово Sass, вместо этого вы должны использовать =, я заменил все ваши @mixin на =
4. Фигурные скобки в Sass не используются, только отступы, я удалил все {}

Теперь вот ваш файл mixins.sass, написанный на простом синтаксисе Sass:

//TEXT MIXINS
=h1-text
  color: $red-text
  font-family: $font-stack
  font-size: $font-size
  font-weight: $font-weight-nav
  letter-spacing: $h1-letter-spacing
  text-align: $alignment
  border: $border-original
  border-radius: $border-radius

=h1-hover
  color: $orange-text
  background-color: $navbar-background
  border: $border-original2

=h2-text
  color: $orange-text
  font-family: $font-stack
  font-size: $font-size
  font-weight: $font-weight-nav
  letter-spacing: $h2-letter-spacing
  text-align: $alignment
  border: $border-original2
  border-radius: $border-radius

=h2-hover
  color: $red-text
  background-color: $navbar-background
  border: $border-original

=h3-text
  color: $darkred-text
  font-family: $font-stack
  font-size: $h3-font-size
  font-weight: $font-weight-main
  text-align: $alignment

//MAIN TEXT BORDER MIXIN
=border1-main
  border: $border-modified
  border-radius: $border-radius2
  margin-top: 100px
  margin-bottom: 150px

//DIV MIXINS
=div
  width: $div-width
  margin: $div-align

=div2
  width: $div-width2
  margin: $div-align

//NAVBAR MIXINS
=navbar-main
  overflow: hidden
  background-color: $navbar-background

=navbar-fade-in
  opacity: 1
  transition: opacity .25s ease-in-out
  -moz-transition: opacity .25s ease-in-out
  -webkit-transition: opacity .25s ease-in-out

=navbar-a
  float: left
  dispaly: block
  color: $darkred-text
  font-family: $font-stack
  text-align: center
  padding: 14px
  letter-spacing: $navbar-letter-spacing
  text-decoration: none

=navbar-a-hover
  background-color: $background
  color: $red-text

=content-navbar
  padding: 16px

=sticky
  position: fixed
  top: 0
  width: 100%

=sticky-content
  padding-top: 60px

//SOCIAL BAR MIXINS
=icon-bar
  position: fixed
  top: 50%
  -webkit-transform: translateY (-50%)
  -ms-transform: translateY (-50%)
  transform: translateY (-50%)

=icon-bar-a
  display: block
  text-align: center
  padding: 16px
  transition: all 0.5s ease
  color: $white
  font-size: 15px

=icon-bar-a-hover
  background-color: $navbar-background
  color: #000

=facebook
  background: $facebook
  color: $white

=twitter
  background: $twiter
  color: $white

=google
  background: $google
  color: $white

=linkedin
  background: $linkedin
  color: $white

=youtube
  background: $youtube
  color: $white

//FOOTER MIXIN
=footer-main
  position: fixed
  left: 0
  bottom: 0
  width: 100%
  background-color: $footer-background
  color: $white
  text-align: center

//CURSOR EDIT MIXIN
=cursor1
  cursor: $cursor-removal

=cursor2
  cursor: $cursor-removal2

//text-colors
$red-text: #FF0000
$darkred-text: #C60505
$orange-text: #FF5733
$white: white

//background color
$background: #ECFFFE
$navbar-background: #E1F1F0
$footer-background: #E1F1F0

//social bar
$facebook: #3B5998
$twitter: #55ACEE
$google: #DD4B39
$linkedin: #007BB5
$youtube: #BB0000

//typography
$font-stack:    source-sans-pro, "Helvetica Neue", Helvetica, Arial, sans-serif
$font-stack-hover: "monospace"
$font-size: 30px
$h3-font-size: 25px
$h3-font-size-2: 20px
$font-weight-nav: 500
$font-weight-main: 400
$alignment: center
$h1-letter-spacing: 3px
$h2-letter-spacing: 3px
$navbar-letter-spacing: 2px

//borders
$border-original: 3px solid $red-text
$border-original2: 3px solid $orange-text
$border-modified: 2px solid $navbar-background
$border-radius: 30px
$border-radius2: 10px


//cursor
$cursor-removal: pointer
$cursor-removal2: default

//divs
$div-width: 400px
$div-width2: 800px
$div-align: auto