Saltar al contenido

¿Cómo cambiar el color del texto de un botón de Vuetify?

Solución:

Hay clases css para colorear texto en cualquier lugar de vuetify, solo agregue --text a un color.
Así por ejemplo

<v-btn class="red--text">

También debería funcionar con los colores definidos en su tema, por ejemplo. primary--text y similares.
Tenga en cuenta que esto no es específico de un v-btn, la clase debería funcionar en cualquier lugar.

Si esta usando vuetify puede parecer que desea aplicar esto como un color estándar:

import Vue from "vue";
import Vuetify from "vuetify";
import "vuetify/dist/vuetify.min.css";
    
Vue.use(Vuetify);
    
export default new Vuetify({
  theme: {
    themes: {
      light: {
        primary: "#14C6FF",
        secondary: "#424242",
        accent: "#82B1FF",
        error: "#FF5252",
        info: "#2196F3",
        success: "#4CAF50",
        warning: "#FFC107",
        lightblue: "#14c6FF",
        yellow: "#FFCF00",
        pink: "#FF1976",
        orange: "#FF8657",
        magenta: "#C33AFC",
        darkblue: "#1E2D56",
        gray: "#909090",
        neutralgray: "#9BA6C1",
        green: "#2ED47A",
        red: "#FF5c4E",
        darkblueshade: "#308DC2",
        lightgray: "#BDBDBD",
        lightpink: "#FFCFE3",
        white: "#FFFFFF"
      }
    }
  }
});

y se puede acceder fácilmente mediante color="lightpink" prop o lo que quieras.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *