idk what I changed
This commit is contained in:
@@ -279,8 +279,8 @@ td {
|
||||
background-position: 0 0;
|
||||
|
||||
mask-image: linear-gradient(
|
||||
30deg,
|
||||
-180deg,
|
||||
rgba(1, 1, 1, 1) 0%,
|
||||
rgba(1, 1, 1, 0.9) 100%
|
||||
rgba(1, 1, 1, 0.92) 100%
|
||||
);
|
||||
}
|
||||
|
||||
42
nginx/vue/src/views/home/BadApple.vue
Normal file
42
nginx/vue/src/views/home/BadApple.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<script setup lang="ts">
|
||||
import { useTemplateRef, ref, onMounted, onUnmounted } from 'vue';
|
||||
|
||||
const display = useTemplateRef('display')
|
||||
const displayText = ref("");
|
||||
|
||||
const charHeight: number = 14;
|
||||
const charWidth: number = charHeight * 0.6;
|
||||
let n: number;
|
||||
let m: number;
|
||||
|
||||
function setup() {
|
||||
display.value.style.fontSize = `${charHeight}px`;
|
||||
display.value.style.lineHeight = `${charHeight}px`;
|
||||
fillDisplay()
|
||||
}
|
||||
|
||||
function fillDisplay() {
|
||||
// M rows N columns
|
||||
m = Math.floor(display.value.offsetHeight / charHeight);
|
||||
n = Math.floor(display.value.offsetWidth / charWidth);
|
||||
const row = ' '.repeat(n);
|
||||
displayText.value = (row + '\n').repeat(m - 1) + row
|
||||
}
|
||||
|
||||
function close() {
|
||||
displayText.value = ""
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
setup()
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
close()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<pre class="overflow-scroll w-full h-full bg-black text-white m-0 p-0" id="container" ref="display">{{ displayText
|
||||
}}</pre>
|
||||
</template>
|
||||
@@ -7,6 +7,7 @@ import MusicPlayer from "@/components/util/MusicPlayer.vue";
|
||||
|
||||
import Intro from "./Intro.vue";
|
||||
import Intro2 from "./Intro2.vue";
|
||||
import BadApple from "./BadApple.vue";
|
||||
import Stamps from "./Stamps.vue";
|
||||
import Listening from "./Listening.vue";
|
||||
import Links from "./Links.vue";
|
||||
@@ -22,7 +23,8 @@ import Consumption from "./Consumption.vue";
|
||||
<div class="h-fit flex flex-row">
|
||||
<div class="a4page-portrait homeGrid relative bdr-1">
|
||||
<!-- <Intro class="intro" /> -->
|
||||
<Intro2 class="intro" />
|
||||
<!-- <Intro2 class="intro" /> -->
|
||||
<BadApple class="intro" />
|
||||
<Listening class="listening" />
|
||||
<Stamps class="stamps" />
|
||||
<Feed class="feed" />
|
||||
|
||||
@@ -6,7 +6,6 @@ import Paragraph from "@/components/text/Paragraph.vue";
|
||||
<template>
|
||||
<div class="flex-1 border-box flex flex-col p-1 text-left items-start justify-start">
|
||||
<Header>Yo</Header>
|
||||
|
||||
<!-- <Header>Intro</Header> -->
|
||||
<!-- <Paragraph> -->
|
||||
<!-- Hi, I'm Adam, thank you for visiting my website. -->
|
||||
|
||||
@@ -10,19 +10,20 @@ interface Item {
|
||||
content: string
|
||||
}
|
||||
|
||||
const container = ref < HTMLDivElement | null > (null)
|
||||
const itemEls = ref < HTMLDivElement[] > ([])
|
||||
const container = ref<HTMLDivElement | null>(null)
|
||||
const itemEls = ref<HTMLDivElement[]>([])
|
||||
|
||||
const phrases = [
|
||||
'Welcome to my website',
|
||||
'Thank you for visiting',
|
||||
"I'd love to know your recommendations",
|
||||
"Message me on discord or steam",
|
||||
"I like anime, all kinds of music and sci fic",
|
||||
"Try to stay away from instagram",
|
||||
"Always watching too much youtube"
|
||||
"Always watching too much youtube",
|
||||
]
|
||||
|
||||
const items = ref < Item[] > (
|
||||
const items = ref<Item[]>(
|
||||
phrases.map((text, i) => ({
|
||||
x: i * 20,
|
||||
y: i * 20,
|
||||
@@ -73,9 +74,9 @@ onUnmounted(() => {
|
||||
<div v-for="(item, i) in items" :key="i" ref="itemEls" class=" absolute w-fit h-fit" :style="{
|
||||
transform: `translate(${item.x}px, ${item.y}px)`
|
||||
}">
|
||||
<p>
|
||||
<h1>
|
||||
{{ item.content }}
|
||||
</p>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
<script setup>
|
||||
import RouterTable from "@/components/util/RouterTable.vue";
|
||||
import LinkTable from "@/components/util/LinkTable.vue";
|
||||
import Markdown from "@/components/util/Markdown.vue";
|
||||
|
||||
const site_links = [
|
||||
{ name: "CV", link: "/cv" },
|
||||
|
||||
Reference in New Issue
Block a user