update
This commit is contained in:
parent
2539f257ef
commit
f75ffac87f
5 changed files with 53 additions and 160 deletions
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "ui",
|
||||
"name": "troplo-site",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
|
|
|
@ -1,151 +0,0 @@
|
|||
<template>
|
||||
<v-container>
|
||||
<v-row class="text-center">
|
||||
<v-col cols="12">
|
||||
<v-img
|
||||
:src="require('../assets/logo.svg')"
|
||||
class="my-3"
|
||||
contain
|
||||
height="200"
|
||||
/>
|
||||
</v-col>
|
||||
|
||||
<v-col class="mb-4">
|
||||
<h1 class="display-2 font-weight-bold mb-3">
|
||||
Welcome to Vuetify
|
||||
</h1>
|
||||
|
||||
<p class="subheading font-weight-regular">
|
||||
For help and collaboration with other Vuetify developers,
|
||||
<br>please join our online
|
||||
<a
|
||||
href="https://community.vuetifyjs.com"
|
||||
target="_blank"
|
||||
>Discord Community</a>
|
||||
</p>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="mb-5"
|
||||
cols="12"
|
||||
>
|
||||
<h2 class="headline font-weight-bold mb-3">
|
||||
What's next?
|
||||
</h2>
|
||||
|
||||
<v-row justify="center">
|
||||
<a
|
||||
v-for="(next, i) in whatsNext"
|
||||
:key="i"
|
||||
:href="next.href"
|
||||
class="subheading mx-3"
|
||||
target="_blank"
|
||||
>
|
||||
{{ next.text }}
|
||||
</a>
|
||||
</v-row>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="mb-5"
|
||||
cols="12"
|
||||
>
|
||||
<h2 class="headline font-weight-bold mb-3">
|
||||
Important Links
|
||||
</h2>
|
||||
|
||||
<v-row justify="center">
|
||||
<a
|
||||
v-for="(link, i) in importantLinks"
|
||||
:key="i"
|
||||
:href="link.href"
|
||||
class="subheading mx-3"
|
||||
target="_blank"
|
||||
>
|
||||
{{ link.text }}
|
||||
</a>
|
||||
</v-row>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="mb-5"
|
||||
cols="12"
|
||||
>
|
||||
<h2 class="headline font-weight-bold mb-3">
|
||||
Ecosystem
|
||||
</h2>
|
||||
|
||||
<v-row justify="center">
|
||||
<a
|
||||
v-for="(eco, i) in ecosystem"
|
||||
:key="i"
|
||||
:href="eco.href"
|
||||
class="subheading mx-3"
|
||||
target="_blank"
|
||||
>
|
||||
{{ eco.text }}
|
||||
</a>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
|
||||
data: () => ({
|
||||
ecosystem: [
|
||||
{
|
||||
text: 'vuetify-loader',
|
||||
href: 'https://github.com/vuetifyjs/vuetify-loader',
|
||||
},
|
||||
{
|
||||
text: 'github',
|
||||
href: 'https://github.com/vuetifyjs/vuetify',
|
||||
},
|
||||
{
|
||||
text: 'awesome-vuetify',
|
||||
href: 'https://github.com/vuetifyjs/awesome-vuetify',
|
||||
},
|
||||
],
|
||||
importantLinks: [
|
||||
{
|
||||
text: 'Documentation',
|
||||
href: 'https://vuetifyjs.com',
|
||||
},
|
||||
{
|
||||
text: 'Chat',
|
||||
href: 'https://community.vuetifyjs.com',
|
||||
},
|
||||
{
|
||||
text: 'Made with Vuetify',
|
||||
href: 'https://madewithvuejs.com/vuetify',
|
||||
},
|
||||
{
|
||||
text: 'Twitter',
|
||||
href: 'https://twitter.com/vuetifyjs',
|
||||
},
|
||||
{
|
||||
text: 'Articles',
|
||||
href: 'https://medium.com/vuetify',
|
||||
},
|
||||
],
|
||||
whatsNext: [
|
||||
{
|
||||
text: 'Explore components',
|
||||
href: 'https://vuetifyjs.com/components/api-explorer',
|
||||
},
|
||||
{
|
||||
text: 'Select a layout',
|
||||
href: 'https://vuetifyjs.com/getting-started/pre-made-layouts',
|
||||
},
|
||||
{
|
||||
text: 'Frequently Asked Questions',
|
||||
href: 'https://vuetifyjs.com/getting-started/frequently-asked-questions',
|
||||
},
|
||||
],
|
||||
}),
|
||||
}
|
||||
</script>
|
|
@ -48,6 +48,24 @@
|
|||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">GitHub</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="https://github.com/Troplo">Troplo</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Gitea</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="https://git.troplo.com/Troplo">Troplo</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
|
|
|
@ -1,15 +1,24 @@
|
|||
<template>
|
||||
<div id="home">
|
||||
<v-parallax class="troploGradient">
|
||||
<p class="text-h2 normal">asdasd</p>
|
||||
</v-parallax>
|
||||
<v-container class="text-center">
|
||||
<v-card elevation="12">
|
||||
<v-container>
|
||||
<p class="troploGradient">Troplo</p>
|
||||
<p class="text-h4">Full-stack web developer.</p>
|
||||
</v-container>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.troploGradient{
|
||||
background: -webkit-radial-gradient(#0179f3, #0190ea)
|
||||
font-size: 300px;
|
||||
font-style: italic;
|
||||
background:-webkit-radial-gradient(#0179f3, #0190ea);
|
||||
-webkit-background-clip:text
|
||||
}
|
||||
|
||||
.normal {
|
||||
font-color: #ffffff
|
||||
}
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
<v-container>
|
||||
<p class="justify-center text-center text-h4">Projects</p>
|
||||
<v-row>
|
||||
<v-col md="3" v-for="(project, index) in projects" :key="index">
|
||||
<v-card>
|
||||
<v-col md="3" v-for="(project, index) in getVisible" :key="index">
|
||||
<v-card elevation="8">
|
||||
<v-img
|
||||
:src="getImage(project.internalName)"
|
||||
></v-img>
|
||||
|
@ -26,6 +26,7 @@
|
|||
<v-chip
|
||||
v-for="tag in project.tags"
|
||||
:key="tag.id"
|
||||
:href="tag.link"
|
||||
:color="tag.color"
|
||||
>
|
||||
<v-icon>{{tag.icon}}</v-icon><template v-if="tag.icon"> </template>
|
||||
|
@ -114,11 +115,13 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
{
|
||||
internalName: "express",
|
||||
name: "Express",
|
||||
icon: "mdi-nodejs",
|
||||
link: "https://expressjs.com"
|
||||
},
|
||||
],
|
||||
description: "A 3D sandbox game, and social avatar platform written in Express and Vue.js.",
|
||||
|
@ -149,11 +152,13 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
{
|
||||
internalName: "express",
|
||||
name: "Express",
|
||||
icon: "mdi-nodejs",
|
||||
link: "https://expressjs.com"
|
||||
},
|
||||
],
|
||||
description: "An invite only file uploading service written in Express and Vue.js.",
|
||||
|
@ -184,12 +189,14 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
{
|
||||
internalName: "crystal",
|
||||
color: "black",
|
||||
name: "Crystal",
|
||||
icon: "mdi-language-ruby",
|
||||
link: "https://crystal-lang.org"
|
||||
},
|
||||
],
|
||||
description: "EPUB reader written in Crystal and Vue.js.",
|
||||
|
@ -215,11 +222,13 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
{
|
||||
internalName: "adonis",
|
||||
name: "Adonis.JS",
|
||||
icon: "mdi-nodejs",
|
||||
link: "https://adonisjs.com"
|
||||
},
|
||||
],
|
||||
description: "Helping create the brand new website for Polytoria, a 3D sandbox platform.",
|
||||
|
@ -250,12 +259,14 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
{
|
||||
internalName: "crystal",
|
||||
color: "black",
|
||||
name: "Crystal",
|
||||
icon: "mdi-language-ruby",
|
||||
link: "https://crystal-lang.org"
|
||||
},
|
||||
],
|
||||
description: "Self hostable, and open source file uploading service created to be performant, and modular.\nName not finalized.",
|
||||
|
@ -293,10 +304,11 @@ export default {
|
|||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
link: "https://vuejs.org"
|
||||
},
|
||||
],
|
||||
description: "If you want the source code to this website for whatever reason, it is available.",
|
||||
visible: true,
|
||||
visible: false,
|
||||
links: [
|
||||
{
|
||||
name: "Git Repository",
|
||||
|
@ -311,6 +323,11 @@ export default {
|
|||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getVisible() {
|
||||
return this.projects.filter(i => i.visible)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getImage(image) {
|
||||
try {
|
||||
|
|
Loading…
Reference in a new issue