Possible to use CSS to style two different types of buttons?

[KPT]

I use two types of button styles in the same screen - a filled in one and one with an outline.

I really want to use a different color button so I used the following CSS

<pre><span><style>
[data-test="app-button-view"] {
background: #c94d37 !important;
color: white !important;
}

Which works - just a little too well as all buttons now becomes this style - which makes sense.
But is there a way to have two different styles of buttons when using CSS?

[Darren_Murphy]

yeah, it’s possible but fiddly. You need to target each button individually using screenScrollView and :nth-of-type

So something like the following:

<pre><span><style>
div[id*='screenScrollView'] > div > :nth-of-type(3) button {
    background-color: "red";
}
div[id*='screenScrollView']> div > :nth-of-type(4) button {
    background-color: "blue";
}

It may take a bit of trial and error to get the correct nth-of-type values, and these will be affected by other components on the same screen. AND they will change if you start re-arranging components.

[KPT]

Ok, got it!
Maybe this is a bit of a last minute treatment when everything is working…