Styling the Upload Button

Hi everyone,
i’m trying to create an Icon-only button that fits my UI, in order to start a file upload…
I tried the immediate upload, but i cannot seem to change the button into the png image i wanna use for file upload. I tried CSS, but cannot find the classes i have to change, in order to affect just that button.

Anybody managed to do this? Is it even possible?

Thanks!

Ok, done using css child property, to navigate till the button itself, and setting the size to the img button, background to none! :slight_smile:

Can you provide me details on how you fixed the issue…I am facing same problem.

// This targets the upload form's v-button.  Put it in the themes scss file. 
.v-upload .v-button {
    color: red;
}

 I use this one quite a bit, so the button becomes a 'link'.
.v-upload .v-button {
    @extend .v-button-link;
}

For those like me who would have enjoyed a little example… :slight_smile:

In Java :

        Upload attachButton = new Upload();
        attachButton.addStyleName("upload-with-icon");
        attachButton.setImmediate(true);
        attachButton.setButtonCaption("");

In css :

service.upload-with-icon {
    height: 100%;
}

service.upload-with-icon div {
    height: 100%;
}

service.upload-with-icon .v-button {
    background-image: url('image/button-icons/attachment.png');
    background-repeat: no-repeat;
    background-size: 23px 19px;
    background-position: center;
}