Trying to extend touchkit theme

Flow
1

What I need to do is add one tiny style change to the touchkit theme. Specifically I want to add this:

.v-textfield-align-right {
    text-align: right;
}

I got it working just fine in my application. I created directory
VAADIN/themes/mytouchkit

and in there I put
mytouchkit.scss, addons.scss
 and
styles.scss
. The addons file is a copy of the one that was generated by the maven archetype with no change. The
mytouchkit.scss
 looks like this:

@import "mytouchkit.scss";
@import "addons.scss";

.mytouchkit {
  @include addons;
  @include mytouchkit;
}

and the
mytouchkit.scss
 looks like this:

@import "../touchkit/touchkit.scss";

@mixin mytouchkit {
  @include touchkit;

.v-textfield-align-right {
    text-align: right;
}
}

Like I said that works. Then I got ambitious and decided this mytouchkit theme would be better in a library, and that doesn’t work for me. In my jar file I have

  • a java class extending BaseTheme with a THEME_NAME String which names the theme. I’m fairly sure that is okay because it does find the theme.
  • an
    addons.scss
    , identical to the one above

  • styles.css
     identical to the one above

  • mytouchkit.scss
     which is probably where the problem is

The
mytouchkit.scss
 file fails to import the
touchkit.scss
 file. I checked in the touchkit jar file and there is no such scss file, though it is odd that it worked before I tried bundling it into a jar file. I’ve tried changing it to import the css file I can see in the jar but that gives a different error:

CSS imports can only be used at the top level, not as nested imports. Within style rules, use SCSS imports.

Is there a better way to do this?

2

Heh. Nothing like explaining the problem carefully (see above) to come up with a solution yourself.
I noticed that the theme in the application was working, as I said, but it was giving an error about not finding the touchkit import. So I tried just taking it out and now mytouchkit.scss looks like this:

@mixin mytouchkit { .v-textfield-align-right { text-align: right; } } That works, including when it is in the jar file, and I can’t see any errors in the log now. So it’s all good. I think the touchkit theme must be getting into the application some other way, but it isn’t an scss theme so I guess that makes enough sense.