-1

mytheme.scss file:

@import "../valo/valo.scss";

@mixin mytheme {

 @include valo;  
 background-image: url("img/light-background.jpg");
  }

my image is in ...VAADIN/themes/mytheme/img/light-background.jpg

where is no compiling/running errors, why image isn't displayed as a background?

TGV
  • 1
  • 3
  • 2
    There is not enough information here to reproduce the problem. Is this your entire code related to the problem? What does the compiled CSS look like? Did you even look? – cimmanon Apr 01 '16 at 10:14
  • Adding some more questions to @cimmanon 's comment: **1)** Did you annotate your UI with [`@Theme("mytheme")`](https://vaadin.com/docs/-/part/framework/themes/themes-overview.html)? **2)** What does your `styles.scss` look like? – Morfic Apr 01 '16 at 13:38

1 Answers1

-1

Edit: On hold until additional details are provided.

Try setting it as the background image for your UI's generated div:

@mixin mytheme {
  @include valo;

  .v-ui {
     background-image: url("img/light-background.jpg");
  }
}

Morfic
  • 15,178
  • 3
  • 51
  • 61
  • You don't even know how the OP is using that mixin, how do you know that this is the solution? – cimmanon Apr 01 '16 at 10:13
  • 2
    @cimmanon well, because the question is also tagged with `Vaadin` and I tried it... Am I perhaps missing your point?! – Morfic Apr 01 '16 at 10:14
  • How do you know that the OP isn't including the mixin inside of a class? How do you know the problem is that the OP isn't calling the mixin at all? There's clearly not enough information here to reproduce a problem. – cimmanon Apr 01 '16 at 10:22
  • 1
    @cimmanon normally i would agree with you, however the description indicates a Vaadin theme which has a specific setup and usage, hence, I am not excluding the possibilty of being wrong but I consider I have enough information for an answer. Please let me know if you think othewise or have additional doubts. – Morfic Apr 01 '16 at 10:42
  • Vaadin doesn't have magic powers here. The only way for the provided code here to compile without errors, as claimed by the OP, is if the mixin is called inside of a selector or they're not calling the mixin at all. There could be a host of other reasons for a background image not appearing as well (the element has no height, the image doesn't exist, there is a typo in the HTML, they're using the wrong selector, etc.) – cimmanon Apr 01 '16 at 10:55
  • @cimmanon you are correct, nonetheless there's a bit of _magic_ here as well, in the sense that the framework applies the **predefined** theme styles based on a java configuration without the user having to do any additional work. I also agree that the java configuration/annotation can be missing which would result in the theme not being applied, and this would immediately popup next, but only after having defined a _correct_ theme, which is what I am proposing here. – Morfic Apr 01 '16 at 11:10
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/107956/discussion-between-morfic-and-cimmanon). – Morfic Apr 01 '16 at 12:14
  • @cimmanon I stand corrected. As opposed to my initial attempt, some more testing seems to suggest that it should work even if `background-image: url("img/light-background.jpg");` is not applied to the UI div. Please accept my apologies (at least for the time being) :-) – Morfic Apr 01 '16 at 13:35