Fixed lato font import issue and added Setting and version icon

pull/3/head
Nikan Dalvand 2019-07-20 20:51:28 +04:30
parent 70bf7a82a5
commit 3d116560f8
4 changed files with 40 additions and 17 deletions

11
package-lock.json generated
View File

@ -9944,6 +9944,12 @@
"package-json": "^6.3.0"
}
},
"lato-font": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/lato-font/-/lato-font-3.0.0.tgz",
"integrity": "sha1-kbg34jdLZo+3Mx1EyJTTei2fjhE=",
"dev": true
},
"lazy-cache": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
@ -16212,11 +16218,6 @@
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
"dev": true
},
"typeface-lato": {
"version": "0.0.75",
"resolved": "https://registry.npmjs.org/typeface-lato/-/typeface-lato-0.0.75.tgz",
"integrity": "sha512-iA5uJD4PSTyIE4BDiSOexQeXkDkiJuX4Hu3wh3saJ06EB2TvJayab1Lbbmqq2je/LQv7KCQZHZmC0k4hedd8sw=="
},
"uglify-js": {
"version": "3.4.10",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.4.10.tgz",

View File

@ -58,7 +58,6 @@
"dependencies": {
"axios": "^0.18.0",
"normalize-scss": "^7.0.1",
"typeface-lato": "0.0.75",
"vue": "^2.5.16",
"vue-electron": "^1.0.6",
"vue-router": "^3.0.1",
@ -68,13 +67,16 @@
"devDependencies": {
"ajv": "^6.5.0",
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-loader": "^7.1.4",
"babel-plugin-istanbul": "^4.1.6",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.26.0",
"babili-webpack-plugin": "^0.1.2",
"cfonts": "^2.1.2",
"chai": "^4.1.2",
"chalk": "^2.4.1",
"copy-webpack-plugin": "^4.5.1",
"cross-env": "^5.1.6",
@ -82,20 +84,18 @@
"del": "^3.0.0",
"devtron": "^1.4.0",
"electron": "^2.0.4",
"electron-builder": "^20.19.2",
"electron-debug": "^1.5.0",
"electron-devtools-installer": "^2.2.4",
"electron-builder": "^20.19.2",
"babel-eslint": "^8.2.3",
"eslint": "^4.19.1",
"eslint-config-standard": "^11.0.0",
"eslint-friendly-formatter": "^4.0.1",
"eslint-loader": "^2.0.0",
"eslint-plugin-html": "^4.0.3",
"eslint-config-standard": "^11.0.0",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-node": "^6.0.1",
"eslint-plugin-promise": "^3.8.0",
"eslint-plugin-standard": "^3.1.0",
"mini-css-extract-plugin": "0.4.0",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.2.0",
"inject-loader": "^4.0.1",
@ -107,23 +107,23 @@
"karma-sourcemap-loader": "^0.3.7",
"karma-spec-reporter": "^0.0.32",
"karma-webpack": "^3.0.0",
"require-dir": "^1.0.0",
"spectron": "^3.8.0",
"babel-plugin-istanbul": "^4.1.6",
"chai": "^4.1.2",
"lato-font": "^3.0.0",
"mini-css-extract-plugin": "0.4.0",
"mocha": "^5.2.0",
"multispinner": "^0.2.1",
"node-loader": "^0.6.0",
"node-sass": "^4.9.2",
"require-dir": "^1.0.0",
"sass-loader": "^7.0.3",
"spectron": "^3.8.0",
"style-loader": "^0.21.0",
"url-loader": "^1.0.1",
"vue-html-loader": "^1.2.4",
"vue-loader": "^15.2.4",
"vue-style-loader": "^4.1.0",
"vue-template-compiler": "^2.5.16",
"webpack-cli": "^3.0.8",
"webpack": "^4.15.1",
"webpack-cli": "^3.0.8",
"webpack-dev-server": "^3.1.4",
"webpack-hot-middleware": "^2.22.2",
"webpack-merge": "^4.1.3"

View File

@ -11,7 +11,7 @@
<script>
import DockableSidebar from './layouts/DockableSidebar'
import PlayerBar from './layouts/PlayerBar'
import 'typeface-lato'
export default {
name: 'jukebox',
components: { DockableSidebar, PlayerBar }
@ -20,11 +20,16 @@ export default {
<style lang="sass">
@import 'normalize-scss'
@import 'lato-font/scss/_public-api.scss'
@include normalize()
$lato-font-path: '/node_modules/lato-font/fonts'
@include lato-include-font('normal')
.root,.page-wrapper
display: flex
font-family: 'Lato', sans-serif
@include lato-font('normal')
max-height: 100vh
.page-wrapper

View File

@ -60,9 +60,21 @@
</MenuGroup >
<MenuGroup>
<MenuItem to="/" :faded="true">
<template v-slot:icon>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<g transform="translate(0)">
<path class="cls-1" d="M9.647,16H6.357a.4.4,0,0,1-.4-.337l-.312-2.12a6.1,6.1,0,0,1-1.39-.784l-2.048.8a.428.428,0,0,1-.143.024.407.407,0,0,1-.358-.2L.057,10.616a.4.4,0,0,1,.1-.512l1.735-1.32A6.338,6.338,0,0,1,1.833,8a6.38,6.38,0,0,1,.058-.784L.156,5.9a.386.386,0,0,1-.1-.512L1.7,2.616a.4.4,0,0,1,.352-.2A.418.418,0,0,1,2.2,2.44l2.048.8a6.3,6.3,0,0,1,1.39-.784L5.953.336A.4.4,0,0,1,6.357,0h3.29a.4.4,0,0,1,.4.336l.313,2.12a6.068,6.068,0,0,1,1.39.784l2.048-.8a.428.428,0,0,1,.143-.024.408.408,0,0,1,.359.2l1.644,2.767a.4.4,0,0,1-.1.512l-1.735,1.32A6.22,6.22,0,0,1,14.171,8a6.179,6.179,0,0,1-.058.784l1.735,1.32a.4.4,0,0,1,.1.512L14.3,13.384a.4.4,0,0,1-.352.2.422.422,0,0,1-.15-.028l-2.047-.8a6.336,6.336,0,0,1-1.39.784l-.313,2.12A.4.4,0,0,1,9.647,16ZM8,5.2A2.843,2.843,0,0,0,5.124,8,2.879,2.879,0,0,0,10.88,8,2.843,2.843,0,0,0,8,5.2Z"/>
</g>
</svg>
</template>
Settings
</MenuItem>
<MenuItem to="/" :faded="true">
<template v-slot:icon>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path d="M8,16a8,8,0,1,1,8-8A8.011,8.011,0,0,1,8,16Zm-.075-5.159a.924.924,0,0,0-.67.266.885.885,0,0,0-.274.657.862.862,0,0,0,.283.686.979.979,0,0,0,.661.245.947.947,0,0,0,.645-.248.869.869,0,0,0,.279-.682.91.91,0,0,0-.924-.923Zm.148-6.228a1.354,1.354,0,0,1,.952.341,1.1,1.1,0,0,1,.369.837.942.942,0,0,1-.121.472,1.8,1.8,0,0,1-.3.394c-.119.119-.312.3-.573.524a9.768,9.768,0,0,0-.72.686,2.251,2.251,0,0,0-.427.67,2.312,2.312,0,0,0-.162.9.832.832,0,0,0,.22.626.758.758,0,0,0,.543.211A.692.692,0,0,0,8.6,9.631c.045-.2.08-.343.1-.425a1.261,1.261,0,0,1,.1-.242A1.4,1.4,0,0,1,8.983,8.7a4.338,4.338,0,0,1,.338-.338c.518-.462.864-.779,1.058-.97a2.869,2.869,0,0,0,.509-.686A1.91,1.91,0,0,0,11.1,5.78a2.22,2.22,0,0,0-.375-1.24,2.579,2.579,0,0,0-1.064-.9A3.629,3.629,0,0,0,8.074,3.3a3.486,3.486,0,0,0-1.693.4,2.932,2.932,0,0,0-1.105,1A2.255,2.255,0,0,0,4.9,5.9a.753.753,0,0,0,.239.53.792.792,0,0,0,.587.245c.39,0,.66-.236.8-.7a2.756,2.756,0,0,1,.545-1.013A1.324,1.324,0,0,1,8.074,4.613Z"/>
</svg>
</template>
Version 0.0.1
</MenuItem>
</MenuGroup>
@ -89,6 +101,11 @@ section
display: flex
flex-direction: column
overflow: auto
.icon
width: 18px
height: auto
path
fill: lighten(gray,20)
.grow
flex-grow: 1
</style>