Как предоставить аддон Vaadin @StyleSheets для разных тем

Я создал виджет, назовем его аддоном Vaadin и включил css-файл, используя аннотацию таблицы стилей: @StyleSheet({ "custom.css" })

Теперь мне интересно, как справиться с использованием в разных темах. Моей первой идеей было написать CSS так:

.valo .mybutton { background: red;}
.reindeer .mybutton {background: yellow;}

Проблема в том, что если моя тема приложения расширяет тему reindeer, html не будет содержать имя класса reindeer, то же самое с valo. Я не нашел документации по этой теме.. (я прочитал этот пост)


themes css vaadin vaadin7
person riddy    schedule 06.03.2015    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Но правильный ли это подход? Вы должны самостоятельно определить внешний вид вашего компонента для каждой доступной темы и решить, какое визуальное представление вашего компонента является лучшим в данной теме. Если эта тема изменится, вы также должны изменить свое дополнение. Если есть новая тема, вам также придется обновить свой компонент.

Более подходящим подходом может быть просто использование стандартных классов vaadin css, что позволяет теме решать, как будет выглядеть ваш компонент. Вы просто определяете структуру вашего компонента и логические части, из которых он состоит, используя стандартные классы vaadin. Таким образом, ваш компонент будет идеально подходить независимо от того, какая тема используется, а также он подготовлен для публикации любого количества новых пользовательских тем. Я не говорю, что вы не должны включать стили в ваше дополнение, я просто говорю, что вы должны подумать о том, чтобы не привязывать свое дополнение к каким-либо согласованным темам.

person Vojtech Ruzicka    schedule 06.03.2015
comment
Мне нравится ваша идея, но я не думаю, что это так просто архивировать, как кажется. например помимо кнопки есть текстовое поле, в олене текстовое поле имеет высоту 24 пикселя, в valo намного больше. Кажется, что высота кнопки по умолчанию одинакова в обеих темах, так как мне заархивировать приятный внешний вид? я мог бы добавить их в макет и задать высоту 100%, но это кажется слишком накладным. или я что-то пропустил? - person riddy; 09.03.2015
comment
Есть ли другой способ включить файлы css, кроме аннотации? - person riddy; 09.03.2015