makin look nice

This commit is contained in:
2025-12-11 01:21:14 +00:00
parent 5e77b480f7
commit e301e0d7c1
11 changed files with 364 additions and 372 deletions

View File

@@ -1,15 +1,6 @@
<template>
<nav class="no-print flex-row">
<RouterLink to="/"><p>HOME</p></RouterLink>
<nav class="flex-row">
<RouterLink class="bdr-2" to="/"><h1>HOME</h1></RouterLink>
<!-- <RouterLink to="/cv"><h1>CV</h1></RouterLink> -->
</nav>
</template>
<style scoped>
nav {
height: 10vh;
}
h1 {
height: 100%;
}
</style>

View File

@@ -0,0 +1,38 @@
<template>
<div class="halftone" />
</template>
<style scoped>
div {
width: 100vw;
height: 100vh;
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
}
.halftone {
--dot_size: 1px;
--bg_size: 5px;
--bg_pos: calc(var(--bg_size) / 2);
--blur: 0%;
--dot_color: #044;
--bg_color: #114;
background-color: var(--bg_color);
background-image: radial-gradient(
circle at center,
var(--dot_color) var(--dot_size),
transparent var(--blur)
);
background-size: var(--bg_size) var(--bg_size);
background-position: 0 0;
mask-image: linear-gradient(
30deg,
rgba(1, 1, 1, 1) 0%,
rgba(1, 1, 1, 0.85) 100%
);
}
</style>

View File

@@ -1,6 +1,21 @@
<template>
<div>
<img src="/img/epic.jpeg" />
<div class="flex-row">
<table>
<tr>
<td>Color</td>
<td>Aqua</td>
</tr>
<tr>
<td>Pet</td>
<td>Cat</td>
</tr>
</table>
<table>
<tr>
<td>Color</td>
<td>Blue</td>
</tr>
</table>
</div>
</template>

View File

@@ -57,6 +57,9 @@ onMounted(() => {
<button v-if="!leftCap" @click="prevPost">Prev</button>
<button v-if="!rightCap" @click="nextPost">Next</button>
</div>
<div v-else>
<h2>Can't fetch from the db yo</h2>
</div>
</template>
<style scoped>

View File

@@ -1,34 +1,11 @@
<template>
<div class="fill flex-row">
<img src="/img/epic.jpeg" class="img" />
<div class="fill flex-col">
<div class="div">
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<h1>Welcome</h1>
<p>This is my website, currently under construction.</p>
<p>THANKS FOR VISITING ^_^</p>
<p>THANKS FOR VISITING ^_^</p>
<p>THANKS FOR VISITING ^_^</p>
</div>
</div>
</template>
<style scoped>
img {
width: 100%;
height: 100%;
}
.img {
flex: 3;
}
.div {
flex: 7;
}
</style>

View File

@@ -1,22 +1,10 @@
<template>
<div>
<RouterLink to="/cv">
<div class="flex-col">
<RouterLink class="bdr-2" to="/cv">
<h1>CV</h1>
</RouterLink>
<RouterLink to="/admin">
<RouterLink class="bdr-2" to="/admin">
<h1>ADMIN</h1>
</RouterLink>
</div>
</template>
<style scoped>
div {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 2px;
}
p {
background: var(--bg_primary);
}
</style>