feat: remove unused index file
This commit is contained in:
parent
64c5f99963
commit
b900655896
1 changed files with 0 additions and 268 deletions
268
pages/index.vue
268
pages/index.vue
|
@ -1,268 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="client-root">
|
|
||||||
<div id="home" class=".homebar-item">
|
|
||||||
<NuxtLink href="/web">
|
|
||||||
<img src="~/assets/img/house.svg" alt="Home">
|
|
||||||
</NuxtLink>
|
|
||||||
</div>
|
|
||||||
<div id="current-channel" class=".homebar-item">
|
|
||||||
main bar
|
|
||||||
</div>
|
|
||||||
<div id="test" class=".homebar-item">test</div>
|
|
||||||
<div id="test2" class=".homebar-item">test2</div>
|
|
||||||
<div id="servers-list">
|
|
||||||
<NuxtLink v-for="server of servers" :href="'web' + server.url">
|
|
||||||
<img src="~/assets/img/server.svg" :alt="server.name">
|
|
||||||
</NuxtLink>
|
|
||||||
</div>
|
|
||||||
<div id="channels-list" class="main-grid-row">
|
|
||||||
<Channel v-for="channel of channels" :name="channel.name" :href="`${useRoute().path}/${channel.id}`" />
|
|
||||||
</div>
|
|
||||||
<div id="message-history" class="main-grid-row">
|
|
||||||
<div id="messages">
|
|
||||||
<Message v-for="message of messages" :img="pfp" :username="message.author.username" :text="message.text"
|
|
||||||
:timestamp="message.timestamp" format="12" />
|
|
||||||
</div>
|
|
||||||
<div id="message-box" class="main-grid-row">
|
|
||||||
<form @submit="sendMessage">
|
|
||||||
<input type="text" name="message-box-input" id="message-box-input">
|
|
||||||
<button type="submit">
|
|
||||||
<img :src="checkmark" alt="Send" width="20">
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="members-list">
|
|
||||||
<div class="member-item" v-for="member of members">
|
|
||||||
<img src="~/assets/img/tiger-head.svg" :alt="member.displayName" width="30dvw">
|
|
||||||
<span class="member-display-name">{{ member.displayName }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts" setup>
|
|
||||||
|
|
||||||
import pfp from "~/assets/img/tiger-head.svg";
|
|
||||||
import checkmark from "~/assets/img/check-mark.png";
|
|
||||||
|
|
||||||
const servers = [
|
|
||||||
{
|
|
||||||
name: "Test",
|
|
||||||
url: "/servers/284103257435"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Test",
|
|
||||||
url: "/servers/284103257435"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Test",
|
|
||||||
url: "/servers/284103257435"
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const members = [
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3287484395",
|
|
||||||
displayName: "SauceyRed"
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const messages = [
|
|
||||||
{
|
|
||||||
author: {
|
|
||||||
id: "3287484395",
|
|
||||||
username: "SauceyRed",
|
|
||||||
avatar: "~/assets/img/tiger-head.svg"
|
|
||||||
},
|
|
||||||
text: "hello gamers!",
|
|
||||||
timestamp: 1745948498000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
author: {
|
|
||||||
id: "3287484395",
|
|
||||||
username: "SauceyRed",
|
|
||||||
avatar: "~/assets/img/tiger-head.svg"
|
|
||||||
},
|
|
||||||
text: "yo what's up!",
|
|
||||||
timestamp: 1745948498000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
author: {
|
|
||||||
id: "3287484395",
|
|
||||||
username: "SauceyRed",
|
|
||||||
avatar: "~/assets/img/tiger-head.svg"
|
|
||||||
},
|
|
||||||
text: "how are you guys?",
|
|
||||||
timestamp: 1745948498000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
author: {
|
|
||||||
id: "3287484395",
|
|
||||||
username: "SauceyRed",
|
|
||||||
avatar: "~/assets/img/tiger-head.svg"
|
|
||||||
},
|
|
||||||
text: "im doing well",
|
|
||||||
timestamp: 1745948498000
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
const channels = [
|
|
||||||
{
|
|
||||||
name: "#super-cool-channel",
|
|
||||||
id: "8gh9548rg44"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "#super-lame-channel",
|
|
||||||
id: "hgff45387hy"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "#secret-channel",
|
|
||||||
id: "g8f734h87gt"
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
function sendMessage(e: Event) {
|
|
||||||
e.preventDefault();
|
|
||||||
const textInput = document.getElementById("message-box-input") as HTMLInputElement;
|
|
||||||
const text = textInput.value;
|
|
||||||
console.log("MESSAGE SENT!!!");
|
|
||||||
console.log("text:", text);
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
#client-root {
|
|
||||||
/* border: 1px solid white; */
|
|
||||||
height: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 1fr 4fr 18fr 4fr;
|
|
||||||
grid-template-rows: 8dvh auto;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#client-root>div:nth-child(-n+4) {
|
|
||||||
border-bottom: 1px solid rgb(70, 70, 70);
|
|
||||||
}
|
|
||||||
|
|
||||||
#__nuxt {
|
|
||||||
display: flex;
|
|
||||||
flex-flow: column;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.grid-column {
|
|
||||||
padding-top: 1dvh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#home {
|
|
||||||
grid-column: 1;
|
|
||||||
grid-row: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#current-info {
|
|
||||||
grid-column: 2;
|
|
||||||
grid-row: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#test {
|
|
||||||
grid-column: 3;
|
|
||||||
grid-row: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#utilities {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 3dvh;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#left-sidebar-container,
|
|
||||||
#right-sidebar-container {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.member-item {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bottom-border {
|
|
||||||
border-bottom: 1px solid rgb(70, 70, 70);
|
|
||||||
}
|
|
||||||
|
|
||||||
.left-border {
|
|
||||||
border-left: 1px solid rgb(70, 70, 70);
|
|
||||||
}
|
|
||||||
|
|
||||||
.right-border {
|
|
||||||
border-right: 1px solid rgb(70, 70, 70);
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-content {
|
|
||||||
display: grid;
|
|
||||||
grid-template-rows: 1fr 15fr 30fr 2fr;
|
|
||||||
text-align: center;
|
|
||||||
margin-left: 1dvw;
|
|
||||||
}
|
|
||||||
|
|
||||||
#message-box {
|
|
||||||
border: 1px solid rgb(70, 70, 70);
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 1dvh;
|
|
||||||
height: 5%;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#message-box-input {
|
|
||||||
width: 80%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#servers-list,
|
|
||||||
#channels-list,
|
|
||||||
#message-history,
|
|
||||||
#members-list {
|
|
||||||
margin-top: 3dvh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#message-history {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Add table
Add a link
Reference in a new issue