88x31

src/App.tsx

@@ -1,5 +1,5 @@
 import './App.css'
-import {AdvancedBr, SingularOomfie} from './components/comps.tsx'
+import {AdvancedBr, Singular88, SingularOomfie} from './components/comps.tsx'
 import {createSignal, onMount} from 'solid-js';
 import Reviews from './components/api.tsx';
 import Music, {MusicEntry} from './components/music.tsx';
@@ -7,6 +7,7 @@ import {Bdpfp, Normalpfp} from './components/pfp.tsx';
 import {InfoCard} from './components/middlecard.tsx';
 
 export const [shouldpopup, setpopup] = createSignal(false)
+export const [shouldpopup88, setpopup88] = createSignal(false)
 export const [shouldpopupEasterEgg, setpopupEasterEgg] = createSignal(false)
 export const [ishover, setishover] = createSignal(false)
 
@@ -136,8 +137,8 @@ function App() {
                 </div>
             </div>
             <AdvancedBr count={2}/>
-            <div class='easteregg' style={{opacity: isAnimating() || animatedwoem() ? "0%" : "100%"}}>
-                <div class="musicbutton" onclick={() => {
+            <div className='easteregg' style={{opacity: isAnimating() || animatedwoem() ? "0%" : "100%"}}>
+                <div className="musicbutton" onClick={() => {
                     setpopup(!shouldpopup())
                 }}>
                     <p>typa shit ive been on</p><img style={{
@@ -145,8 +146,8 @@ function App() {
                     "max-width": "1.5em"
                 }} src="./fireemoji.png"/>
                 </div>
-                <div class="musicbutton" >
-                    <div class="oomfies" onClick={() => {
+                <div className="musicbutton">
+                    <div className="oomfies" onClick={() => {
                         setoomfies(
                             <>
                                 <SingularOomfie name='ashley' discordid='836177139798638592'
@@ -172,10 +173,15 @@ function App() {
                         )
                     }}> {oomfies()}</div>
                 </div>
-                <div class="musicbutton" onclick={vivsiepop}>
+                <div class="musicbutton" onClick={vivsiepop}>
                     <p>echo if it was written by vivsiepop</p>
                 </div>
-                <div class="musicbutton" onclick={() => {
+                <div class="musicbutton" onClick={() => {
+                    setpopup88(true)
+                }}>
+                    <p>88x31's</p>
+                </div>
+                <div class="musicbutton" onClick={() => {
                     if (explodcount > 5) {
                         document.body.innerHTML = ""
                         setTimeout(() => {
@@ -225,6 +231,28 @@ function App() {
                     </div>
                 </div>
             </Music>
+            <Music shouldpopup={shouldpopup88}>
+                <div class='musicdiv'>
+                    <div class='innermusic'>
+                        <div class="music-close-button-div">
+                            <button class="close-button" onClick={() => {
+                                setpopup88(false)
+                            }}>X
+                            </button>
+                        </div>
+                        <div style={{}}>
+                            <img src="https://exhq.dev/88x31.png" alt=""/>
+                            <br/>
+                            <span>feel free to link mine, <code>https://exhq.dev/88x31.png</code></span>
+                            <div style={{"background-color": "gray", height: "1px"}}/>
+                            <div>
+                                <Singular88 name="nax" url="https://nax.dev" src="https://nax.dev/88x31.gif"/>
+                                <Singular88 name="sophari" url="https://sophari.org" src="https://sophari.org/img/sophari.gif"/>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </Music>
             <div class='footer'> made with ♥ by amy. <a href="https://git.lgbt/exhq/v2.exhq.dev">this website is
                 opensource</a></div>
         </>

src/components/comps.tsx

@@ -59,4 +59,9 @@ export function SingularOomfie(props: { name: string; url: string; discordid: st
             )}
         </div>
     );
+}
+
+
+export function Singular88(props: { name: string; url: string; src:string }) {
+    return <a href={props.url}><img alt={props.name} src={props.src}/></a>
 }