slodeveloper
slodeveloper

Reputation: 238

Some bold character in vaadin

For example I have word: "Emšo".

But word "Emšo" in Slovenian language is shown like this "Emšo" I want to show text Emšo like it is, without boldness.

I have problem with all word that have for example "š", "č", "Š","Č","Ž","ž" in the word.

I did not change boldness of the word with no css style or anything.

I am using Vaadin 7.6.3 (Valo theme). The application is runnning on the tomcat server 8.0.3.

Upvotes: 3

Views: 1231

Answers (3)

Piro
Piro

Reputation: 1435

What worked for me was to change/add @StyleSheet annotation on UI class (MyUI)

@StyleSheet("https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic&subset=latin,latin-ext")
public class MyUI extends UI implements ViewChangeListener{ ...

When I look to repository history I see in first commit there was already specified (but maybe I added it before first commit!)

@StyleSheet("https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic&subset=latin,latin-ext")
public class MyUI extends UI implements ViewChangeListener{ ...

so I just changed Roboto to Open+Sans and changed font weights according to: https://google-webfonts-helper.herokuapp.com/fonts/open-sans?subsets=latin,latin-ext

latin-ext is also important. Do not forget to compile your vaadin theme otherwise it will not be applied!

Upvotes: 1

Jouni
Jouni

Reputation: 2928

The problem is in the bundled Open Sans font, which doesn’t contain all unicode characters, so some characters end up rendering in a different font (most probably the default sans-serif font for the platform/browser).

Upvotes: 3

Eray Balkanli
Eray Balkanli

Reputation: 7990

I did not understand if you looking for Java or CSS code to help you but something like this might work for you, please try.

<html>

  <head>
  <style type="text/css">
    p.noBold {font-weight:normal;}
  </style>
  </head>

  <body>
    <p class="noBold">Emšo </p>
  </body>
</html>

EDIT: As mentioned that your problem in your table headers, maybe a code like below helps you to fix it.

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
   <style rel="stylesheet" type="text/css">
   th {
      height: 50px;
      font-weight: normal;
      text-align: left;
      background-color: #cccccc;
   }
   </style>
</head>
<body>
  <table>
    <tr>
      <th>Emšo</th>
    </tr>
    <tr>
      <td>data</td>
    </tr> 
  </table>
</body>
</html>

Upvotes: 1

Related Questions