2

¿Cómo puedo ponerle color a la letra de mi botón?

Este es mi código:

<div padding>
  <button ion-button color="light" text-color="quest">Ingresar</button>
</div>

3
  • 1
    Solo por curiosidad ionic o cordova no acepta css?¿
    – vicasas
    Commented el 15 jun. 2018 a las 15:24
  • 1
    Acepta scss.... Commented el 15 jun. 2018 a las 15:26
  • 1
    ¿Y por que no manejas los estilos directamente con scss luego usas un compilador para que lo entienda el browser?
    – vicasas
    Commented el 15 jun. 2018 a las 15:28

2 respuestas 2

5

Usando tu código y aplicando el CSS siguiente (en tu caso sería un SCCS) propondría la siguiente solución:

.buttonIngresar{
color:red;
}
<div padding>
      <button ion-button color="light" class="buttonIngresar">Ingresar</button>
    </div>

2

Para modificar colores en Ionic puedes crear tus propias variables de color dentro de src/theme/variables.scss. Es tan sencillo como ir a la variable:

$colors: (
  primary:    #488aff,
  secondary:  #32db64,
  danger:     #f53d3d,
  light:      #f4f4f4,
  dark:       #222
);

Y con esto tienes la posibilidad de agregar tus propios colores, Ej.

$colors: (
  ...
  login-button: #F2F2F2,
  ...
);

De esta forma podrás utilizarlo en tu código:

<div padding>
  <button ion-button color="login-button" text-color="quest">Ingresar</button>
</div>

Claro que siempre puedes agregarle un class="" al elemento para posteriormente agregar sus estilos personalizados en tus hojas de estilos SCSS.

Saludos!

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.