scuffed birthday thing

This commit is contained in:
amy 2024-08-07 09:01:25 +03:30
parent 50ad69c3cb
commit 8037596a66
5 changed files with 74 additions and 23 deletions

BIN
public/birthday.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

View file

@ -37,6 +37,7 @@
margin: 1em; margin: 1em;
} }
.musicdiv { .musicdiv {
background-color: rgba(0, 0, 0, 0.731); background-color: rgba(0, 0, 0, 0.731);
position: fixed; position: fixed;
@ -111,15 +112,12 @@
} }
.header { .header {
margin-top: 2em; margin-top: 6em;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.header img:hover {
animation: bigsmall .5s infinite;
}
.cardchild h1 { .cardchild h1 {
font-size: 3em; font-size: 3em;
@ -305,7 +303,6 @@
border-radius: 25%; border-radius: 25%;
margin-right: 1em; margin-right: 1em;
vertical-align: middle; vertical-align: middle;
max-width: 10em;
animation: slide-left 1.5s; animation: slide-left 1.5s;
} }

View file

@ -1,13 +1,15 @@
import './App.css' import './App.css'
import HoverComponent from './components/name.tsx'
import AdvancedBr from './components/comps.tsx' import AdvancedBr from './components/comps.tsx'
import { createSignal, onMount } from 'solid-js'; import { createSignal, onMount } from 'solid-js';
import Reviews from './components/api.tsx'; import Reviews from './components/api.tsx';
import Music, { MusicEntry } from './components/music.tsx'; import Music, { MusicEntry } from './components/music.tsx';
import {Bdpfp, Normalpfp} from './components/pfp.tsx';
export const [shouldpopup, setpopup] = createSignal(false) export const [shouldpopup, setpopup] = createSignal(false)
export const [ishover, setishover] = createSignal(false) export const [ishover, setishover] = createSignal(false)
function getRandomVivsieWord(){ const isitmybd = () => new Date().toISOString().slice(5, 10) === '08-22';
function getRandomVivsieWord() {
const words = [ const words = [
"fuck", "fuck",
"shit", "shit",
@ -31,18 +33,7 @@ function vivsiepop() {
} }
function App() { function App() {
function remov() {
for (let i = 0; i < document.styleSheets.length; i++) {
let styleSheet = document.styleSheets[i];
let rules = styleSheet.cssRules || styleSheet.rules;
for (let j = 0; j < rules.length; j++) {
let rule = rules[j];
if (rule.type === CSSRule.KEYFRAMES_RULE && ((rule as CSSKeyframesRule).name === "slide-left")) {
styleSheet.deleteRule(j);
}
}
}
}
const [musicList, setMusicList] = createSignal<string[]>([]); const [musicList, setMusicList] = createSignal<string[]>([]);
const [isLoading, setIsLoading] = createSignal(true); const [isLoading, setIsLoading] = createSignal(true);
const [isAnimating, setIsAnimating] = createSignal(false); const [isAnimating, setIsAnimating] = createSignal(false);
@ -67,11 +58,13 @@ function App() {
}} classList={{ 'gitgayimg': true, 'animate': isAnimating(), 'gaybackground': isAnimating() }} src="https://git.gay/assets/img/logo.png" alt="LMAO IMAGINE BEING BLIND" /> as HTMLImageElement }} classList={{ 'gitgayimg': true, 'animate': isAnimating(), 'gaybackground': isAnimating() }} src="https://git.gay/assets/img/logo.png" alt="LMAO IMAGINE BEING BLIND" /> as HTMLImageElement
return ( return (
<> <>
<div class='header'> {/* <div onmouseenter={remov} class='header'>
<img onmouseenter={remov} src="https://dp.nea.moe/avatar/712639419785412668.png" class="logo-pfp" alt="LMAO IMAGINE BEING BLIND" /> <div>
<HoverComponent /> <Normalpfp />
</div> </div>
<HoverComponent />
</div> */}
{isitmybd() ? <Bdpfp /> : <Normalpfp/>}
<p style={{ display: "none" }}>AdvancedBr my beloved</p> <p style={{ display: "none" }}>AdvancedBr my beloved</p>
<AdvancedBr count={6} /> <AdvancedBr count={6} />

27
src/components/pfp.css Normal file
View file

@ -0,0 +1,27 @@
.birthdayparent {
position: relative;
}
.header .bd {
flex-direction: column;
margin-left: 10em;
}
.birthday {
position: absolute;
top: 0;
left: 0;
margin-left: -12em;
}
.birthdaypfp {
z-index: 1;
max-width: 10em;
}
.birthdayhat {
z-index: 2;
width: 14em;
top: -3em;
left: -1em;
}

34
src/components/pfp.tsx Normal file
View file

@ -0,0 +1,34 @@
import HoverComponent from "./name"
import "./pfp.css"
function remov() {
for (let i = 0; i < document.styleSheets.length; i++) {
let styleSheet = document.styleSheets[i];
let rules = styleSheet.cssRules || styleSheet.rules;
for (let j = 0; j < rules.length; j++) {
let rule = rules[j];
if (rule.type === CSSRule.KEYFRAMES_RULE && ((rule as CSSKeyframesRule).name === "slide-left")) {
styleSheet.deleteRule(j);
}
}
}
}
export function Bdpfp() {
return <div onmouseenter={remov} class='header bd' >
<div class="birthdayparent">
<img class='birthdaypfp birthday' src="https://dp.nea.moe/avatar/712639419785412668.png" alt="LMAO IMAGINE BEING BLIND" />
<img class='birthdayhat birthday' src="./birthday.png" alt="" />
<HoverComponent />
</div>
</div>
}
export function Normalpfp() {
return <div class="birthdayparent header normal">
<img src="https://dp.nea.moe/avatar/712639419785412668.png" alt="LMAO IMAGINE BEING BLIND" />
<HoverComponent />
</div>
}