Lightning Input – Change ‘Upload Files’ Text in lightning:input Type=”file”

I would like to change the text and the style of the "Upload Files" in the lightning:input. The style as far as I understand I would have to overwrite the slds class, but what about the text?

enter image description here

Best Answer

Try adding these lines to your Lightning Style:

/* remove the "or drop files" label from the right of the lightning:input type file */
.THIS .slds-file-selector__dropzone .slds-file-selector__text{
    display: none;
}

/* remove the "Upload Files" text from the button of the lightning:input type file */
.THIS .slds-file-selector__dropzone .slds-file-selector__button{
    font-size: 0;
}

/* insert the text "New Exam" into the button of the lightning:input type file */
.THIS .slds-file-selector__dropzone .slds-file-selector__button:after{
    content: 'New Exam';
    font-size: .8125rem;
    color: rgba(27, 82, 151, 1.0);
}
Related Topic