0

I'm trying to target the input box ".slds-input" in the Salesforce lightning-input component. What is the correct syntax for border-bottom-left-radius using Salesforce Styling Hooks?

I've tried:

.custom-input{
    --slds-c-input-radius-border-bottom-left: 0px;
}

However this didn't work, any suggestions?

1 Answer 1

0

You have to provide all four radiuses in this Styling Hook --slds-c-input-radius-border as below.

CSS

.....
.....
.custom-border {
    --slds-c-input-radius-border:10px 20px 30px 40px;
    --slds-c-input-color-background:green;
}
.....
.....

HTML

.....
.....
<lightning-card>
    <lightning-input type="text" label="Enter some text" class="slds-p-around_medium custom-border"></lightning-input>
</lightning-card>
.....
.....

enter image description here

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .