HTML
Vamos a necesitar un div contenedor, un label, otro div que va a llevar el estilo que quieras, inclusive puede ser una imagen o ponerle un icono.
<div class="upload-container">
<label for="file-input">
<div class="upload-button"> Choose your file </div>
</label>
<input id="file-input" (change)="getFile($event)" type="file" />
</div>
En el siguiente CSS lo único que vamos a hacer es ocultar el input y darle estilo a la clase "upload-button" aqui es donde le puedes dar el estilo que quieras.
CSS
.upload-container>input {
display: none;
}
.upload-button{
cursor: pointer;
width: 200px;
border-radius: 8px;
height: 60px;
background-color: green;
display: grid;
justify-content: center;
align-items: center;
font-size: 20px;
font-weight: 600
}
RESULTADO
Sígueme o escríbeme 😉 cualquier aporte sera bienvenido
https://linktr.ee/fergolive
Top comments (0)