Here is a snippet from my App.vue file where I encountered an issue with changing the font in the md-tabs component, taken from . The CSS line:
background: #42A5F5;
works perfectly fine, but this one does not:
color: #E3F2FD;
App.vue:
<template>
<div id="app">
<md-tabs md-sync-route>
<md-tab id="tab-home" md-label="Home" to="/"></md-tab>
<md-tab id="tab-settings" md-label="Settings" to="/Settings"></md-tab>
</md-tabs>
<router-view></router-view>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
<style lang="scss" scoped>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #E3F2FD;
}
.md-tabs {
background: #42A5F5;
color: #E3F2FD;
}
</style>