설정 내 가변 폭 테마

다시 인사드립니다!

테마에 설정을 추가하려고 하는데 몇 가지 질문이 있습니다.

배경으로 이미지를 업로드할 수 있는 설정과 배경과 관련된 기타 설정이 있어서 welcome-banner 컴포넌트를 살펴봤습니다.

banner_background_image:
  type: upload
  default: ""

banner_background_repeat:
  type: enum
  default: no-repeat
  choices:
    - no-repeat
    - repeat
    - repeat-x
    - repeat-y

banner_background_size:
  type: string
  default: cover
  description: uses ..... CSS background size property</a>

그리고 css 파일에는 다음과 같은 내용이 있습니다:

.welcome-link-banner-wrapper {
    background-color: #{$banner-background-color};
    background-image: url(#{$banner-background-image});
    background-size: #{$banner-background-size};
    background-repeat: #{$banner-background-repeat};
    background-position: center center;
  }

지금 제가 당혹스러운 점은 다른 컴포넌트에서는 $를 사용하는데, 여기서는 #이 사용되고 있다는 것입니다.
그래서 저는 무엇을 사용해야 하는 걸까요? 아니면 상관없는 건가요?

CSS에 대해 또 다른 질문이 있지만, 우선 위 질문을 해결하고 싶습니다.
물론 직접 시도해볼 수도 있지만, 어떤 것이 올바른지 확실하게 알고 싶습니다.