ngn/website
1
0
Fork 0
Code Issues 1 Pull Requests 5 Actions Packages Activity

first commit

Browse Source
This commit is contained in:
ngn
2023-04-16 20:12:24 +03:00
commit 15d5df3227
27 changed files with 27478 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
components/Button.vue Normal file
View File

@@ -0,0 +1,29 @@
<template>
<button @click="click"><slot></slot></button>
</template>
<script>
export default {
props: ["click"]
}
</script>
<style scoped>
button {
text-align: center;
width: 540px;
font-size: 25px;
padding: 20px;
border-radius: 20px;
background: var(--dark-two);
border: none;
color: white;
outline: none;
cursor: pointer;
transition: .4s;
}
button:hover {
box-shadow: var(--def-shadow);
}
</style>

56
components/Card.vue Normal file
View File

@@ -0,0 +1,56 @@
<template>
<div>
<slot></slot>
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
div {
box-shadow: var(--def-shadow);
background: var(--dark-two);
width: 100%;
height: auto;
padding: 50px;
color: white;
}
h1 {
text-shadow: 3px 4px 7px rgba(81, 67, 21, 0.8);
font-size: 50px;
margin-bottom: 30px;
text-decoration: underline;
}
i {
animation-name: colorAnimation;
animation-duration: 10s;
animation-iteration-count: infinite;
}
a:hover {
font-weight: 900;
}
i {
font-size: 30px;
margin-top: 3px;
}
h2 {
font-size: 40px;
line-height: 60px;
}
a {
font-size: 40px;
color: white;
line-height: 60px;
text-decoration: none;
}
</style>

31
components/Header.vue Normal file
View File

@@ -0,0 +1,31 @@
<template>
<div class="header">
<h1>
<slot></slot>
</h1>
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
div {
background: linear-gradient(rgba(3, 3, 3, 0.706), rgba(22, 22, 22, 0.808)), url("https://www.sketchappsources.com/resources/source-image/tv-glitch-sureshmurali29.png");
width: 100%;
height: 100%;
}
h1 {
font-weight: 900;
font-size: 7.5vw;
padding: 150px;
text-align: center;
color: white;
text-shadow: 3px 4px 7px rgba(81, 67, 21, 0.8);
text-size-adjust: 80%;
}
</style>

27
components/Input.vue Normal file
View File

@@ -0,0 +1,27 @@
<template>
<input v-on:keyup="keyup" :placeholder="placeholder" :type="type">
</template>
<script>
export default {
props:["keyup", "placeholder", "type"]
}
</script>
<style scoped>
input {
width: 500px;
font-size: 25px;
padding: 20px;
border-radius: 20px;
background: var(--dark-two);
border: none;
color: white;
outline: none;
transition: .4s;
}
input:focus {
box-shadow: var(--def-shadow);
}
</style>

41
components/Logout.vue Normal file
View File

@@ -0,0 +1,41 @@
<template>
<div>
<h1>Currently logged in</h1>
<Button :click="click">Logout</Button>
</div>
</template>
<script>
import axios from 'axios';
import Button from './Button.vue';
export default {
methods: {
async click(e) {
await axios.get(`/api/logout?token=${localStorage.getItem("token")}`)
localStorage.clear()
location.reload()
}
},
}
</script>
<style scoped>
h1{
color: var(--white);
font-size: 50px;
margin-bottom: 20px;
text-align: center;
}
div{
background-color: var(--dark-three);
padding: 50px;
margin-top: 50px;
display: flex;
flex-direction: column;
gap: 20px;
align-items: center;
justify-content: center;
}
</style>

53
components/Navbar.vue Normal file
View File

@@ -0,0 +1,53 @@
<template>
<nav>
<div>
<h3>[ngn]</h3>
</div>
<div>
<NavbarLink :out="false" url="/">Home</NavbarLink>
<NavbarLink :out="false" url="/projects">Projects</NavbarLink>
<NavbarLink :out="false" url="/resources">Resources</NavbarLink>
<!--<NavbarLink :out="false" url="/stats">Stats</NavbarLink>-->
<NavbarLink :out="true" url="http://github.com/ngn13/my-website">Source</NavbarLink>
</div>
</nav>
</template>
<script>
import NavbarLink from "./NavbarLink.vue";
export default {}
</script>
<style scoped>
nav {
background: var(--dark-two);
padding: 25px 35px 30px 35px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
border-bottom: solid 3px black;
animation-name: borderAnimation;
animation-duration: 10s;
animation-iteration-count: infinite;
box-shadow: var(--def-shadow);
}
div {
display: flex;
overflow: hidden;
align-items: center;
justify-content: center;
gap: 5px;
}
h3 {
font-weight: 900;
font-size: 30px;
color: red;
animation-name: colorAnimation;
animation-iteration-count: infinite;
animation-duration: 10s;
}
</style>

60
components/NavbarLink.vue Normal file
View File

@@ -0,0 +1,60 @@
<template>
<div>
<nuxt-link v-if="!out" :class="cname" id="link" :to="url">
<slot></slot>
</nuxt-link>
<a v-if="out" :class="cname" id="link" :href="url">
<slot></slot>
</a>
</div>
</template>
<script>
export default {
props: ["url", "out"],
data() {
return {
cname: "notcurrent"
}
},
mounted(){
let url = window.location.pathname
if(url===this.url){
this.cname = "current"
}
}
}
</script>
<style scoped>
.notcurrent {
margin-left: 20px;
font-weight: 700;
font-size: 25px;
text-decoration: none;
color: white;
cursor: pointer;
}
.notcurrent:hover {
text-decoration: underline;
animation-name: underlineAnimation;
animation-duration: 5s;
animation-iteration-count: infinite;
text-shadow: 3px 4px 7px rgba(81, 67, 21, 0.8);
}
.current{
margin-left: 20px;
font-weight: 700;
font-size: 25px;
text-decoration: none;
color: white;
cursor: pointer;
text-decoration: underline;
animation-name: underlineAnimation;
animation-duration: 10s;
animation-iteration-count: infinite;
text-shadow: 3px 4px 7px rgba(81, 67, 21, 0.8);
}
</style>

51
components/NewProject.vue Normal file
View File

@@ -0,0 +1,51 @@
<template>
<div>
<h1>Add Project</h1>
<Input :keyup="function() { }" id="name" placeholder="Project Name" type="text"/>
<Input :keyup="function() { }" id="desc" placeholder="Project Desc" type="text"/>
<Input :keyup="function() { }" id="url" placeholder="Project URL" type="text"/>
<Button :click="click">Post</Button>
</div>
</template>
<script>
import axios from 'axios';
import Input from './Input.vue';
import Button from './Button.vue';
export default {
methods: {
async click(e) {
const name = document.getElementById("name").value
const desc = document.getElementById("desc").value
const url = document.getElementById("url").value
const token = localStorage.getItem("token")
const res = await axios.get(`/api/add_project?token=${token}&name=${name}&desc=${desc}&url=${url}`)
if(res.data["error"]!==0)
return alert("Error!")
alert("Project added!")
location.reload()
}
},
}
</script>
<style scoped>
h1{
color: var(--white);
font-size: 50px;
margin-bottom: 20px;
text-align: center;
}
div{
background-color: var(--dark-three);
padding: 50px;
margin-top: 50px;
display: flex;
flex-direction: column;
gap: 20px;
align-items: center;
justify-content: center;
}
</style>

51
components/NewResource.vue Normal file
View File

@@ -0,0 +1,51 @@
<template>
<div>
<h1>Add Resource</h1>
<Input :keyup="function(){}" id="name" placeholder="Resource Name" type="text"/>
<Input :keyup="function(){}" id="tags" placeholder="Resource Tags (comma seperated)" type="text"/>
<Input :keyup="function(){}" id="url" placeholder="Resource URL" type="text"/>
<Button :click="click">Post</Button>
</div>
</template>
<script>
import Input from './Input.vue';
import Button from './Button.vue';
import axios from 'axios';
export default {
methods: {
async click(e) {
const name = document.getElementById("name").value
const tags = document.getElementById("tags").value
const url = document.getElementById("url").value
const token = localStorage.getItem("token")
const res = await axios.get(`/api/add_resource?token=${token}&name=${name}&tags=${tags}&url=${url}`)
if(res.data["error"]!==0)
return alert("Error!")
alert("Resource added!")
location.reload()
}
},
}
</script>
<style scoped>
h1{
color: var(--white);
font-size: 50px;
margin-bottom: 20px;
text-align: center;
}
div{
background-color: var(--dark-three);
padding: 50px;
margin-top: 50px;
display: flex;
flex-direction: column;
gap: 20px;
align-items: center;
justify-content: center;
}
</style>

63
components/Project.vue Normal file
View File

@@ -0,0 +1,63 @@
<template>
<main @click="redirect()">
<i class='bx bx-code-alt'></i>
<div>
<h1>{{ name }}</h1>
<h2>{{ desc }}</h2>
</div>
</main>
</template>
<script>
export default {
props: ["name", "desc", "url"],
methods: {
redirect(e) {
location.href = this.url
}
},
}
</script>
<style scoped>
main {
color: var(--white);
background: var(--dark-two);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 20px;
padding: 40px;
cursor: pointer;
transition: .4s;
height: 13%;
width: 27%;
}
main:hover{
box-shadow: var(--def-shadow);
}
i{
font-size: 65px;
animation-name: colorAnimation;
animation-duration: 10s;
animation-iteration-count: infinite;
}
h1{
font-size: 35px;
margin-bottom: 10px;
}
h2{
font-size: 25px;
}
@media only screen and (max-width: 1121px) {
main{
width: auto;
}
}
</style>

28
components/ProjectList.vue Normal file
View File

@@ -0,0 +1,28 @@
<template>
<div>
<slot></slot>
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
div{
display: flex;
flex-direction: row;
padding: 20px;
align-items: center;
justify-content: center;
gap: 30px;
}
@media only screen and (max-width: 1121px) {
div {
flex-direction: column;
}
}
</style>

66
components/Resource.vue Normal file
View File

@@ -0,0 +1,66 @@
<template>
<main @click="redirect()" class="mn">
<div class="resource">
<h1>{{ name }}</h1>
<div class="tags">
<Tag v-for="tag in tags" :key="tag">{{ tag }}</Tag>
</div>
</div>
<i class='bx bx-right-arrow-alt' ></i>
</main>
</template>
<script>
import Tag from './Tag.vue';
export default {
props: ["tags", "name", "url"],
methods: {
redirect(e){
location.href = this.url
}
}
}
</script>
<style scoped>
main{
background: var(--dark-two);
padding: 30px 40px 30px 40px;
display: flex;
flex-direction: row;
color: var(--white);
justify-content: space-between;
align-items: center;
transition: .4s;
width: 80%;
cursor: pointer;
}
main:hover{
box-shadow: var(--def-shadow);
}
.mn:hover i{
color: white;
}
.resource{
display: flex;
flex-direction: column;
gap: 10px;
}
.tags{
display: flex;
flex-direction: row;
gap: 10px;
}
i{
font-size: 70px;
cursor: pointer;
color: var(--dark-two);
transition: .4s;
}
</style>

24
components/Tag.vue Normal file
View File

@@ -0,0 +1,24 @@
<template>
<p>
#<slot></slot>
</p>
</template>
<script>
export default {
}
</script>
<style scoped>
p{
background: var(--dark-three);
color: white;
text-shadow: 1px 1px 2px white;
padding: 5px 10px 5px 10px;
font-size: 25px;
border-radius: 7px;
margin-top: 10px;
transition: .4s;
}
</style>