Transbutton hotbutton currentindicatorcolor properties

[Obonye]

OR, asked differently, the Transbutton has a border color property. Is there a way to add the button’s top border, bottom border, left border, and right border properties?

[Andreas Pfeiffer]

Hi Martin,

You can achieve this with a CSS class.

Add the following to the user.css within your installation:

.mytransbutton:hover {
    border-bottom-width: 3px !important;
    border-bottom-color: darkblue !important;
}

Then add the name of this CSS class “mytransbutton” to the $cssclass property of your transbutton.

When testing this, the transbutton should show a 3px, dark blue border at the bottom when hovering with the mouse.

I hope this helps.

Best,

Andreas

[Andreas Pfeiffer]

Martin,

We found a little glitch with this approach. Apparently when adding the bottom border, the text on the button jumps a little. So instead using a CSS class for the button we use a container (i.e.scroll box) and put the button or trans button into that container given it an edge float kEFPosnClient. Note that it does not look nice if the button has rounded corners. Hence we set $borderradius to zero for both the button and the container.

Now the container will receive a CSS class like this:

.showbottomborder:hover {
    border-bottom: 3px solid red;
}

If you put “showbuttomborder” into $cssclassname (without the quotes) it will show a 3px, solid and red line at the bottom when hovering with the mouse without affecting the button itself.

Kudos to Maurin for this.

Best,

Andreas

[Obonye]

Hi Andreas,

I followed every step of your instructions, but it did not work. Could you do a simple lib so I can see what I’m doing wrong?

Regards

Martin.

[Obonye]

Hi Andreas,

I have attached a small library of what I’m working on.

Regards,

Martin.

buttoncontainer.lbs 50 KB Omnis LBS - Click to view

Options

• Copy Download Link

[Andreas Pfeiffer]

Martin,

Attached please find the test library made with Omnis Studio 11.1 CE and the required user.css that you would need to copy into your installation. If you have already contents in the user.css then you can simply copy the CSS class from this user.css into your own user.css.

Best,

Andreas

hover_transbutton.zip 14 KB Zip - Click to view

Options

• Copy Download Link

[Obonye]

Hi Andreas,

Still no luck! Please see the video clip. I have copied the css file into the folder C:\Users\info\AppData\Local\Omnis Software\OS 11.1 37255\html\css

Regards, Martin.

Recording-2025-04-14-160503.mp4 9 MB MP4 - Click to view

Options

• Copy Download Link

[Andreas Pfeiffer]

Martin,

Maybe you might try this with the latest version though. I was using Build 37266

Best,

Andreas

[Obonye]

Hi Andreas,

You mean it’s time to upgrade to the latest $OS version.

Thank you for the help and I’ll do the needful.

Regards,

Martin.