Compare commits

..

1 Commits

Author SHA1 Message Date
Ayush Mukherjee 571cda01db tried but leave it 1 year ago

@ -0,0 +1,5 @@
root = true
[*]
indent_style = space
indent_size = 4

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 8.4 KiB

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

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

Before

Width:  |  Height:  |  Size: 404 B

After

Width:  |  Height:  |  Size: 404 B

Before

Width:  |  Height:  |  Size: 871 B

After

Width:  |  Height:  |  Size: 871 B

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

@ -19,11 +19,11 @@
<meta property="twitter:card" content="summary_large_image">
<!-- favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="<%= BASE_URL %>apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="<%= BASE_URL %>favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="<%= BASE_URL %>favicon-16x16.png">
<link rel="manifest" href="site.webmanifest">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" href="/favicon.ico">
<!-- nprogress -->
<script src="https://unpkg.com/nprogress@0.2.0/nprogress.js"></script>
@ -47,7 +47,7 @@
<strong>We're sorry but APL Esports doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script type="module" src="/src/main.js"></script>
<script>
AOS.init();
@ -61,6 +61,5 @@
NProgress.done()
};
</script>
</script>
</body>
</html>

28708
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -3,8 +3,8 @@
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
"dev": "vite",
"build": "vite build --out-dir dist"
},
"dependencies": {
"aos": "^2.3.4",
@ -18,11 +18,10 @@
"vue-twitter": "^0.1.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.5.9",
"@vue/cli-plugin-router": "^4.5.9",
"@vue/cli-service": "^4.5.9",
"vite": "^2.2.1",
"vite-plugin-vue2": "^1.4.4",
"@vue/compiler-sfc": "^3.0.11",
"sass": "^1.32.0",
"sass-loader": "^8.0.2",
"vue-template-compiler": "^2.6.12"
}
}

@ -31,16 +31,13 @@
</svg>
</div>
<router-link :to="{ name: 'Home' }" @click.native="closeMenu()">home</router-link>
<router-link :to="{ name: 'RumbleMain' }" :class="$route.name === 'RegionalRumble' && 'router-link-active' ? 'active' : ''" @click.native="closeMenu()">Regional Rumble</router-link>
<router-link :to="{ name: 'Nationals' }" :class="$route.name === 'Nationals' && 'router-link-active' ? 'active' : ''" @click.native="closeMenu()">nationals</router-link>
<!--<router-link :to="{ name: 'Kickoff' }" :class="$route.name === 'Kickoff' && 'router-link-active' ? 'active' : ''" @click.native="closeMenu()">the kickoff</router-link>-->
<router-link :to="{ name: 'News' }" :class="$route.name === 'News' && 'router-link-active' || $route.name === 'Article' && 'router-link-active' ? 'active' : ''" @click.native="closeMenu()">news</router-link>
<router-link :to="{ name: 'Tournaments' }" @click.native="closeMenu()">tournaments</router-link>
<router-link :to="{ name: 'Team' }" @click.native="closeMenu()">team</router-link>
<a href="https://discord.gg/q6Nf2eh" target="_blank" @click.native="closeMenu()">discord</a>
<!-- <a href="https://www.patreon.com/apl_esports" target="_blank" @click.native="closeMenu()">patreon</a> -->
<!--<a href="https://donate.aplesports.com" target="_blank" @click.native="closeMenu()">donate</a>-->
<router-link :to="{ name: 'Home' }" @click="closeMenu()">home</router-link>
<router-link :to="{ name: 'RumbleMain' }" :class="$route.name === 'RegionalRumble' && 'router-link-active' ? 'active' : ''" @click="closeMenu()">Regional Rumble</router-link>
<router-link :to="{ name: 'Nationals' }" :class="$route.name === 'Nationals' && 'router-link-active' ? 'active' : ''" @click="closeMenu()">nationals</router-link>
<router-link :to="{ name: 'News' }" :class="$route.name === 'News' && 'router-link-active' || $route.name === 'Article' && 'router-link-active' ? 'active' : ''" @click="closeMenu()">news</router-link>
<router-link :to="{ name: 'Tournaments' }" @click="closeMenu()">tournaments</router-link>
<router-link :to="{ name: 'Team' }" @click="closeMenu()">team</router-link>
<a href="https://discord.gg/q6Nf2eh" target="_blank" @click="closeMenu()">discord</a>
</div>
</nav>
</div>

@ -14,27 +14,27 @@ Vue.use(VueRouter)
{
path: '/team',
name: 'Team',
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
component: () => import('../views/About.vue')
},
{
path: '/news',
name: 'News',
component: () => import(/* webpackChunkName: "news" */'../views/News.vue')
component: () => import('../views/News.vue')
},
{
path: '/news/:id',
name: 'Article',
component: () => import(/* webpackChunkName: "news" */'../views/Article.vue')
component: () => import('../views/Article.vue')
},
{
path: '/tournaments',
name: 'Tournaments',
component: () => import(/* webpackChunkName: "tournaments" */'../views/Tournaments.vue')
component: () => import('../views/Tournaments.vue')
},
{
path: '/thekickoff',
name: 'Kickoff',
component: () => import(/* webpackChunkName: "tournaments" */'../views/Kickoff.vue')
component: () => import('../views/Kickoff.vue')
},
{
path: '/nationals',
@ -79,7 +79,7 @@ Vue.use(VueRouter)
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
base: import.meta.env.BASE_URL,
linkExactActiveClass: 'active',
routes,
scrollBehavior (to, from, savedPosition) {

@ -27,10 +27,7 @@
<script>
import axios from 'axios';
const md = require('markdown-it')({
breaks: true,
html: true
});
import * as MarkDownIt from 'markdown-it';
export default {
name: 'Article',
@ -41,11 +38,15 @@ export default {
id: null,
image: null,
content: null,
imgRoot: 'https://cms.aplesports.com/storage/uploads'
imgRoot: 'https://cms.aplesports.com/storage/uploads',
}
},
created() {
this.id = this.$route.params.id;
const md = new MarkDownIt({
breaks: true,
html: true,
});
axios.post("https://cms.aplesports.com/api/collections/get/News", {
"sort": {
@ -65,7 +66,7 @@ export default {
}
}, {
headers: {
'Cockpit-Token': process.env.VUE_APP_CMS_TOKEN
'Cockpit-Token': import.meta.env.VITE_CMS_TOKEN
}
})
.then((res) => {
@ -93,7 +94,7 @@ export default {
}
}, {
headers: {
'Cockpit-Token': process.env.VUE_APP_CMS_TOKEN
'Cockpit-Token': import.meta.env.VITE_CMS_TOKEN
}
})
.then((res) => {

@ -1,194 +1,310 @@
<template>
<div class="wrapping home">
<!-- begin hero section -->
<div class="container">
<main>
<div class="background-apl-text">APL</div>
<small>Welcome To</small>
<img src="https://cms.aplesports.com/storage/uploads/2020/04/23/5ea178d6570e1APL_New.png" alt="APL Esports Logo">
<br>
<big>APL Esports</big>
<p>An independent tournament organiser that combines the experience of various community figures in Asia to produce premier tournaments.</p>
<router-link :to="{ name: 'Team' }" class="btn">Our Team</router-link>
</main>
</div>
<!-- end hero section -->
<div class="wrapping home">
<!-- begin hero section -->
<div class="container">
<main>
<div class="background-apl-text">APL</div>
<small>Welcome To</small>
<img
src="https://cms.aplesports.com/storage/uploads/2020/04/23/5ea178d6570e1APL_New.png"
alt="APL Esports Logo"
/>
<br />
<big>APL Esports</big>
<p>
An independent tournament organiser that combines the
experience of various community figures in Asia to produce
premier tournaments.
</p>
<router-link :to="{ name: 'Team' }" class="btn"
>Our Team</router-link
>
</main>
</div>
<!-- end hero section -->
<!-- begin featured news -->
<section class="featured-news">
<div class="container">
<div class="title">featured news</div>
</div>
<div class="grid">
<div class="big">
<router-link v-if="this.posts[0].link" :to="'news/' + this.posts[0].link">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[0].image.path + ')' }">
<div class="overlay"></div>
<div class="ptitle">{{ this.posts[0].title }}</div>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[0].author }}
</div>
</div>
</router-link>
<router-link v-else :to="'news/' + this.posts[0].title_slug">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[0].image.path + ')' }">
<div class="overlay"></div>
<div class="ptitle">{{ this.posts[0].title }}</div>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[0].author }}
</div>
<!-- begin featured news -->
<section class="featured-news">
<div class="container">
<div class="title">featured news</div>
</div>
</router-link>
</div>
<div class="inner-grid">
<div class="small1">
<router-link v-if="this.posts[1].link" :to="'news/' + this.posts[1].link">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[1].image.path + ')' }">
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[1].title }}</p>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[1].author }}
</div>
</div>
</router-link>
<router-link v-else :to="'news/' + this.posts[1].title_slug">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[1].image.path + ')' }">
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[1].title }}</p>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[1].author }}
<div class="grid">
<div class="big">
<router-link
v-if="this.posts[0].link"
:to="'news/' + this.posts[0].link"
>
<div
class="panel"
v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[0].image.path + ')', }"
>
<div class="overlay"></div>
<div class="ptitle">{{ this.posts[0].title }}</div>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[0].author }}
</div>
</div>
</router-link>
<router-link
v-else
:to="'news/' + this.posts[0].title_slug"
>
<div
class="panel"
v-bind:style="{
'background-image':
'url(' +
imgRoot +
this.posts[0].image.path +
')',
}"
>
<div class="overlay"></div>
<div class="ptitle">{{ this.posts[0].title }}</div>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[0].author }}
</div>
</div>
</router-link>
</div>
</div>
</router-link>
</div>
<div class="small2">
<router-link v-if="this.posts[2].link" :to="'news/' + this.posts[2].link">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[2].image.path + ')' }">
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[2].title }}</p>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[2].author }}
<div class="inner-grid">
<div class="small1">
<router-link
v-if="this.posts[1].link"
:to="'news/' + this.posts[1].link"
>
<div
class="panel"
v-bind:style="{
'background-image':
'url(' +
imgRoot +
this.posts[1].image.path +
')',
}"
>
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[1].title }}</p>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[1].author }}
</div>
</div>
</router-link>
<router-link
v-else
:to="'news/' + this.posts[1].title_slug"
>
<div
class="panel"
v-bind:style="{
'background-image':
'url(' +
imgRoot +
this.posts[1].image.path +
')',
}"
>
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[1].title }}</p>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[1].author }}
</div>
</div>
</router-link>
</div>
<div class="small2">
<router-link
v-if="this.posts[2].link"
:to="'news/' + this.posts[2].link"
>
<div
class="panel"
v-bind:style="{
'background-image':
'url(' +
imgRoot +
this.posts[2].image.path +
')',
}"
>
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[2].title }}</p>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[2].author }}
</div>
</div>
</router-link>
<router-link
v-else
:to="'news/' + this.posts[2].title_slug"
>
<div
class="panel"
v-bind:style="{
'background-image':
'url(' +
imgRoot +
this.posts[2].image.path +
')',
}"
>
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[2].title }}</p>
<div class="author_name">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<path
d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"
/>
</svg>
{{ this.posts[2].author }}
</div>
</div>
</router-link>
</div>
</div>
</div>
</router-link>
<router-link v-else :to="'news/' + this.posts[2].title_slug">
<div class="panel" v-bind:style="{ 'background-image': 'url(' + imgRoot + this.posts[2].image.path + ')' }">
<div class="overlay"></div>
<p class="ptitle">{{ this.posts[2].title }}</p>
<div class="author_name">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path d="M5 5a5 5 0 0 1 10 0v2A5 5 0 0 1 5 7V5zM0 16.68A19.9 19.9 0 0 1 10 14c3.64 0 7.06.97 10 2.68V20H0v-3.32z"/>
</svg>
{{ this.posts[2].author }}
</div>
</div>
</router-link>
</div>
</div>
</div>
</section>
<!-- end featured news -->
</div>
</section>
<!-- end featured news -->
<!-- begin featured tournament -->
<section class="featured-tournament">
<div class="container">
<div class="title">featured tournament</div>
</div>
<div class="tournament">
<div class="container">
<img :src="torRoot + this.tournaments.logo.path" alt="">
<div class="text">
<div class="name">{{ this.tournaments.name }}</div>
<div class="date">Date: {{ this.tournaments.date }}</div>
<div class="time">Time: {{ this.tournaments.time }}</div>
<div class="pool">Prizepool: {{ this.tournaments.prize }}</div>
<a :href="this.tournaments.link" class="btn" target="_blank">Details</a>
</div>
</div>
</div>
</section>
<!-- end featured tournament -->
<!-- begin featured tournament -->
<section class="featured-tournament">
<div class="container">
<div class="title">featured tournament</div>
</div>
<div class="tournament">
<div class="container">
<img :src="torRoot + this.tournaments?.logo.path" alt="" />
<div class="text">
<div class="name">{{ this.tournaments?.name }}</div>
<div class="date">
Date: {{ this.tournaments?.date }}
</div>
<div class="time">
Time: {{ this.tournaments?.time }}
</div>
<div class="pool">
Prizepool: {{ this.tournaments?.prize }}
</div>
<a
:href="this.tournaments?.link"
class="btn"
target="_blank"
>Details</a
>
</div>
</div>
</div>
</section>
<!-- end featured tournament -->
<!-- begin tweets -->
<section class="tweets">
<div class="container">
<div class="title">latest tweet</div>
<twitter class="twitter">
<div slot="loading">Loading...</div>
<a class="twitter-timeline" data-width="1000" data-tweet-limit="1" data-chrome="noheader nofooter noborders transparent" data-lang="en" data-theme="dark" href="https://twitter.com/APL_Esports">@APL_Esports</a>
</twitter>
</div>
</section>
<!-- end tweets -->
</div>
<!-- begin tweets -->
<section class="tweets">
<div class="container">
<div class="title">latest tweet</div>
</div>
</section>
<!-- end tweets -->
</div>
</template>
<script>
import axios from 'axios'
import { twitter } from 'vue-twitter'
//import { twitter } from 'vue-twitter'
export default {
name: 'Home',
data() {
return {
posts: {},
tournaments: {},
imgRoot: 'https://cms.aplesports.com/storage/uploads',
torRoot: 'https://cms.aplesports.com'
}
},
created() {
axios.post("https://cms.aplesports.com/api/collections/get/News", {
"sort": {
"_created": -1
},
"limit": 3,
"filter": {
"published": true
},
"fields": {
"title": 1,
"image": 1,
"title_slug": 1,
"_by": 1,
"link": 1
}
} ,{
headers: {
'Cockpit-Token': process.env.VUE_APP_CMS_TOKEN
}
})
.then((res) => {
this.posts = res.data.entries
})
name: 'Home',
data() {
return {
posts: {},
tournaments: {},
imgRoot: 'https://cms.aplesports.com/storage/uploads',
torRoot: 'https://cms.aplesports.com',
}
},
created() {
axios
.post(
'https://cms.aplesports.com/api/collections/get/News',
{
sort: {
_created: -1,
},
limit: 3,
filter: {
published: true,
},
fields: {
title: 1,
image: 1,
title_slug: 1,
_by: 1,
link: 1,
},
},
{
headers: {
'Cockpit-Token': import.meta.env.VITE_CMS_TOKEN,
},
}
)
.then((res) => {
this.posts = res.data.entries;
})
axios.get("https://cms.aplesports.com/api/collections/get/Tournaments", {
headers: {
'Cockpit-Token': process.env.VUE_APP_CMS_TOKEN
}
})
.then((res2) => {
let tourneys = res2.data.entries
this.tournaments = tourneys[tourneys.length - 1]
})
},
components: {
twitter
}
axios
.get('https://cms.aplesports.com/api/collections/get/Tournaments', {
headers: {
'Cockpit-Token': import.meta.env.VITE_CMS_TOKEN,
},
})
.then((res2) => {
let tourneys = res2.data.entries;
this.tournaments = tourneys[tourneys.length - 1];
console.log(Promise.resolve(res2.data.entries[res2.data.entries.length - 1]));
});
},
}
</script>

@ -0,0 +1,22 @@
import { defineConfig } from 'vite';
import { createVuePlugin } from 'vite-plugin-vue2';
import path from 'path';
export default defineConfig({
plugins: [ createVuePlugin() ],
server: {
port: 3000
},
resolve: {
alias: [
{
find: '@',
replacement: path.resolve(__dirname, 'src'),
},
],
},
build: {
chunkSizeWarningLimit: 600,
cssCodeSplit: false
},
});
Loading…
Cancel
Save