Hide "Or drop files" for file lightning-input

Question

I have a lightning-input with type file so I can upload files. I don't want the little box that says "Or drop files" that shows up beside the upload button to show. Is there a way to hide it?

I've already seen the solution at Lightning:input type="file" change the "Upload Files" text, but it isn't working for me in LWC.

.html

<lightning-input
     type="file"
     onchange={handleFileUpload}
     accept="*"
     multiple></lightning-input>

.css

.THIS .slds-file-selector__dropzone .slds-file-selector__text{
    display: none !important;
}

.THIS .slds-file-selector__text .slds-medium-show {
    display: none !important;
}

rendered .html

<span lightning-input_input="" class="slds-file-selector__text slds-medium-show">Or drop files</span>

Answer 1

I don't think you can access this because of the shadow dom limiting your access to it. may have to build one from scratch : /

Answer 2

Actually there is one workaround that I used in my case

The idea is to 'hide' DropZone text. For that you need to create your css class and add your class to the lightning-file-upload component

<lightning-file-upload
        class="slds-align_absolute-center removeDropZone"
        name="fileUploader"
        accept={acceptedFormats}
        onuploadfinished={handleUploadFinished}>
</lightning-file-upload>

Then let's go to the css file and add that lines

 .removeDropZone {
      color: #ffffff;
      --lwc-borderWidthThin: 0px;
 }

The result:

Note: It does not help you too remove drop zone, this way helps to hide it.