118 lines
2.1 KiB
Vue
118 lines
2.1 KiB
Vue
<template>
|
|
<v-app>
|
|
<v-main class="bg-main">
|
|
<div class="d-block w-100 text-right pa-3">
|
|
<span class="img-logo">
|
|
<router-link to="/">
|
|
<span class="float-left">
|
|
<v-img
|
|
:aspect-ratio="1"
|
|
src="./assets/logo.png"
|
|
width="80"
|
|
></v-img></span></router-link
|
|
></span>
|
|
<span
|
|
><v-btn
|
|
icon="mdi-home-variant-outline"
|
|
variant="text"
|
|
href="/"
|
|
></v-btn
|
|
><v-btn icon="mdi-account-outline" variant="text"></v-btn>
|
|
<v-btn variant="text"> Sign In </v-btn>
|
|
<v-btn elevated color="#F4C03F"> Get Started </v-btn></span
|
|
>
|
|
</div>
|
|
<router-view />
|
|
</v-main>
|
|
</v-app>
|
|
</template>
|
|
|
|
<script>
|
|
import { client } from "./utils/trpc.ts";
|
|
console.log(client);
|
|
// import MainVote from "./components/MainVote.vue";
|
|
|
|
export default {
|
|
name: "App",
|
|
|
|
components: {
|
|
// MainVote,
|
|
},
|
|
|
|
data: () => ({
|
|
//
|
|
}),
|
|
};
|
|
</script>
|
|
<style>
|
|
.img-logo {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
* {
|
|
font-family: "IBM Plex Sans Thai", sans-serif;
|
|
}
|
|
.text-title {
|
|
font-size: 40px;
|
|
font-weight: 500;
|
|
/* font: normal normal medium 47px/77px IBM Plex Sans Thai; */
|
|
}
|
|
.text-normal {
|
|
font-size: 30px;
|
|
}
|
|
.text-subtitle {
|
|
font-size: 25px;
|
|
font-weight: 600;
|
|
}
|
|
.text-sub {
|
|
font-size: 24px;
|
|
font-weight: 400;
|
|
}
|
|
.text-sub2 {
|
|
font-size: 20px;
|
|
/* font-weight: 500; */
|
|
}
|
|
.text-sub3 {
|
|
font-size: 18px;
|
|
/* font-weight: 500; */
|
|
}
|
|
.text-small {
|
|
font-size: 16px;
|
|
}
|
|
.txt-black {
|
|
color: #37332f;
|
|
/* color: black; */
|
|
}
|
|
|
|
@media only screen and (min-width: 0px) and (max-width: 700px) {
|
|
.img-logo {
|
|
display: none;
|
|
}
|
|
.text-title {
|
|
font-size: 28px;
|
|
font-weight: 500;
|
|
/* font: normal normal medium 47px/77px IBM Plex Sans Thai; */
|
|
}
|
|
.text-normal {
|
|
font-size: 25px;
|
|
}
|
|
.text-subtitle {
|
|
font-size: 22px;
|
|
font-weight: 600;
|
|
}
|
|
.text-sub {
|
|
font-size: 23px;
|
|
font-weight: 400;
|
|
}
|
|
.text-sub2 {
|
|
font-size: 20px;
|
|
/* font-weight: 500; */
|
|
}
|
|
.text-sub3 {
|
|
font-size: 18px;
|
|
/* font-weight: 500; */
|
|
}
|
|
}
|
|
</style>
|