Replacing Valo Open Sans font in Vaadin 7

General
1

Hello All,

I really need to replace the default Valo theme’s Open Sans font with the one that contains full-unicode character set (especially polish diacritical chars). I’ve wasted two days as for now and I still have no clue on how to do it…

In Chrome’s console I can find the path to original fonts, but they do not exist on my drive:

I have new fonts in mytheme/fonts, but I no matter what I do - I can’t replace the font… So (ofc) texts are displayed incorrectly:

So that’s why I’m begging: please help! :slight_smile:
Thank you in advance
Tom
29519.png
29520.png

2

Fonts are served from themes jar. You can load your own fonts like this:
https://vaadin.com/docs/-/part/framework/themes/themes-fonts.html

Then you need to define in Valo theme variable $v-font-family like done in these examples here:
https://vaadin.com/wiki/-/wiki/Main/Valo+Examples

3

Thank you for the reply.

I’ve followed the instructions at given links, but it seems that it doesn’t work. Maybe I’m too noob for this :slight_smile:

Here’s what I’ve did in my styles.scss:

[code]
@include font(“Open Sans”, ‘…/…/…/…/expenseplannertheme/fonts/OpenSans-Light-webfont’);
$v-font-family: “Open Sans”;

@import “expenseplannertheme.scss”;
@import “addons.scss”;

// This file prefixes all rules with the theme name to avoid causing conflicts with other themes.
// The actual styles should be defined in expenseplannertheme.scss

.expenseplannertheme {
@include addons;
@include expenseplannertheme;

}
[/code]And here’s what gives me theme compilation:

[code]
[INFO]
Scanning for projects…
[WARNING]

[WARNING]
Some problems were encountered while building the effective model for pl.com.msvc:expenseplanner:war:1.0
[WARNING]
‘dependencies.dependency.systemPath’ for pl.nip24:client:jar should not point at files within the project directory, ${project.basedir}/src/main/webapp/WEB-INF/lib/nip24-client-1.2.6.jar will be unresolvable by dependent projects @ line 121, column 16
[WARNING]

[WARNING]
It is highly recommended to fix these problems because they threaten the stability of your build.
[WARNING]

[WARNING]
For this reason, future Maven versions might no longer support building such malformed projects.
[WARNING]

[INFO]

[INFO]

[INFO]
Building expenseplanner 1.0
[INFO]

[INFO]

[INFO]
— vaadin-maven-plugin:7.7.6:update-theme (default-cli) @ expenseplanner —
[INFO]
Updating theme VAADIN/themes/expenseplannertheme
[INFO]
Widgetsets found from classpath:
[INFO]
com.github.wolfie.refresher.RefresherWidgetset in jar:file:C:/Users/tfrub/.m2/repository/org/vaadin/addons/refresher/1.2.3.7/refresher-1.2.3.7.jar!/
[INFO]
com.vaadin.DefaultWidgetSet in jar:file:C:/Users/tfrub/.m2/repository/com/vaadin/vaadin-client/7.7.6/vaadin-client-7.7.6.jar!/
[INFO]
Addon styles found from classpath:
[INFO]

[INFO]
Search took 17ms
[INFO]
Theme “VAADIN/themes/expenseplannertheme” updated
[INFO]

[INFO]
— vaadin-maven-plugin:7.7.6:compile-theme (default-cli) @ expenseplanner —
[INFO]
Updating theme VAADIN/themes/expenseplannertheme
[ERROR]
sty 05, 2017 11:10:36 AM com.vaadin.sass.internal.handler.SCSSErrorHandler severe
[ERROR]
SEVERE: Mixin Definition: font not found
[ERROR]
Compiling theme “VAADIN/themes/expenseplannertheme” failed
org.codehaus.mojo.gwt.shell.JavaCommandException: Command [[
C:\Program Files\Java\jre1.8.0_111\bin\java -Xmx512m -classpath D:\Workspace\expenseplanner\src\main\webapp;D:\Workspace\expenseplanner\target\classes;D:\Workspace\expenseplanner\src\main\java;C:\Users\tfrub.m2\repository\javax\servlet\javax.servlet-api\3.0.1\javax.servlet-api-3.0.1.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-server\7.7.6\vaadin-server-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-sass-compiler\0.9.13\vaadin-sass-compiler-0.9.13.jar;C:\Users\tfrub.m2\repository\org\w3c\css\sac\1.3\sac-1.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\flute\flute\1.3.0.gg2\flute-1.3.0.gg2.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-shared\7.7.6\vaadin-shared-7.7.6.jar;C:\Users\tfrub.m2\repository\org\jsoup\jsoup\1.8.3\jsoup-1.8.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-push\7.7.6\vaadin-push-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\atmosphere\atmosphere-runtime\2.2.9.vaadin2\atmosphere-runtime-2.2.9.vaadin2.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\slf4j\vaadin-slf4j-jdk14\1.6.1\vaadin-slf4j-jdk14-1.6.1.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-client-compiler\7.7.6\vaadin-client-compiler-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-client\7.7.6\vaadin-client-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-elemental\2.7.0.vaadin4\gwt-elemental-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-user\2.7.0.vaadin4\gwt-user-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\javax\validation\validation-api\1.0.0.GA\validation-api-1.0.0.GA.jar;C:\Users\tfrub.m2\repository\javax\validation\validation-api\1.0.0.GA\validation-api-1.0.0.GA-sources.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-dev\2.7.0.vaadin4\gwt-dev-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm\5.0.3\asm-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-util\5.0.3\asm-util-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-tree\5.0.3\asm-tree-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-commons\5.0.3\asm-commons-5.0.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-themes\7.7.6\vaadin-themes-7.7.6.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-collections\r03\guava-collections-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-annotations\r03\guava-annotations-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-primitives\r03\guava-primitives-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-base\r03\guava-base-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava\20.0\guava-20.0.jar;C:\Users\tfrub.m2\repository\org\vaadin\addons\refresher\1.2.3.7\refresher-1.2.3.7.jar;C:\Users\tfrub.m2\repository\org\vaadin\addons\googleanalyticstracker\2.1.0\googleanalyticstracker-2.1.0.jar;C:\Users\tfrub.m2\repository\org\postgresql\postgresql\9.4.1212\postgresql-9.4.1212.jar;C:\Users\tfrub.m2\repository\org\tmatesoft\svnkit\svnkit\1.2.3.5521\svnkit-1.2.3.5521.jar;C:\Users\tfrub.m2\repository\org\peimari\maddon\1.21\maddon-1.21.jar;C:\Users\tfrub.m2\repository\org\vaadin\addon\confirmdialog\2.1.2\confirmdialog-2.1.2.jar;C:\Users\tfrub.m2\repository\org\commonjava\googlecode\markdown4j\markdown4j\2.2-cj-1.0\markdown4j-2.2-cj-1.0.jar;C:\Users\tfrub.m2\repository\commons-io\commons-io\2.4\commons-io-2.4.jar;C:\Users\tfrub.m2\repository\commons-beanutils\commons-beanutils\1.9.1\commons-beanutils-1.9.1.jar;C:\Users\tfrub.m2\repository\commons-logging\commons-logging\1.1.1\commons-logging-1.1.1.jar;C:\Users\tfrub.m2\repository\commons-collections\commons-collections\3.2.1\commons-collections-3.2.1.jar;C:\Users\tfrub.m2\repository\org\apache\commons\commons-lang3\3.3.2\commons-lang3-3.3.2.jar;C:\Users\tfrub.m2\repository\org\apache\axis\axis\1.4\axis-1.4.jar;C:\Users\tfrub.m2\repository\javax\xml\jaxrpc-api\1.1\jaxrpc-api-1.1.jar;D:\Workspace\expenseplanner\src\main\webapp\WEB-INF\lib\nip24-client-1.2.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\addon\jpacontainer\3.2.0\jpacontainer-3.2.0.jar com.vaadin.sass.SassCompiler D:\Workspace\expenseplanner\src\main\webapp\VAADIN\themes\expenseplannertheme\styles.scss D:\Workspace\expenseplanner\src\main\webapp\VAADIN\themes\expenseplannertheme\styles.css
]] failed with status 1
at org.codehaus.mojo.gwt.shell.JavaCommand.execute(JavaCommand.java:327)
at com.vaadin.integration.maven.CompileThemeMojo.processTheme(CompileThemeMojo.java:65)
at com.vaadin.integration.maven.AbstractThemeMojo.doExecute(AbstractThemeMojo.java:43)
at org.codehaus.mojo.gwt.shell.AbstractGwtShellMojo.execute(AbstractGwtShellMojo.java:182)
at org.apache.maven.plugin.DefaultBuildPluginManager.executeMojo(DefaultBuildPluginManager.java:134)
at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:207)
at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:153)
at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:145)
at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:116)
at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:80)
at org.apache.maven.lifecycle.internal.builder.singlethreaded.SingleThreadedBuilder.build(SingleThreadedBuilder.java:51)
at org.apache.maven.lifecycle.internal.LifecycleStarter.execute(LifecycleStarter.java:128)
at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:307)
at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:193)
at org.apache.maven.DefaultMaven.execute(DefaultMaven.java:106)
at org.apache.maven.cli.MavenCli.execute(MavenCli.java:863)
at org.apache.maven.cli.MavenCli.doMain(MavenCli.java:288)
at org.apache.maven.cli.MavenCli.main(MavenCli.java:199)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
at java.lang.reflect.Method.invoke(Unknown Source)
at org.codehaus.plexus.classworlds.launcher.Launcher.launchEnhanced(Launcher.java:289)
at org.codehaus.plexus.classworlds.launcher.Launcher.launch(Launcher.java:229)
at org.codehaus.plexus.classworlds.launcher.Launcher.mainWithExitCode(Launcher.java:415)
at org.codehaus.plexus.classworlds.launcher.Launcher.main(Launcher.java:356)
[INFO]

[INFO]
BUILD FAILURE
[INFO]

[INFO]
Total time: 12.716 s
[INFO]
Finished at: 2017-01-05T11:10:39+01:00
[INFO]
Final Memory: 13M/125M
[INFO]

[ERROR]
Failed to execute goal com.vaadin:vaadin-maven-plugin:7.7.6:compile-theme (default-cli) on project expenseplanner: Compiling theme “VAADIN/themes/expenseplannertheme” failed: Command [[
[ERROR]
C:\Program Files\Java\jre1.8.0_111\bin\java -Xmx512m -classpath D:\Workspace\expenseplanner\src\main\webapp;D:\Workspace\expenseplanner\target\classes;D:\Workspace\expenseplanner\src\main\java;C:\Users\tfrub.m2\repository\javax\servlet\javax.servlet-api\3.0.1\javax.servlet-api-3.0.1.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-server\7.7.6\vaadin-server-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-sass-compiler\0.9.13\vaadin-sass-compiler-0.9.13.jar;C:\Users\tfrub.m2\repository\org\w3c\css\sac\1.3\sac-1.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\flute\flute\1.3.0.gg2\flute-1.3.0.gg2.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-shared\7.7.6\vaadin-shared-7.7.6.jar;C:\Users\tfrub.m2\repository\org\jsoup\jsoup\1.8.3\jsoup-1.8.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-push\7.7.6\vaadin-push-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\atmosphere\atmosphere-runtime\2.2.9.vaadin2\atmosphere-runtime-2.2.9.vaadin2.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\slf4j\vaadin-slf4j-jdk14\1.6.1\vaadin-slf4j-jdk14-1.6.1.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-client-compiler\7.7.6\vaadin-client-compiler-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-client\7.7.6\vaadin-client-7.7.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-elemental\2.7.0.vaadin4\gwt-elemental-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-user\2.7.0.vaadin4\gwt-user-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\javax\validation\validation-api\1.0.0.GA\validation-api-1.0.0.GA.jar;C:\Users\tfrub.m2\repository\javax\validation\validation-api\1.0.0.GA\validation-api-1.0.0.GA-sources.jar;C:\Users\tfrub.m2\repository\com\vaadin\external\gwt\gwt-dev\2.7.0.vaadin4\gwt-dev-2.7.0.vaadin4.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm\5.0.3\asm-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-util\5.0.3\asm-util-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-tree\5.0.3\asm-tree-5.0.3.jar;C:\Users\tfrub.m2\repository\org\ow2\asm\asm-commons\5.0.3\asm-commons-5.0.3.jar;C:\Users\tfrub.m2\repository\com\vaadin\vaadin-themes\7.7.6\vaadin-themes-7.7.6.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-collections\r03\guava-collections-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-annotations\r03\guava-annotations-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-primitives\r03\guava-primitives-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava-base\r03\guava-base-r03.jar;C:\Users\tfrub.m2\repository\com\google\guava\guava\20.0\guava-20.0.jar;C:\Users\tfrub.m2\repository\org\vaadin\addons\refresher\1.2.3.7\refresher-1.2.3.7.jar;C:\Users\tfrub.m2\repository\org\vaadin\addons\googleanalyticstracker\2.1.0\googleanalyticstracker-2.1.0.jar;C:\Users\tfrub.m2\repository\org\postgresql\postgresql\9.4.1212\postgresql-9.4.1212.jar;C:\Users\tfrub.m2\repository\org\tmatesoft\svnkit\svnkit\1.2.3.5521\svnkit-1.2.3.5521.jar;C:\Users\tfrub.m2\repository\org\peimari\maddon\1.21\maddon-1.21.jar;C:\Users\tfrub.m2\repository\org\vaadin\addon\confirmdialog\2.1.2\confirmdialog-2.1.2.jar;C:\Users\tfrub.m2\repository\org\commonjava\googlecode\markdown4j\markdown4j\2.2-cj-1.0\markdown4j-2.2-cj-1.0.jar;C:\Users\tfrub.m2\repository\commons-io\commons-io\2.4\commons-io-2.4.jar;C:\Users\tfrub.m2\repository\commons-beanutils\commons-beanutils\1.9.1\commons-beanutils-1.9.1.jar;C:\Users\tfrub.m2\repository\commons-logging\commons-logging\1.1.1\commons-logging-1.1.1.jar;C:\Users\tfrub.m2\repository\commons-collections\commons-collections\3.2.1\commons-collections-3.2.1.jar;C:\Users\tfrub.m2\repository\org\apache\commons\commons-lang3\3.3.2\commons-lang3-3.3.2.jar;C:\Users\tfrub.m2\repository\org\apache\axis\axis\1.4\axis-1.4.jar;C:\Users\tfrub.m2\repository\javax\xml\jaxrpc-api\1.1\jaxrpc-api-1.1.jar;D:\Workspace\expenseplanner\src\main\webapp\WEB-INF\lib\nip24-client-1.2.6.jar;C:\Users\tfrub.m2\repository\com\vaadin\addon\jpacontainer\3.2.0\jpacontainer-3.2.0.jar com.vaadin.sass.SassCompiler D:\Workspace\expenseplanner\src\main\webapp\VAADIN\themes\expenseplannertheme\styles.scss D:\Workspace\expenseplanner\src\main\webapp\VAADIN\themes\expenseplannertheme\styles.css
[ERROR]
]] failed with status 1
[ERROR]
→ [Help 1]

[ERROR]

[ERROR]
To see the full stack trace of the errors, re-run Maven with the -e switch.
[ERROR]
Re-run Maven using the -X switch to enable full debug logging.
[ERROR]

[ERROR]
For more information about the errors and possible solutions, please read the following articles:
[ERROR]
[Help 1]
http://cwiki.apache.org/confluence/display/MAVEN/MojoExecutionException
[/code]Either - valo doesn’t allow me to replace the original Open Sans font, nor I have misunderstood the instruction.

4

Those two lines need to be before
.expenseplannertheme { }, but after @import lines

5

I had to change the font Sans initial opening theme bravado with one of a series of letters full Unicode (phonetic alphabet Poland in particular), I’ve lost two days now and I still have no clue about. how to do it.

6

@Johannes Häyry that has solved my problem, thank you :slight_smile:

@ประจวบ ศิรีขัน - the resolution provided by Johannes is working fine.