Cleaned up default generated boilerplate
Nikan Dalvand
parent
a80fce78a2
commit
b59f0f088f
|
|
@ -1,128 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="wrapper">
|
|
||||||
<img id="logo" src="~@/assets/logo.png" alt="electron-vue">
|
|
||||||
<main>
|
|
||||||
<div class="left-side">
|
|
||||||
<span class="title">
|
|
||||||
Welcome to jukebox!
|
|
||||||
</span>
|
|
||||||
<system-information></system-information>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="right-side">
|
|
||||||
<div class="doc">
|
|
||||||
<div class="title">Getting Started</div>
|
|
||||||
<p>
|
|
||||||
electron-vue comes packed with detailed documentation that covers everything from
|
|
||||||
internal configurations, using the project structure, building your application,
|
|
||||||
and so much more.
|
|
||||||
</p>
|
|
||||||
<button @click="open('https://simulatedgreg.gitbooks.io/electron-vue/content/')">Read the Docs</button><br><br>
|
|
||||||
</div>
|
|
||||||
<div class="doc">
|
|
||||||
<div class="title alt">Other Documentation</div>
|
|
||||||
<button class="alt" @click="open('https://electron.atom.io/docs/')">Electron</button>
|
|
||||||
<button class="alt" @click="open('https://vuejs.org/v2/guide/')">Vue.js</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import SystemInformation from './LandingPage/SystemInformation'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'landing-page',
|
|
||||||
components: { SystemInformation },
|
|
||||||
methods: {
|
|
||||||
open (link) {
|
|
||||||
this.$electron.shell.openExternal(link)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');
|
|
||||||
|
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
body { font-family: 'Source Sans Pro', sans-serif; }
|
|
||||||
|
|
||||||
#wrapper {
|
|
||||||
background:
|
|
||||||
radial-gradient(
|
|
||||||
ellipse at top left,
|
|
||||||
rgba(255, 255, 255, 1) 40%,
|
|
||||||
rgba(229, 229, 229, .9) 100%
|
|
||||||
);
|
|
||||||
height: 100vh;
|
|
||||||
padding: 60px 80px;
|
|
||||||
width: 100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
#logo {
|
|
||||||
height: auto;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
width: 420px;
|
|
||||||
}
|
|
||||||
|
|
||||||
main {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
|
|
||||||
main > div { flex-basis: 50%; }
|
|
||||||
|
|
||||||
.left-side {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.welcome {
|
|
||||||
color: #555;
|
|
||||||
font-size: 23px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
color: #2c3e50;
|
|
||||||
font-size: 20px;
|
|
||||||
font-weight: bold;
|
|
||||||
margin-bottom: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title.alt {
|
|
||||||
font-size: 18px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.doc p {
|
|
||||||
color: black;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.doc button {
|
|
||||||
font-size: .8em;
|
|
||||||
cursor: pointer;
|
|
||||||
outline: none;
|
|
||||||
padding: 0.75em 2em;
|
|
||||||
border-radius: 2em;
|
|
||||||
display: inline-block;
|
|
||||||
color: #fff;
|
|
||||||
background-color: #4fc08d;
|
|
||||||
transition: all 0.15s ease;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid #4fc08d;
|
|
||||||
}
|
|
||||||
|
|
||||||
.doc button.alt {
|
|
||||||
color: #42b983;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,73 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="title">Information</div>
|
|
||||||
<div class="items">
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Path:</div>
|
|
||||||
<div class="value">{{ path }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Route Name:</div>
|
|
||||||
<div class="value">{{ name }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Vue.js:</div>
|
|
||||||
<div class="value">{{ vue }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Electron:</div>
|
|
||||||
<div class="value">{{ electron }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Node:</div>
|
|
||||||
<div class="value">{{ node }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="name">Platform:</div>
|
|
||||||
<div class="value">{{ platform }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
electron: process.versions.electron,
|
|
||||||
name: this.$route.name,
|
|
||||||
node: process.versions.node,
|
|
||||||
path: this.$route.path,
|
|
||||||
platform: require('os').platform(),
|
|
||||||
vue: require('vue/package.json').version
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.title {
|
|
||||||
color: #888;
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: initial;
|
|
||||||
letter-spacing: .25px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.items { margin-top: 8px; }
|
|
||||||
|
|
||||||
.item {
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item .name {
|
|
||||||
color: #6a6a6a;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item .value {
|
|
||||||
color: #35495e;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
Home page
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'HomePage'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -7,8 +7,8 @@ export default new Router({
|
||||||
routes: [
|
routes: [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
name: 'landing-page',
|
name: 'HomePage',
|
||||||
component: require('@/components/LandingPage').default
|
component: require('@/layouts/HomePage').default
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '*',
|
path: '*',
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue