# Theme with variable width inside settings

**URL:** <https://meta.discourse.org/t/theme-with-variable-width-inside-settings/192790>\
**Category:** UX\
**Created:** [June 5, 2021, 8:00pm UTC](https://meta.discourse.org/t/theme-with-variable-width-inside-settings/192790 "2021-06-05T20:00:49Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![daemon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/daemon/32/256632_2.png) [@daemon](https://meta.discourse.org/u/daemon)\
**Post date:** [April 13, 2022, 9:55am UTC](https://meta.discourse.org/t/theme-with-variable-width-inside-settings/192790/4 "2022-04-13T09:55:27Z")

</div>

Hi again!

I want to add settings to my theme but I have a few questions about it.

I looked into the welcome-banner component because there is a setting to upload an image as background and other settings related to the background.

```plaintext
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>

```

And in the css file is this:

```plaintext
.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;
  }

```

What irritates me now is the use of `#` instead of `$` like in other components I had a look.  
So what do I need to use? Or doesn’t it matter?

I have another question about CSS, but first I want to solve the question above.  
Of course I could try it but I want to be sure which is correct.

---

_[View the full topic](https://meta.discourse.org/t/theme-with-variable-width-inside-settings/192790)._