CODEWITHSUNDEEP
javascriptcssreactjs
mnn
mnn

Reputation: 337

Change input with type file to an icon - how can I delete path preview and change styling? React, JS

As in the title how can I change input with type=file to an icon - how can I delete path preview and change styling?

Currently when I click on the button it will give me a preview of what file was selected. I immediately render the uploaded file as an image (for preview purposes).

Thanks

Upvotes: 0

Views: 1123

Answers (1)

Lygis
Lygis

Reputation: 100

<label htmlFor="file-upload" className="file-upload">
                    <div className="fileUploadButton">
                      <FontAwesomeIcon
                        className="awesomeAboutPhoto"
                        icon={faEdit}
                        color="aliceblue"
                      />
                      <input
                        id="file-upload"
                        type="file"
                        accept="image/x-png, image/jpeg"
                        onChange={handleAddPhoto}
                      />
                    </div>
                  </label>

Thats how I dealt with input file looking like a button, since labeling it as an actual button did not seem to work. So you should use Css to make div look like button. And second part of your question I can't really understand what you want, perhaps share some code or example of what you want.

Upvotes: 1

Related Questions