This commit is contained in:
Troplo 2022-02-05 14:39:37 +11:00
parent facecc0f88
commit 10304968c8
59 changed files with 9653 additions and 676 deletions

14
.eslintrc.js Normal file
View File

@ -0,0 +1,14 @@
module.exports = {
root: true,
env: {
node: true
},
extends: ["plugin:vue/essential", "eslint:recommended"],
parserOptions: {
parser: "babel-eslint"
},
rules: {
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off"
}
}

51
.gitignore vendored
View File

@ -1,28 +1,23 @@
# Node Modules
node_modules
# Local ENV files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor Directories/Files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
.DS_Store
yarn.lock
# Custom
.env
config/config.json
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

4
.prettierignore Normal file
View File

@ -0,0 +1,4 @@
# Ignore artifacts:
dist
public
patches

13
.prettierrc Normal file
View File

@ -0,0 +1,13 @@
{
"tabWidth": 2,
"useTabs": false,
"semi": false,
"singleQuote": false,
"trailingComma": "none",
"bracketSpacing": true,
"jsxBracketSameLine": false,
"arrowParens": "always",
"requirePragma": false,
"insertPragma": false,
"proseWrap": "always"
}

View File

@ -1,24 +1,29 @@
# ui
## Project setup
```
yarn install
```
### Compiles and hot-reloads for development
```
yarn serve
```
### Compiles and minifies for production
```
yarn build
```
### Lints and fixes files
```
yarn lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).

3
babel.config.js Normal file
View File

@ -0,0 +1,3 @@
module.exports = {
presets: ["@vue/cli-plugin-babel/preset"]
}

View File

@ -1,41 +1,37 @@
{
"name": "troplo-base",
"version": "1.0.0",
"description": "troplo-base",
"main": "index.js",
"scripts": {
"serve": "nodemon --ignore ./ui/"
},
"author": "Troplo",
"license": "Internal use only.",
"private": true,
"dependencies": {
"@discordjs/rest": "^0.1.0-canary.0",
"axios": "^0.21.1",
"bcryptjs": "^2.4.3",
"body-parser": "^1.19.0",
"btcpay": "^0.2.5",
"btoa": "^1.2.1",
"cloudflare": "^2.8.0",
"cors": "^2.8.5",
"crypto-random-string": "3.3.1",
"discord.js": "^13.1.0",
"dotenv": "^10.0.0",
"express": "^4.17.1",
"express-autosanitizer": "^1.0.2",
"form-data": "^4.0.0",
"helmet": "^4.6.0",
"is-valid-domain": "^0.1.2",
"jsonwebtoken": "^8.5.1",
"jw-paginate": "^1.0.4",
"microstats": "^0.1.2",
"moment": "^2.29.1",
"multer": "^1.4.2",
"mysql2": "^2.2.5",
"nodemon": "^2.0.12",
"sequelize": "^6.6.5",
"sequelize-cli": "^6.2.0",
"speakeasy": "^2.0.0",
"whois": "^2.13.5"
}
}
{
"name": "troplo-site",
"version": "1.0.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build --no-clean",
"lint": "vue-cli-service lint",
"postinstall": "patch-package"
},
"dependencies": {
"core-js": "^3.6.5",
"patch-package": "^6.4.7",
"register-service-worker": "^1.7.1",
"vue": "^2.6.11",
"vue-router": "^3.2.0",
"vuetify": "^2.5.10",
"vuex": "^3.4.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-pwa": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"sass": "~1.32.0",
"sass-loader": "^10.0.0",
"vue-cli-plugin-vuetify": "~2.4.2",
"vue-template-compiler": "^2.6.11",
"vuetify-loader": "^1.7.0",
"prettier": "^2.5.1"
}
}

View File

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

View File

Before

Width:  |  Height:  |  Size: 9.2 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB

View File

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

View File

Before

Width:  |  Height:  |  Size: 6.3 KiB

After

Width:  |  Height:  |  Size: 6.3 KiB

View File

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 22 KiB

View File

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

View File

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

Before

Width:  |  Height:  |  Size: 799 B

After

Width:  |  Height:  |  Size: 799 B

View File

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

View File

@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.00251 14.9297L0 1.07422H6.14651L8.00251 4.27503L9.84583 1.07422H16L8.00251 14.9297Z" fill="black"/>
</svg>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.00251 14.9297L0 1.07422H6.14651L8.00251 4.27503L9.84583 1.07422H16L8.00251 14.9297Z" fill="black"/>
</svg>

Before

Width:  |  Height:  |  Size: 218 B

After

Width:  |  Height:  |  Size: 215 B

View File

@ -1,22 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,700;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,700;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -1,2 +1,2 @@
User-agent: *
Disallow:
User-agent: *
Disallow:

View File

@ -1,81 +1,80 @@
<template>
<v-app>
<v-main>
<Header></Header>
<router-view/>
</v-main>
</v-app>
</template>
<style>
.troplo-header {
-webkit-font-smoothing: antialiased !important;
background: -webkit-radial-gradient(#0179f3, #0190ea) !important;
}
.troplo-header-title {
-webkit-font-smoothing: antialiased !important;
font-family: 'Montserrat', sans-serif;
font-weight: 450;
elevation: 0 !important;
font-size: 15rem;
font-style: italic;
text-shadow: none !important;
color: -webkit-radial-gradient(#0179f3, #0190ea) !important;
-webkit-background-clip: text
}
.troplo-title {
font-weight: 500;
background: -webkit-radial-gradient(#0179f3, #0190ea);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent
}
.theme--dark.v-sheet {
background-color: #151515 !important;
border-color: #151515 !important;
color: #FFFFFF;
}
.card {
overflow: hidden
}
.theme--dark.v-card {
background-color: #151515 !important;
}
/* Works on Firefox */
* {
scrollbar-width: thin;
scrollbar-color: black #151515;
}
/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 12px;
}
*::-webkit-scrollbar-track {
background: #0e0e0e;
}
*::-webkit-scrollbar-thumb {
background-color: #151515;
border-radius: 20px;
border: 3px solid #151515;
}
</style>
<script>
import Header from './components/Header.vue'
export default {
name: 'App',
components: {
Header
},
data: () => ({
//
}),
watch: {
$route (to) {
this.$store.commit('setRoute', to.name)
document.title = to.name + ' - ' + this.$store.state.site.name
}
}
};
</script>
<template>
<v-app>
<v-main>
<Header></Header>
<router-view />
</v-main>
</v-app>
</template>
<style>
.troplo-header {
-webkit-font-smoothing: antialiased !important;
background: -webkit-radial-gradient(#0179f3, #0190ea) !important;
}
.troplo-header-title {
-webkit-font-smoothing: antialiased !important;
font-family: "Montserrat", sans-serif;
font-weight: 450;
elevation: 0 !important;
font-size: 15rem;
font-style: italic;
text-shadow: none !important;
color: -webkit-radial-gradient(#0179f3, #0190ea) !important;
-webkit-background-clip: text;
}
.troplo-title {
font-weight: 500;
background: -webkit-radial-gradient(#0179f3, #0190ea);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.theme--dark.v-sheet {
background-color: #151515 !important;
border-color: #151515 !important;
color: #ffffff;
}
.card {
overflow: hidden;
}
.theme--dark.v-card {
background-color: #151515 !important;
}
/* Works on Firefox */
* {
scrollbar-width: thin;
scrollbar-color: black #151515;
}
/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 12px;
}
*::-webkit-scrollbar-track {
background: #0e0e0e;
}
*::-webkit-scrollbar-thumb {
background-color: #151515;
border-radius: 20px;
border: 3px solid #151515;
}
</style>
<script>
import Header from "./components/Header.vue"
export default {
name: "App",
components: {
Header
},
data: () => ({
//
}),
watch: {
$route(to) {
this.$store.commit("setRoute", to.name)
document.title = to.name + " - " + this.$store.state.site.name
}
}
}
</script>

View File

Before

Width:  |  Height:  |  Size: 273 KiB

After

Width:  |  Height:  |  Size: 273 KiB

View File

Before

Width:  |  Height:  |  Size: 328 KiB

After

Width:  |  Height:  |  Size: 328 KiB

View File

Before

Width:  |  Height:  |  Size: 338 KiB

After

Width:  |  Height:  |  Size: 338 KiB

View File

Before

Width:  |  Height:  |  Size: 2.9 MiB

After

Width:  |  Height:  |  Size: 2.9 MiB

View File

Before

Width:  |  Height:  |  Size: 571 KiB

After

Width:  |  Height:  |  Size: 571 KiB

View File

Before

Width:  |  Height:  |  Size: 6.7 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

View File

Before

Width:  |  Height:  |  Size: 539 B

After

Width:  |  Height:  |  Size: 539 B

94
src/components/Header.vue Normal file
View File

@ -0,0 +1,94 @@
<template>
<div id="header">
<v-toolbar dark>
<v-app-bar-nav-icon
@click.stop="sidebar = !sidebar"
v-if="$vuetify.breakpoint.mobile"
></v-app-bar-nav-icon>
<v-toolbar-title
class="troplo-title"
@click="$router.push('/')"
style="cursor: pointer"
>Troplo</v-toolbar-title
>
<v-spacer></v-spacer>
<v-list v-if="!$vuetify.breakpoint.mobile">
<v-btn
text
v-for="item in items"
:key="item.id"
:to="item.path"
style="text-transform: unset !important;"
:disabled="item.disabled"
>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-btn>
<v-btn
v-if="false"
text
@click="$vuetify.theme.dark = !$vuetify.theme.dark"
>
<v-list-item-title>
<v-icon>{{
$vuetify.theme.dark ? "mdi-lightbulb-on" : "mdi-lightbulb-outline"
}}</v-icon>
</v-list-item-title>
</v-btn>
</v-list>
</v-toolbar>
<v-navigation-drawer
floating
color="dark"
app
v-model="sidebar"
v-if="$vuetify.breakpoint.mobile"
expand
>
<v-divider></v-divider>
<v-list nav dense>
<v-list-item v-for="item in items" :key="item.id" link :to="item.path">
<v-list-item-icon>
<v-icon>{{ item.icon }}</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item link @click="$vuetify.theme.dark = !$vuetify.theme.dark" v-if="false">
<v-list-item-icon>
<v-icon>{{
$vuetify.theme.dark ? "mdi-lightbulb-on" : "mdi-lightbulb-outline"
}}</v-icon>
</v-list-item-icon>
</v-list-item>
</v-list>
</v-navigation-drawer>
</div>
</template>
<script>
export default {
name: "Header",
data() {
return {
sidebar: false,
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-email", path: "/contact" }
]
}
},
mounted() {
this.$vuetify.theme = { dark: true }
}
}
</script>
<style scoped></style>

14
src/main.js Normal file
View File

@ -0,0 +1,14 @@
import Vue from "vue"
import App from "./App.vue"
import "./registerServiceWorker"
import router from "./router"
import vuetify from "./plugins/vuetify"
import store from "./store"
Vue.config.productionTip = false
new Vue({
router,
vuetify,
store,
render: (h) => h(App)
}).$mount("#app")

25
src/plugins/vuetify.js Normal file
View File

@ -0,0 +1,25 @@
import Vue from "vue"
import Vuetify from "vuetify/lib/framework"
import colors from "vuetify/es5/util/colors"
Vue.use(Vuetify)
export default new Vuetify({
theme: {
themes: {
light: {
primary: colors.blue.lighten3,
secondary: colors.grey.darken1,
accent: colors.shades.black,
error: colors.red.accent3,
dark: "#151515",
text: "#000000"
},
dark: {
primary: colors.blue,
dark: "#151515",
text: "#ffffff"
}
}
}
})

View File

@ -0,0 +1,34 @@
/* eslint-disable no-console */
import { register } from "register-service-worker"
if (process.env.NODE_ENV === "production") {
register(`${process.env.BASE_URL}service-worker.js`, {
ready() {
console.log(
"App is being served from cache by a service worker.\n" +
"For more details, visit https://goo.gl/AFskqB"
)
},
registered() {
console.log("Service worker has been registered.")
},
cached() {
console.log("Content has been cached for offline use.")
},
updatefound() {
console.log("New content is downloading.")
},
updated() {
console.log("New content is available; please refresh.")
},
offline() {
console.log(
"No internet connection found. App is running in offline mode."
)
},
error(error) {
console.error("Error during service worker registration:", error)
}
})
}

46
src/router/index.js Normal file
View File

@ -0,0 +1,46 @@
import Vue from "vue"
import VueRouter from "vue-router"
Vue.use(VueRouter)
const routes = [
{
path: "/",
name: "Home",
component: () => import(/* webpackChunkName: "home" */ "../views/Home.vue")
},
{
path: "/projects",
name: "Projects",
// 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: "projects" */ "../views/Projects.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({
routes,
mode: "history"
})
export default router

View File

@ -1,5 +1,5 @@
import Vue from 'vue'
import Vuex from 'vuex'
import Vue from "vue"
import Vuex from "vuex"
Vue.use(Vuex)
@ -18,8 +18,6 @@ export default new Vuex.Store({
state.site.route = data
}
},
actions: {
},
modules: {
}
actions: {},
modules: {}
})

99
src/views/Contact.vue Normal file
View File

@ -0,0 +1,99 @@
<template>
<div>
<v-container class="justify-center text-center">
<p class="text-h4">Contact</p>
<v-row>
<v-col
md="3"
xs="3"
sm="3"
cols="6"
v-for="contact in contacts"
:key="contact.id"
>
<v-card class="rounded-xl" elevation="8">
<br />
<v-icon>{{ contact.icon }}</v-icon>
<v-card-title class="justify-center">{{
contact.title
}}</v-card-title>
<v-card-text>
<a :href="contact.url">{{ contact.displayName }}</a>
</v-card-text>
</v-card>
</v-col>
</v-row>
</v-container>
</div>
</template>
<script>
export default {
name: "Contact",
data() {
return {
contacts: [
{
id: 1,
icon: "mdi-email",
title: "Email",
displayName: "troplo@troplo.com",
url: "mailto:troplo@troplo.com"
},
{
id: 2,
icon: "mdi-matrix",
title: "Matrix",
displayName: "@troplo:troplo.com",
url: "https://matrix.to/#/@troplo:troplo.com?via=troplo.com"
},
{
id: 3,
icon: "mdi-discord",
title: "Discord",
displayName: "Troplo#8495",
url: "https://discord.com/users/692259321907773460"
},
{
id: 4,
icon: "mdi-twitter",
title: "Twitter",
displayName: "@TheTroplo",
url: "https://twitter.com/TheTroplo"
},
{
id: 5,
icon: "mdi-send",
title: "Telegram",
displayName: "@Troplo",
url: "https://t.me/Troplo"
},
{
id: 6,
icon: "mdi-github",
title: "GitHub",
displayName: "Troplo",
url: "https://github.com/Troplo"
},
{
id: 8,
icon: "mdi-tea",
title: "Gitea",
displayName: "Troplo",
url: "https://git.troplo.com/Troplo"
},
{
id: 7,
icon: "mdi-gitlab",
title: "GitLab",
displayName: "Troplo",
url: "https://gitlab.com/Troplo"
}
]
}
}
}
</script>
<style scoped></style>

View File

@ -1,18 +1,26 @@
<template>
<div id="home">
<v-container class="text-center">
<v-card elevation="8" class="troplo-header rounded-xl">
<v-container>
<div v-if="!$vuetify.breakpoint.mobile" class="troplo-header-title">Troplo</div>
<div v-if="$vuetify.breakpoint.mobile" class="troplo-header-title" style="background: -webkit-radial-gradient(#0179f3, #0190ea);">T</div>
</v-container>
</v-card>
</v-container>
</div>
</template>
<script>
export default {
name: 'Home',
}
</script>
<template>
<div id="home">
<v-container class="text-center">
<v-card elevation="8" class="troplo-header rounded-xl">
<v-container>
<div v-if="!$vuetify.breakpoint.mobile" class="troplo-header-title">
Troplo
</div>
<div
v-if="$vuetify.breakpoint.mobile"
class="troplo-header-title"
style="background: -webkit-radial-gradient(#0179f3, #0190ea)"
>
T
</div>
</v-container>
</v-card>
</v-container>
</div>
</template>
<script>
export default {
name: "Home"
}
</script>

View File

@ -1,15 +1,11 @@
<template>
<div id="nexus">
</div>
</template>
<script>
export default {
name: "Nexus"
}
</script>
<style scoped>
</style>
<template>
<div id="nexus"></div>
</template>
<script>
export default {
name: "Nexus"
}
</script>
<style scoped></style>

View File

@ -1,7 +1,7 @@
<template>
<div>
<v-container>
<v-card>
<v-card elevation="8" class="rounded-xl">
<v-container class="text-center">
<p class="text-h4">Not Found.</p>
<p class="subtitle">This route does not exist.</p>
@ -18,6 +18,4 @@ export default {
}
</script>
<style scoped>
</style>
<style scoped></style>

View File

@ -5,49 +5,46 @@
<v-row>
<v-col md="3" v-for="(project, index) in getVisible" :key="index">
<v-card class="rounded-xl" elevation="8">
<v-img
:src="getImage(project.internalName)"
></v-img>
<v-img :src="getImage(project.internalName)"></v-img>
<v-card-title>{{project.name}}</v-card-title>
<v-card-title>{{ project.name }}</v-card-title>
<v-card-text>
<div>{{project.description}}</div>
<div>{{ project.description }}</div>
</v-card-text>
<v-divider class="mx-4"></v-divider>
<v-card-title>More Information</v-card-title>
<v-card-title>Information</v-card-title>
<v-card-text>
<v-chip-group
column
>
<v-chip-group column>
<v-chip
v-for="tag in project.tags"
:key="tag.id"
:href="tag.link"
:color="tag.color"
disabled
style="opacity: 1"
v-for="tag in project.tags"
:key="tag.id"
:href="tag.link"
:color="tag.color"
disabled
style="opacity: 1"
>
<v-icon>{{tag.icon}}</v-icon><template v-if="tag.icon">&nbsp;</template>
{{tag.name}}
<v-icon>{{ tag.icon }}</v-icon
><template v-if="tag.icon">&nbsp;</template>
{{ tag.name }}
</v-chip>
</v-chip-group>
</v-card-text>
<v-divider v-if="project.links.length" class="mx-4"></v-divider>
<v-card-actions>
<v-card-actions v-if="project.links.length">
<v-btn
v-for="link in project.links"
:key="link.name"
color="blue"
text
:href="link.link"
v-for="link in project.links"
:key="link.name"
color="blue"
text
:href="link.link"
>
{{link.name}}
{{ link.name }}
</v-btn>
</v-card-actions>
</v-card>
@ -91,14 +88,17 @@ export default {
name: "Express",
icon: "mdi-nodejs",
link: "https://expressjs.com"
},
}
],
description: "A 3D sandbox game, and social avatar platform written in Express and Vue.js.",
description:
"A 3D sandbox game, and social avatar platform written in Express and Vue.js.",
visible: true,
links: [{
name: "Git Repository",
link: "https://git.troplo.com/Kaverti/website"
}],
links: [
{
name: "Git Repository",
link: "https://git.troplo.com/Kaverti/website"
}
]
},
{
id: 2,
@ -128,14 +128,17 @@ export default {
name: "Express",
icon: "mdi-nodejs",
link: "https://expressjs.com"
},
}
],
description: "An invite only file uploading service written in Express and Vue.js.",
description:
"An invite only file uploading service written in Express and Vue.js.",
visible: true,
links: [{
name: "Website",
link: "https://jays.host"
}],
links: [
{
name: "Website",
link: "https://jays.host"
}
]
},
{
id: 3,
@ -166,14 +169,16 @@ export default {
name: "Crystal",
icon: "mdi-language-ruby",
link: "https://crystal-lang.org"
},
}
],
description: "EPUB reader written in Crystal and Vue.js.",
visible: true,
links: [{
name: "Git Repository",
link: "https://github.com/pinnoto/mira"
}],
links: [
{
name: "Git Repository",
link: "https://github.com/pinnoto/mira"
}
]
},
{
id: 4,
@ -198,14 +203,17 @@ export default {
name: "Adonis.JS",
icon: "mdi-nodejs",
link: "https://adonisjs.com"
},
}
],
description: "Helping create the brand new website for Polytoria, a 3D sandbox platform.",
description:
"Helping create the brand new website for Polytoria, a 3D sandbox platform.",
visible: true,
links: [{
name: "Website",
link: "https://polytoria.com"
}],
links: [
{
name: "Website",
link: "https://polytoria.com"
}
]
},
{
id: 5,
@ -236,9 +244,10 @@ export default {
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.",
description:
"Self hostable, and open source file uploading service created to be performant, and modular.\nName not finalized.",
visible: true,
links: {}
},
@ -260,7 +269,7 @@ export default {
},
{
id: 7,
name: "Website",
name: "Troplo Website",
internalName: "troplo-website",
tags: [
{
@ -280,9 +289,10 @@ export default {
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.",
description:
"If you want the source code to this website for whatever reason, it is available.",
visible: true,
links: [
{
@ -292,8 +302,8 @@ export default {
{
name: "Website",
link: "https://troplo.com"
},
],
}
]
},
{
id: 8,
@ -319,9 +329,9 @@ export default {
icon: "mdi-infinity",
color: "#24c8db",
link: "https://tauri.studio"
},
}
],
description: "IDE. Coming soon.",
description: "Code editor. Coming soon.",
visible: true,
links: []
},
@ -346,7 +356,7 @@ export default {
name: "Express",
icon: "mdi-nodejs",
link: "https://expressjs.com"
},
}
],
description: "TroploPlex is a reimplementation of the myPlex API.",
visible: true,
@ -355,24 +365,26 @@ export default {
name: "Git Repository",
link: "https://git.troplo.com/Troplo/Plex"
}
],
},
]
}
]
}
},
computed: {
getVisible() {
return this.projects.filter(i => i.visible)
return this.projects.filter((i) => i.visible)
}
},
methods: {
getImage(image) {
try {
return require('../assets/images/' + image + '.png')
return require("../assets/images/" + image + ".png")
} catch {
return "https://dummyimage.com/1920x1080/151515/ffffff.png&text=" + image
return (
"https://dummyimage.com/1920x1080/151515/ffffff.png&text=" + image
)
}
}
}
}
</script>
</script>

View File

@ -1,17 +0,0 @@
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/essential',
'eslint:recommended'
],
parserOptions: {
parser: 'babel-eslint'
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}

23
ui/.gitignore vendored
View File

@ -1,23 +0,0 @@
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

View File

@ -1,5 +0,0 @@
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}

View File

@ -1,36 +0,0 @@
{
"name": "troplo-site",
"version": "1.0.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build --no-clean",
"lint": "vue-cli-service lint",
"postinstall": "patch-package"
},
"dependencies": {
"core-js": "^3.6.5",
"patch-package": "^6.4.7",
"register-service-worker": "^1.7.1",
"vue": "^2.6.11",
"vue-router": "^3.2.0",
"vuetify": "^2.5.10",
"vuex": "^3.4.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-pwa": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"sass": "~1.32.0",
"sass-loader": "^10.0.0",
"vue-cli-plugin-vuetify": "~2.4.2",
"vue-template-compiler": "^2.6.11",
"vuetify-loader": "^1.7.0"
}
}

View File

@ -1,87 +0,0 @@
<template>
<div id="header">
<v-toolbar
dark
>
<v-app-bar-nav-icon @click.stop="sidebar = !sidebar" v-if="$vuetify.breakpoint.mobile"></v-app-bar-nav-icon>
<v-toolbar-title class="troplo-title" @click="$router.push('/')" style="cursor: pointer">Troplo</v-toolbar-title>
<v-spacer></v-spacer>
<v-list v-if="!$vuetify.breakpoint.mobile">
<v-btn
text
v-for="(item) in items"
:key="item.id"
:to="item.path"
:disabled="item.disabled"
>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-btn>
<v-btn
v-if="false"
text
@click="$vuetify.theme.dark = !$vuetify.theme.dark"
>
<v-list-item-title>
<v-icon>{{ $vuetify.theme.dark ? 'mdi-lightbulb-on' : 'mdi-lightbulb-outline' }}</v-icon>
</v-list-item-title>
</v-btn>
</v-list>
</v-toolbar>
<v-navigation-drawer
floating
color="dark"
app
v-model="sidebar"
v-if="$vuetify.breakpoint.mobile"
expand>
<v-divider></v-divider>
<v-list nav dense>
<v-list-item
v-for="item in items"
:key="item.id"
link
:to="item.path"
>
<v-list-item-icon>
<v-icon>{{ item.icon }}</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item
link
@click="$vuetify.theme.dark = !$vuetify.theme.dark"
>
<v-list-item-icon>
<v-icon>{{ $vuetify.theme.dark ? 'mdi-lightbulb-on' : 'mdi-lightbulb-outline' }}</v-icon>
</v-list-item-icon>
</v-list-item>
</v-list>
</v-navigation-drawer>
</div>
</template>
<script>
export default {
name: "Header",
data() {
return {
sidebar: false,
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-email", path: "/contact"},
]
}
},
mounted() {
this.$vuetify.theme = { dark: true }
}
}
</script>
<style scoped>
</style>

View File

@ -1,14 +0,0 @@
import Vue from 'vue'
import App from './App.vue'
import './registerServiceWorker'
import router from './router'
import vuetify from './plugins/vuetify'
import store from './store'
Vue.config.productionTip = false
new Vue({
router,
vuetify,
store,
render: h => h(App)
}).$mount('#app')

View File

@ -1,25 +0,0 @@
import Vue from 'vue'
import Vuetify from 'vuetify/lib/framework'
import colors from "vuetify/es5/util/colors";
Vue.use(Vuetify)
export default new Vuetify({
theme: {
themes: {
light: {
primary: colors.blue.lighten3,
secondary: colors.grey.darken1,
accent: colors.shades.black,
error: colors.red.accent3,
dark: "#151515",
text: "#000000"
},
dark: {
primary: colors.blue,
dark: "#151515",
text: "#ffffff"
},
},
}
});

View File

@ -1,32 +0,0 @@
/* eslint-disable no-console */
import { register } from 'register-service-worker'
if (process.env.NODE_ENV === 'production') {
register(`${process.env.BASE_URL}service-worker.js`, {
ready () {
console.log(
'App is being served from cache by a service worker.\n' +
'For more details, visit https://goo.gl/AFskqB'
)
},
registered () {
console.log('Service worker has been registered.')
},
cached () {
console.log('Content has been cached for offline use.')
},
updatefound () {
console.log('New content is downloading.')
},
updated () {
console.log('New content is available; please refresh.')
},
offline () {
console.log('No internet connection found. App is running in offline mode.')
},
error (error) {
console.error('Error during service worker registration:', error)
}
})
}

View File

@ -1,51 +0,0 @@
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'Home',
component: () => import(/* webpackChunkName: "home" */ '../views/Home.vue')
},
{
path: '/projects',
name: 'Projects',
// 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: "projects" */ '../views/Projects.vue')
},
{
path: '/nexus',
name: 'Nexus',
// 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: "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({
routes,
mode: "history"
})
export default router

View File

@ -1,98 +0,0 @@
<template>
<div>
<v-container class="justify-center text-center">
<p class="text-h4">Contact</p>
<v-row>
<v-col md="3">
<v-card class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-email</v-icon>
<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 class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-matrix</v-icon>
<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 class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-discord</v-icon>
<v-card-title class="justify-center">Discord</v-card-title>
<v-card-text>
<a href="https://discord.com/users/692259321907773460">
Troplo#8495
</a>
</v-card-text>
</v-card>
</v-col>
<v-col md="3">
<v-card class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-twitter</v-icon>
<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 class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-send</v-icon>
<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-col md="3">
<v-card class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-github</v-icon>
<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 class="rounded-xl" elevation="8">
<br>
<v-icon>mdi-tea</v-icon>
<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>
</template>
<script>
export default {
name: "Contact"
}
</script>
<style scoped>
</style>

View File

@ -1,5 +0,0 @@
module.exports = {
transpileDependencies: [
'vuetify'
]
}

3
vue.config.js Normal file
View File

@ -0,0 +1,3 @@
module.exports = {
transpileDependencies: ["vuetify"]
}

9014
yarn.lock Normal file

File diff suppressed because it is too large Load Diff