Как добавить края кнопке?

Вопросы и проблемы
#1

Добрый день!
Столкнулся с такой проблемой: добавил кнопку в таблицу, выглядит следующим образом:
image
Как видно на экране в той строке, которая не выбрана, кнопка не выглядит как кнопка, а есть просто caption. Как можно добавить края кнопке, чтобы было понятно, что это кнопка?

#2

Добрый день!

Нужно добавить стиль кнопке и немного затемнить её фон. Если используется тема helium, можно использовать такой миксин:

@mixin com_company_demo-helium-ext {

  --table-column-button-color: #e0e0e0; // was a #F2F2F2;
  --table-column-button-text-color: var(--text-main-color); // default value
  --table-column-button-hover-color: #CECECE; // default value
  --table-column-button-active-color: #A7A7A7; // default value
  --table-column-button-focused-border-color: #E7E7E7; // default value

  .table-column-button {
    @include he-button-color-style($main-color            : --table-column-button-color,
                                   $text-color            : --table-column-button-text-color,
                                   $hover-color           : --table-column-button-hover-color,
                                   $active-color          : --table-column-button-active-color,
                                   $disabled-color        : --button-secondary-disabled-color,
                                   $disabled-text-color   : --button-secondary-disabled-text-color,
                                   $focused-border-color  : --table-column-button-focused-border-color);
  }
}

 @Inject
 private UiComponents uiComponents;

 @Subscribe
 public void onInit(InitEvent event) {
     table.addGeneratedColumn("test-button", entity -> {
         Button button = uiComponents.create(Button.NAME);
         button.addStyleName("table-column-button");
         button.setCaption("Button");
         return button;
     });
 }