latest
This commit is contained in:
parent
2b7b3d0658
commit
2539f257ef
11 changed files with 328 additions and 37 deletions
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "jays-host",
|
||||
"name": "troplo-base",
|
||||
"version": "1.0.0",
|
||||
"description": "A ShareX photo gallery.",
|
||||
"description": "troplo-base",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"serve": "nodemon --ignore ./ui/"
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"build": "vue-cli-service build --no-clean",
|
||||
"lint": "vue-cli-service lint",
|
||||
"postinstall": "patch-package"
|
||||
},
|
||||
|
|
BIN
ui/src/assets/images/polytoria.png
Normal file
BIN
ui/src/assets/images/polytoria.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 328 KiB |
BIN
ui/src/assets/images/proj01.png
Normal file
BIN
ui/src/assets/images/proj01.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 338 KiB |
|
@ -43,7 +43,7 @@ export default {
|
|||
items: [
|
||||
{id: 1, title: "Home", icon: "mdi-home", path: "/"},
|
||||
{id: 2, title: "Projects", icon: "mdi-text-box-multiple", path: "/projects"},
|
||||
{id: 3, title: "Contact", icon: "mdi-mail", path: "/contact"}
|
||||
{id: 3, title: "Contact", icon: "mdi-email", path: "/contact"}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
|
|
@ -25,6 +25,22 @@ const routes = [
|
|||
// which is lazy-loaded when the route is visited.
|
||||
component: () => import(/* webpackChunkName: "nexus" */ '../views/Nexus.vue')
|
||||
},
|
||||
{
|
||||
path: '/contact',
|
||||
name: 'Contact',
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (about.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: () => import(/* webpackChunkName: "contact" */ '../views/Contact.vue')
|
||||
},
|
||||
{
|
||||
path: '*',
|
||||
name: 'Not Found',
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (about.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: () => import(/* webpackChunkName: "notFound" */ '../views/NotFound.vue')
|
||||
},
|
||||
]
|
||||
|
||||
const router = new VueRouter({
|
||||
|
|
|
@ -6,6 +6,7 @@ Vue.use(Vuex)
|
|||
export default new Vuex.Store({
|
||||
state: {
|
||||
site: {
|
||||
name: 'Troplo\'s Website',
|
||||
route: ''
|
||||
}
|
||||
},
|
||||
|
|
64
ui/src/views/Contact.vue
Normal file
64
ui/src/views/Contact.vue
Normal file
|
@ -0,0 +1,64 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-container class="justify-center text-center">
|
||||
<p class="text-h4">Contact</p>
|
||||
<v-row>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Email</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="mailto:troplo@troplo.com">troplo@troplo.com</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Matrix</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="https://matrix.to/#/@troplo:troplo.com?via=troplo.com">@troplo:troplo.com</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Discord</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
Troplo#8495
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Twitter</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="https://twitter.com/TheTroplo">@TheTroplo</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col md="3">
|
||||
<v-card>
|
||||
<v-card-title class="justify-center">Telegram</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<a href="https://t.me/Troplo">@Troplo</a>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Contact"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -1,9 +1,20 @@
|
|||
<template>
|
||||
<div id="home">
|
||||
|
||||
<v-parallax class="troploGradient">
|
||||
<p class="text-h2 normal">asdasd</p>
|
||||
</v-parallax>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.troploGradient {
|
||||
background: -webkit-radial-gradient(#0179f3, #0190ea)
|
||||
}
|
||||
.normal {
|
||||
font-color: #ffffff
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Home',
|
||||
|
|
23
ui/src/views/NotFound.vue
Normal file
23
ui/src/views/NotFound.vue
Normal file
|
@ -0,0 +1,23 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-container>
|
||||
<v-card>
|
||||
<v-container class="text-center">
|
||||
<p class="text-h4">Not Found.</p>
|
||||
<p class="subtitle">This route does not exist.</p>
|
||||
<v-btn text @click="$router.push('/')">Go Home</v-btn>
|
||||
</v-container>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "NotFound"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -1,33 +1,52 @@
|
|||
<template>
|
||||
<div id="projects">
|
||||
<v-container class="justify-center text-center">
|
||||
<p class="text-h4">Projects</p>
|
||||
<v-container>
|
||||
<p class="justify-center text-center text-h4">Projects</p>
|
||||
<v-row>
|
||||
<v-col v-for="(project, index) in projects" :key="index">
|
||||
<v-card elevation="12">
|
||||
<v-container>
|
||||
<center>
|
||||
<p class="text-h5">{{project.name}}</p>
|
||||
<v-col md="3" v-for="(project, index) in projects" :key="index">
|
||||
<v-card>
|
||||
<v-img
|
||||
:src="getImage(project.internalName)"
|
||||
></v-img>
|
||||
|
||||
<v-card-title>{{project.name}}</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<div>{{project.description}}</div>
|
||||
</v-card-text>
|
||||
|
||||
<v-divider class="mx-4"></v-divider>
|
||||
|
||||
<v-card-title>More Information</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<v-chip-group
|
||||
column
|
||||
>
|
||||
<v-chip
|
||||
class="ma-1"
|
||||
v-for="tag in project.tags"
|
||||
:key="tag"
|
||||
:key="tag.id"
|
||||
:color="tag.color"
|
||||
>
|
||||
<v-icon>{{tag.icon}}</v-icon><template v-if="tag.icon"> </template>
|
||||
{{tag.name}}
|
||||
</v-chip>
|
||||
<p>{{project.description}}</p>
|
||||
<v-card-actions class="justify-center">
|
||||
<v-chip rounded color="deep-purple" class="ma-1" v-if="project.links.website">
|
||||
<v-icon>mdi-web</v-icon> Website
|
||||
</v-chip>
|
||||
<v-chip rounded color="indigo" class="ma-1" v-if="project.links.git">
|
||||
<v-icon>mdi-git</v-icon> Git Repository
|
||||
</v-chip>
|
||||
</v-card-actions>
|
||||
</center>
|
||||
</v-container>
|
||||
</v-chip-group>
|
||||
</v-card-text>
|
||||
|
||||
<v-divider v-if="project.links.length" class="mx-4"></v-divider>
|
||||
|
||||
<v-card-actions>
|
||||
<v-btn
|
||||
v-for="link in project.links"
|
||||
:key="link.name"
|
||||
color="blue"
|
||||
text
|
||||
:href="link.link"
|
||||
>
|
||||
{{link.name}}
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
@ -90,13 +109,24 @@ export default {
|
|||
name: "Open Source",
|
||||
icon: "mdi-git"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
{
|
||||
internalName: "express",
|
||||
name: "Express",
|
||||
icon: "mdi-nodejs",
|
||||
},
|
||||
],
|
||||
description: "A 3D sandbox game, and social avatar community written in Express and Vue.js.",
|
||||
description: "A 3D sandbox game, and social avatar platform written in Express and Vue.js.",
|
||||
visible: true,
|
||||
links: {
|
||||
website: "https://kaverti.com",
|
||||
git: "https://git.troplo.com/Kaverti/website"
|
||||
}
|
||||
links: [{
|
||||
name: "Git Repository",
|
||||
link: "https://git.troplo.com/Kaverti/website"
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
|
@ -106,27 +136,42 @@ export default {
|
|||
{
|
||||
internalName: "active",
|
||||
name: "Active",
|
||||
icon: "mdi-check-circle",
|
||||
color: "success"
|
||||
},
|
||||
{
|
||||
internalName: "freelance",
|
||||
name: "Freelance",
|
||||
icon: "mdi-currency-usd"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
{
|
||||
internalName: "express",
|
||||
name: "Express",
|
||||
icon: "mdi-nodejs",
|
||||
},
|
||||
],
|
||||
description: "An invite only file uploading service written in Express and Vue.js.",
|
||||
visible: true,
|
||||
links: {
|
||||
website: "https://jays.host"
|
||||
}
|
||||
links: [{
|
||||
name: "Website",
|
||||
link: "https://jays.host"
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: "Mira",
|
||||
name: "Pinnoto Mira",
|
||||
internalName: "mira",
|
||||
tags: [
|
||||
{
|
||||
internalName: "development",
|
||||
name: "In Development",
|
||||
icon: "mdi-information",
|
||||
color: "info"
|
||||
},
|
||||
{
|
||||
|
@ -134,15 +179,146 @@ export default {
|
|||
name: "Open Source",
|
||||
icon: "mdi-git"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
{
|
||||
internalName: "crystal",
|
||||
color: "black",
|
||||
name: "Crystal",
|
||||
icon: "mdi-language-ruby",
|
||||
},
|
||||
],
|
||||
description: "EPUB reader written in Crystal and Vue.js.",
|
||||
visible: true,
|
||||
links: {
|
||||
git: "https://github.com/pinnoto/mira"
|
||||
}
|
||||
links: [{
|
||||
name: "Git Repository",
|
||||
link: "https://github.com/pinnoto/mira"
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: "Polytoria",
|
||||
internalName: "polytoria",
|
||||
tags: [
|
||||
{
|
||||
internalName: "development",
|
||||
name: "In Development",
|
||||
icon: "mdi-information",
|
||||
color: "info"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
{
|
||||
internalName: "adonis",
|
||||
name: "Adonis.JS",
|
||||
icon: "mdi-nodejs",
|
||||
},
|
||||
],
|
||||
description: "Helping create the brand new website for Polytoria, a 3D sandbox platform.",
|
||||
visible: true,
|
||||
links: [{
|
||||
name: "Website",
|
||||
link: "https://polytoria.com"
|
||||
}],
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: "Pinnoto Berri",
|
||||
internalName: "berri",
|
||||
tags: [
|
||||
{
|
||||
internalName: "development",
|
||||
name: "In Development",
|
||||
icon: "mdi-information",
|
||||
color: "info"
|
||||
},
|
||||
{
|
||||
internalName: "openSource",
|
||||
name: "Open Source",
|
||||
icon: "mdi-git"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
{
|
||||
internalName: "crystal",
|
||||
color: "black",
|
||||
name: "Crystal",
|
||||
icon: "mdi-language-ruby",
|
||||
},
|
||||
],
|
||||
description: "Self hostable, and open source file uploading service created to be performant, and modular.\nName not finalized.",
|
||||
visible: true,
|
||||
links: {}
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: "Flowinity",
|
||||
internalName: "flowinity",
|
||||
tags: [
|
||||
{
|
||||
internalName: "development",
|
||||
name: "In Development",
|
||||
icon: "mdi-information",
|
||||
color: "info"
|
||||
}
|
||||
],
|
||||
description: "A tech blog.",
|
||||
visible: true,
|
||||
links: {}
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: "Website",
|
||||
internalName: "troplo-website",
|
||||
tags: [
|
||||
{
|
||||
internalName: "openSource",
|
||||
name: "Open Source",
|
||||
icon: "mdi-git"
|
||||
},
|
||||
{
|
||||
internalName: "vue",
|
||||
name: "Vue",
|
||||
icon: "mdi-vuejs",
|
||||
color: "#42b883",
|
||||
},
|
||||
],
|
||||
description: "If you want the source code to this website for whatever reason, it is available.",
|
||||
visible: true,
|
||||
links: [
|
||||
{
|
||||
name: "Git Repository",
|
||||
link: "https://git.troplo.com/Troplo/website-new"
|
||||
},
|
||||
{
|
||||
name: "Website",
|
||||
link: "https://troplo.com"
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getImage(image) {
|
||||
try {
|
||||
return require('../assets/images/' + image + '.png')
|
||||
} catch {
|
||||
return "https://dummyimage.com/1920x1080/151515/ffffff.png&text=" + image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in a new issue