Начальное имя стиля GWT UiBinder не работает

Я пытаюсь переопределить стиль конкретного виджета с помощью UiBinder. Что я не замечаю?


  /*************
   * Note #1
   *************/
  .btnVote {
     display: inline-block;
     width: 50px;
     height: 50px;
     background: #fff;
     margin: 5px;
     text-align: center;
     outline: none;
     cursor: pointer;
  }

  /*************
   * Note #2
   *************/
  .btnVote-up-hovering, .btnVote-down-hovering {
     background: #ddd;
  }

  .btnVote-up-disabled, .btnVote-down-disabled {
     border-shadow: inset 0 1px 3px #aaa;
  }

  .lblName {
     line-height: 50px;
     font-size: 40px;
     padding: 5px 10px;
  }

  .clear {
     clear: both;
     overflow: auto;
  }

  .floatLeft {
     float: left;
  }




    

       /*************
        * Note #3
        *************/
        
            (+)
        

        
            (-)
        
    

    

        
    

Примечание 1: Это правило применяется и отлично работает

Примечание 2: Эти другие правила, похоже, игнорируются (они не вступают в силу)

Note 3: The default naming for the widget is being reset, hence Note 1 works fine. The base class is set to GOGXR1SCFI instead of gwt-PushButton

Почему другие правила не работают? Когда я нахожу виджет, класс GOGXR1SCFI-up-hovering действительно установлен в виджет, но не сопровождается CSS.

Спасибо за вашу помощь.

<Сильный> Обновление

Что-то, с чем я столкнулся, немного смутило меня: когда вы используете ключевое слово @external, , вы должны поместить полуколонну в конце оператора @external , как в:


@external .btnVote;
.btnVote {
   ...
}



3
nl ja de
добавлено автор Hilbrand Bouwkamp, источник
добавлено автор Hilbrand Bouwkamp, источник

5 ответы

Одна вещь, которую вы можете сделать, - создать свой CSS с помощью ClientBundle, определить все различные состояния там, а затем обрабатывать различные состояния вручную. Таким образом, вам не нужно определять классы как @external, а GWT оптимизирует CSS для вас (сократите имена, загрузите только то, что будет использовано и т. Д.). Это особенно полезно для пользовательских виджетов и т. Д.

4
добавлено

Одна вещь, которую вы можете сделать, - создать свой CSS с помощью ClientBundle, определить все различные состояния там, а затем обрабатывать различные состояния вручную. Таким образом, вам не нужно определять классы как @external, а GWT оптимизирует CSS для вас (сократите имена, загрузите только то, что будет использовано и т. Д.). Это особенно полезно для пользовательских виджетов и т. Д.

4
добавлено

The easiest way to deal with this is to write @external .btnVote, .btnVote-up-hovering, .btnVote-down-hovering, .btnVote-up-disabled, .btnVote-down-disabled at the top of your