The CreatorCon Call for Content is officially open! Get started here.

Change Typeahead Search CSS

leandrolope
Tera Contributor

Hi everyone,

 

I need to change the CSS properties of the ".input-container":

 

border-radius: .8rem !important;
background-color: #E6F6EB !important;
border: none !important;

 

And the placeholder:

 

color: #00713F
font-weight: 700

 

If I change it directly in the browser for the ".input-container", it works. I haven't tested it for the placeholder yet.

 

But if I insert the CSS for the ".input-container" in the widget that calls "Typeahead Search", it doesn't work.

 

Does anyone know a way to make these changes?

10 REPLIES 10

This way there was also no effect

RaghavSh
Kilo Patron

@leandrolope Try this is page specific css

 

#x199aecc4c7a83110b1c6677703c26078 input { // here after X the sys_id is your widget instance sys_id. You can find       this in HTML through isnpect as well.
border-radius: .8rem !important;
background-color: #E6F6EB !important;
border: none !important;
}

Raghav
MVP 2023
LinkedIn

@leandrolope did this work for you?


Raghav
MVP 2023
LinkedIn

I did exactly as you suggested, but it had no effect.

Strange and it worked perfectly for me. Make sure you are using correct widget instance and its in correct sp_portal page.


Raghav
MVP 2023
LinkedIn