Re-organise style imports into main.styl. Improvements

Author: avivace

package.json

@@ -17,6 +17,7 @@
     "ar.js": "^1.4.10",
     "font-awesome-picker": "^2.0.0",
     "three": "^0.92.0",
+    "typeface-fira-mono": "0.0.54",
     "typeface-overpass": "0.0.54",
     "typeface-overpass-mono": "0.0.54",
     "typeface-roboto": "0.0.54",

src/main.js

@@ -11,17 +11,14 @@ import store from './store/index'
 // Main components
 import axios from 'axios';
 import Vuetify from 'vuetify';
-//import 'vuetify/dist/vuetify.min.css';
-import './main.styl'
 
-// PrismJS style (syntax highlight)
-import 'prismjs/themes/prism.css'
+// Application Style
+import './main.styl'
 
 // Fonts
 import 'typeface-roboto'
 import 'material-design-icons-iconfont/dist/material-design-icons.css'
 import '@fortawesome/fontawesome-free/css/all.css'
-import 'typeface-cousine'
 import 'typeface-quicksand'
 import 'typeface-overpass'
 import 'typeface-overpass-mono'

src/main.styl

@@ -1,9 +1,17 @@
 // Application Styling
-// Import then overwrite the default style
+// Import then overwrite the default styles
 
-// Variables
+// PrismJS theme
+@import 'prismjs/themes/prism.css'
+
+// Vuetify Variables
 @import '~vuetify/src/stylus/settings/_variables'
 
+// Vuetify Components
+@import '~vuetify/src/stylus/main'
+
+// Actual modifications
+
 $body-font-family = 'Open Sans'
 $heading-font-family = 'Overpass'
 $button-font-weight = 600
@@ -14,8 +22,6 @@ $font-weights = {
 	medium: 600,
 }
 
-// Components
-@import '~vuetify/src/stylus/main'
 
 h3
 	font-size: 20px
@@ -28,12 +34,16 @@ h3
 
 .v-tabs__div
 	font-size: 15px
-	font-weight: 600
+	font-weight: 500
 
 .v-navigation-drawer
 	.v-list .v-list__tile
 		font-weight: 500
 		font-size: 16px
 
 .v-icon
-	font-weight: 500
+	font-weight: 500
+	
+code[class*="language-"]
+pre[class*="language-"]
+	font-size: 16px