CSS HOVER pseudoclass in XOJO's WEB2

Targets Web
1

Can You implement CSS HOVER pseudoclass in XOJO’s WEB2? This will make the buttons look better.
.btn1 {
color:#A3F7BF;
border-color:#A3F7BF;
background:-webkit-linear-gradient(left,#a3f7bf,#a3f7bf) no-repeat;
background:linear-gradient(to right,#a3f7bf,#a3f7bf) no-repeat;
background-size:0% 100%;
}
.btn1:hover {
background-size:100% 100%;
color:#27323A;
}

2

I think XOJO should offer a variety of standardized color schemes to achieve a consistent and reliable UI style in WEB2. A StyleManager object similar to DotnetBar can be implemented to manage and set the global style.
Users can create a global StyleManager across the entire WEB APP, select the style, change its Settings as needed, and keep all page styles up to date.

3

Xojo is a simple and easy-to-use development tool, it makes many people do not need too much professional knowledge, can quickly develop a cross platform and beautiful web application, it shields CSS, so that people only need to use graphical settings, can be very simple to use CSS.
I think it’s a feature of xojo.
Even if many people want xojo to be more powerful, it needs better support for CSS. You can’t have both fish and bear’s paws.
It is a pity that xojo can’t get WYSIWYG page style in the design interface. In web1, xojo web can easily get the desired effect in the design, but web2, everything depends on CSS, and can not get WYSIWYG effect. It’s very bad.
Xojo can put the original webstyle back into the control. If the user uses this control, he will compile it with web1 framework, otherwise, he will compile with web2 framework

4

Hello everyone. Anybody has working example to implement CSS pseudoclass in Xojo Web 2?

I am just trying to put a simple hover animation to Web Container item.
Something like below:

.button:hover {
      background-color:#002ead;
      transition: 0.7s;
  }

Button should be able to be replaced with any web controls ID.

TIA