0

Necesito editar los estilos del select incluido por React, o de alguna forma sobreescribir el archivo css

import Select from 'react-select'

Más especificamente quiero editar el border-radius del select.

Gracias!

1 respuesta 1

0

Para poder editar el css de 'react-select' debes pasarle una propiedad styles al .

En el caso de añadir un border-radius. Debes hacerlo como en el ejemplo anterior: borderRadius: 10

Te dejo más documentación por aquí. https://react-select.com/home#custom-styles

Un pequeño ejemplo:

const colourStyles = {
  control: styles => ({ ...styles, backgroundColor: 'white' }),
  option: (styles, { data, isDisabled, isFocused, isSelected }) => {
    const color = chroma(data.color);
    return {
      ...styles,
      borderRadius: 30,
      backgroundColor: isDisabled ? 'red' : blue,
      color: '#FFF',
      cursor: isDisabled ? 'not-allowed' : 'default',
      ...
    };
  },
  ...
};

export default () => (
  <Select
    defaultValue={items[0]}
    label="Single select"
    options={items}
    styles={colourStyles}
  />
);

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.