typescript more like gayscript
This commit is contained in:
parent
9cdcae11d2
commit
a8bf4b8a5a
19 changed files with 246 additions and 114 deletions
|
|
@ -2,11 +2,12 @@
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="https://dp.nea.moe/avatar/712639419785412668.png" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>ECHO</title>
|
<title>Vite + Solid + TS</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
<script type="module" src="/src/index.jsx"></script>
|
<script type="module" src="/src/index.tsx"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -5,13 +5,14 @@
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite",
|
"dev": "vite",
|
||||||
"build": "vite build",
|
"build": "tsc -b && vite build",
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"solid-js": "^1.8.17"
|
"solid-js": "^1.8.17"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"typescript": "^5.2.2",
|
||||||
"vite": "^5.3.1",
|
"vite": "^5.3.1",
|
||||||
"vite-plugin-solid": "^2.10.2"
|
"vite-plugin-solid": "^2.10.2"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -12,6 +12,9 @@ importers:
|
||||||
specifier: ^1.8.17
|
specifier: ^1.8.17
|
||||||
version: 1.8.17
|
version: 1.8.17
|
||||||
devDependencies:
|
devDependencies:
|
||||||
|
typescript:
|
||||||
|
specifier: ^5.2.2
|
||||||
|
version: 5.5.2
|
||||||
vite:
|
vite:
|
||||||
specifier: ^5.3.1
|
specifier: ^5.3.1
|
||||||
version: 5.3.1
|
version: 5.3.1
|
||||||
|
|
@ -541,6 +544,11 @@ packages:
|
||||||
resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
|
resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
|
||||||
engines: {node: '>=4'}
|
engines: {node: '>=4'}
|
||||||
|
|
||||||
|
typescript@5.5.2:
|
||||||
|
resolution: {integrity: sha512-NcRtPEOsPFFWjobJEtfihkLCZCXZt/os3zf8nTxjVH3RvTSxjrCamJpbExGvYOF+tFHc3pA65qpdwPbzjohhew==}
|
||||||
|
engines: {node: '>=14.17'}
|
||||||
|
hasBin: true
|
||||||
|
|
||||||
update-browserslist-db@1.0.16:
|
update-browserslist-db@1.0.16:
|
||||||
resolution: {integrity: sha512-KVbTxlBYlckhF5wgfyZXTWnMn7MMZjMu9XG8bPlliUOP9ThaF4QnhP8qrjrH7DRzHfSk0oQv1wToW+iA5GajEQ==}
|
resolution: {integrity: sha512-KVbTxlBYlckhF5wgfyZXTWnMn7MMZjMu9XG8bPlliUOP9ThaF4QnhP8qrjrH7DRzHfSk0oQv1wToW+iA5GajEQ==}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
@ -1080,6 +1088,8 @@ snapshots:
|
||||||
|
|
||||||
to-fast-properties@2.0.0: {}
|
to-fast-properties@2.0.0: {}
|
||||||
|
|
||||||
|
typescript@5.5.2: {}
|
||||||
|
|
||||||
update-browserslist-db@1.0.16(browserslist@4.23.1):
|
update-browserslist-db@1.0.16(browserslist@4.23.1):
|
||||||
dependencies:
|
dependencies:
|
||||||
browserslist: 4.23.1
|
browserslist: 4.23.1
|
||||||
|
|
|
||||||
BIN
public/gaybackground.png
Normal file
BIN
public/gaybackground.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
|
|
@ -1 +0,0 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
58
src/App.css
58
src/App.css
|
|
@ -1,6 +1,6 @@
|
||||||
:root {
|
:root {
|
||||||
background-color: #121212;
|
background-color: #121212;
|
||||||
font-family: 'Courier New', Courier, monospace;
|
font-family: monospace;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
color: pink;
|
color: pink;
|
||||||
}
|
}
|
||||||
|
|
@ -12,13 +12,22 @@
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header img:hover{
|
||||||
|
animation: bigsmall .5s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
.cardchild h1 {
|
.cardchild h1 {
|
||||||
|
font-size: 3em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.cardchild span {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
.cardchild img {
|
.cardchild img {
|
||||||
max-width: 4em;
|
max-width: 5em;
|
||||||
margin: 1em;
|
margin: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardchild {
|
.cardchild {
|
||||||
|
|
@ -32,31 +41,41 @@
|
||||||
cursor: default;
|
cursor: default;
|
||||||
background-color: #272525;
|
background-color: #272525;
|
||||||
border-radius: 5%;
|
border-radius: 5%;
|
||||||
|
margin: 1em 1em .5em .5em;
|
||||||
width: 20em;
|
width: 20em;
|
||||||
padding: 0.5em 2em 2em 2em;
|
padding: 0.5em 5em 2em 5em;
|
||||||
transform: translateY(-0em);
|
transform: translateY(-0em);
|
||||||
transition: background-color 1s, transform .5s, box-shadow .5s, -webkit-box-shadow .5s, -moz-box-shadow 0.5s;
|
transition: background-color 1s, transform .5s, box-shadow .5s, -webkit-box-shadow .5s, -moz-box-shadow 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardchild:hover {
|
.cardchild:hover {
|
||||||
box-shadow: 0 0 234px -3px rgba(250, 236, 236, 0.75);
|
box-shadow: 0 0 534px -3px rgba(250, 236, 236, 0.4);
|
||||||
-webkit-box-shadow: 0 0 234px -3px rgba(250, 236, 236, 0.75);
|
-webkit-box-shadow: 0 0 534px -3px rgba(250, 236, 236, 0.4);
|
||||||
-moz-box-shadow: 0 0 234px -3px rgba(250, 236, 236, 0.75);
|
-moz-box-shadow: 0 0 534px -3px rgba(250, 236, 236, 0.4);
|
||||||
background-color: #5e5a5a;
|
background-color: #5e5a5a;
|
||||||
animation: big 500ms infinite;
|
animation: big 500ms infinite;
|
||||||
transform: translateY(-0.3em);
|
transform: translateY(-0.3em);
|
||||||
transition: background-color 1s, transform .5s, box-shadow .5s, -webkit-box-shadow .5s, -moz-box-shadow 0.5s;
|
transition: background-color 1s, transform .5s, box-shadow .5s, -webkit-box-shadow .5s, -moz-box-shadow 0.5s;
|
||||||
}
|
}
|
||||||
|
.linktree {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
|
||||||
|
.linktree img {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
.parent {
|
.parent {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header h1 {
|
.header h1 {
|
||||||
font-size: 2.5em;
|
font-size: 3.6em;
|
||||||
color: blanchedalmond;
|
color: blanchedalmond;
|
||||||
display: inline-table;
|
display: inline-table;
|
||||||
}
|
}
|
||||||
|
|
@ -82,6 +101,16 @@
|
||||||
animation: slide-left 1.5s;
|
animation: slide-left 1.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.gaybackground {
|
||||||
|
background-image: url("/gaybackground.png");
|
||||||
|
}
|
||||||
|
|
||||||
|
.animate {
|
||||||
|
z-index: 10000000;
|
||||||
|
transform: scale(10000);
|
||||||
|
transition: 20s;
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes slide-left {
|
@keyframes slide-left {
|
||||||
from {
|
from {
|
||||||
transform: translateX(-10000em);
|
transform: translateX(-10000em);
|
||||||
|
|
@ -102,6 +131,19 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@keyframes bigsmall {
|
||||||
|
0% {
|
||||||
|
max-width: 10em;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 10.5em;
|
||||||
|
max-width: 10.5em;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
max-width: 10em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes shake {
|
@keyframes shake {
|
||||||
0% {
|
0% {
|
||||||
transform: translate(0, 0) rotate(0deg);
|
transform: translate(0, 0) rotate(0deg);
|
||||||
|
|
|
||||||
46
src/App.jsx
46
src/App.jsx
|
|
@ -1,46 +0,0 @@
|
||||||
import { createSignal } from 'solid-js'
|
|
||||||
import './App.css'
|
|
||||||
import HoverComponent from './components/name'
|
|
||||||
import AdvancedBr from './components/comps'
|
|
||||||
import Review from './components/api'
|
|
||||||
function App() {
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div class='header'>
|
|
||||||
<img src="https://dp.nea.moe/avatar/712639419785412668" class="logo-pfp" alt="Vite logo" />
|
|
||||||
<HoverComponent />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<p style={{ display: "none" }}>AdvancedBr my beloved</p>
|
|
||||||
<AdvancedBr count={10}/>
|
|
||||||
|
|
||||||
|
|
||||||
<div className='parent'>
|
|
||||||
<div className='cardchild'>
|
|
||||||
<h1>link tree</h1>
|
|
||||||
<img src="https://openpgpjs.org/images/logo_proton_mail.png" alt="LMAO IMAGINE BEING BLIND" />
|
|
||||||
<img src="https://git.gay/assets/img/logo.png" alt="" />
|
|
||||||
<img src="https://woem.men/files/356134d8-df3b-41dc-ac73-c4420442bf3a" alt="" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className='cardchild'>
|
|
||||||
<h1>hi :3</h1>
|
|
||||||
<span style={{
|
|
||||||
fontSize: "15em",
|
|
||||||
fontFamily: "monospace"
|
|
||||||
}}>silly goober who does silly stuff <br/> self proclaimed programmer and progamer <br /> shitposts for fun</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className='cardchild'>
|
|
||||||
<h1>reviews</h1>
|
|
||||||
<Review/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<AdvancedBr count={10}/>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default App
|
|
||||||
79
src/App.tsx
Normal file
79
src/App.tsx
Normal file
|
|
@ -0,0 +1,79 @@
|
||||||
|
import './App.css'
|
||||||
|
import HoverComponent from './components/name.tsx'
|
||||||
|
import AdvancedBr from './components/comps.tsx'
|
||||||
|
import { createSignal } from 'solid-js';
|
||||||
|
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 [isAnimating, setIsAnimating] = createSignal(false);
|
||||||
|
const [animatedwoem, setanimatedwoem] = createSignal(false);
|
||||||
|
let gitgay = <img onClick={() => {
|
||||||
|
setIsAnimating(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
window.location.href = "https://git.gay/exhq"
|
||||||
|
}, 200);
|
||||||
|
gitgay.src = "/gaybackground.png"
|
||||||
|
}} classList={{ 'gitgayimg': true, 'animate': isAnimating(), 'gaybackground': isAnimating() }} src="https://git.gay/assets/img/logo.png" alt="LMAO IMAGINE BEING BLIND" /> as HTMLImageElement
|
||||||
|
return (
|
||||||
|
|
||||||
|
<>
|
||||||
|
<div class='header'>
|
||||||
|
<img onmouseenter={remov} src="https://dp.nea.moe/avatar/712639419785412668.png" class="logo-pfp" alt="LMAO IMAGINE BEING BLIND" />
|
||||||
|
<HoverComponent />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<p style={{ display: "none" }}>AdvancedBr my beloved</p>
|
||||||
|
<AdvancedBr count={6} />
|
||||||
|
|
||||||
|
|
||||||
|
<div class='parent'>
|
||||||
|
<div class='cardchild'>
|
||||||
|
<h1>link tree</h1>
|
||||||
|
<div class='linktree'>
|
||||||
|
{gitgay}
|
||||||
|
<img onClick={() => {
|
||||||
|
setanimatedwoem(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
window.location.href = "https://woem.men/@exhq"
|
||||||
|
}, 200);
|
||||||
|
}} classList={{ 'woemimg': true, 'animate': animatedwoem() }} src="https://woem.men/files/356134d8-df3b-41dc-ac73-c4420442bf3a" alt="LMAO IMAGINE BEING BLIND" />
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
|
<div class='linktree'>
|
||||||
|
<span class='gitgaytext' >Git</span>
|
||||||
|
<span class='woemtext' >Fedi</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
opacity: isAnimating() || animatedwoem() ? "0%" : "100%"
|
||||||
|
}} class='cardchild'>
|
||||||
|
<h1>hi :3</h1>
|
||||||
|
<span>silly goober who does silly stuff <br /> self proclaimed programmer and progamer <br /> shitposts for fun</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
opacity: isAnimating() || animatedwoem() ? "0%" : "100%"
|
||||||
|
}} class='cardchild'>
|
||||||
|
<h1>reviews</h1>
|
||||||
|
{/* <Review/> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<AdvancedBr count={10} />
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default App
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
import { createSignal, createEffect } from 'solid-js';
|
|
||||||
|
|
||||||
const Review = () => {
|
|
||||||
// State to store the fetched data
|
|
||||||
const [data, setData] = createSignal([]);
|
|
||||||
const [name, setName] = createSignal([]);
|
|
||||||
let colontree = {}
|
|
||||||
|
|
||||||
|
|
||||||
createEffect(() => {
|
|
||||||
|
|
||||||
fetch('https://api.review.exhq.dev/getreviews/')
|
|
||||||
.then(res => res.json())
|
|
||||||
.then(jsonData => {
|
|
||||||
setData(jsonData);
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Error fetching data:', error);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
for (let i = 0; i < data().length; i++) {
|
|
||||||
|
|
||||||
fetch(`https://discordlookup.mesalytic.moe/v1/user/${data()[i].discordID}`)
|
|
||||||
.then(res => res.json()).then(console.log)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{data().reverse().map(i => (
|
|
||||||
<li>{i.discordID}</li>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Review;
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
// warning: this IS horrible code. its a joke. DO NOT try this at home because
|
// warning: this IS horrible code. its a joke. DO NOT try this at home because
|
||||||
// your local senior programmer CAN and WILL hunt you down
|
// your local senior programmer CAN and WILL hunt you down
|
||||||
// you have been warned.
|
// you have been warned.
|
||||||
export default function AdvancedBr({ count }) {
|
export default function AdvancedBr({count}: any) {
|
||||||
return new Array(count).fill(null).map(_=>(<br/>))
|
return new Array(count).fill(null).map(_=>(<br/>))
|
||||||
}
|
}
|
||||||
|
|
@ -4,12 +4,11 @@ import { removethething } from "./utils";
|
||||||
function HoverComponent() {
|
function HoverComponent() {
|
||||||
let timerId;
|
let timerId;
|
||||||
|
|
||||||
const [isHovered, setIsHovered] = createSignal(false);
|
|
||||||
const [name, setname] = createSignal(true)
|
const [name, setname] = createSignal(true)
|
||||||
|
|
||||||
const startTimer = () => {
|
const startTimer = () => {
|
||||||
timerId = setTimeout(() => {
|
timerId = setTimeout(() => {
|
||||||
executeFunction();
|
setname(!name())
|
||||||
}, 3000);
|
}, 3000);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -19,22 +18,12 @@ function HoverComponent() {
|
||||||
timerId = null;
|
timerId = null;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const executeFunction = () => {
|
|
||||||
setname(!name())
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleMouseEnter = () => {
|
const handleMouseEnter = () => {
|
||||||
removethething()
|
removethething()
|
||||||
setIsHovered(true);
|
|
||||||
startTimer();
|
startTimer();
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleMouseLeave = () => {
|
|
||||||
setIsHovered(false);
|
|
||||||
clearTimer();
|
|
||||||
};
|
|
||||||
|
|
||||||
onCleanup(() => {
|
onCleanup(() => {
|
||||||
clearTimer();
|
clearTimer();
|
||||||
});
|
});
|
||||||
|
|
@ -43,7 +32,7 @@ function HoverComponent() {
|
||||||
<h1
|
<h1
|
||||||
className="removethisinstantly"
|
className="removethisinstantly"
|
||||||
onMouseEnter={handleMouseEnter}
|
onMouseEnter={handleMouseEnter}
|
||||||
onMouseLeave={handleMouseLeave}
|
onMouseLeave={clearTimer}
|
||||||
>
|
>
|
||||||
{name() ? "ECHO" : "exhq"}
|
{name() ? "ECHO" : "exhq"}
|
||||||
</h1>
|
</h1>
|
||||||
|
|
|
||||||
42
src/components/name.tsx
Normal file
42
src/components/name.tsx
Normal file
|
|
@ -0,0 +1,42 @@
|
||||||
|
import { createSignal, onCleanup } from "solid-js";
|
||||||
|
import { removethething } from "./utils.ts";
|
||||||
|
|
||||||
|
function HoverComponent() {
|
||||||
|
let timerId: number|null;
|
||||||
|
|
||||||
|
const [name, setname] = createSignal(true)
|
||||||
|
|
||||||
|
const startTimer = () => {
|
||||||
|
timerId = setTimeout(() => {
|
||||||
|
setname(!name())
|
||||||
|
}, 3000);
|
||||||
|
};
|
||||||
|
|
||||||
|
const clearTimer = () => {
|
||||||
|
if (timerId) {
|
||||||
|
clearTimeout(timerId);
|
||||||
|
timerId = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleMouseEnter = () => {
|
||||||
|
removethething()
|
||||||
|
startTimer();
|
||||||
|
};
|
||||||
|
|
||||||
|
onCleanup(() => {
|
||||||
|
clearTimer();
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<h1
|
||||||
|
class="removethisinstantly"
|
||||||
|
onMouseEnter={handleMouseEnter}
|
||||||
|
onMouseLeave={clearTimer}
|
||||||
|
>
|
||||||
|
{name() ? "ECHO" : "exhq"}
|
||||||
|
</h1>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default HoverComponent;
|
||||||
|
|
@ -4,14 +4,14 @@ export function removethething() {
|
||||||
let rules = styleSheet.cssRules || styleSheet.rules;
|
let rules = styleSheet.cssRules || styleSheet.rules;
|
||||||
for (let j = 0; j < rules.length; j++) {
|
for (let j = 0; j < rules.length; j++) {
|
||||||
let rule = rules[j];
|
let rule = rules[j];
|
||||||
if (rule.type === CSSRule.KEYFRAMES_RULE && rule.name === "slide-right") {
|
if (rule.type === CSSRule.KEYFRAMES_RULE && ((rule as CSSKeyframesRule).name === "slide-right" )) {
|
||||||
styleSheet.deleteRule(j);
|
styleSheet.deleteRule(j);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getLatestItems(apiUrl) {
|
export async function getLatestItems(apiUrl: string) {
|
||||||
try {
|
try {
|
||||||
const response = await fetch(apiUrl);
|
const response = await fetch(apiUrl);
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
|
|
@ -5,4 +5,4 @@ import App from './App'
|
||||||
|
|
||||||
const root = document.getElementById('root')
|
const root = document.getElementById('root')
|
||||||
|
|
||||||
render(() => <App />, root)
|
render(() => <App />, root!)
|
||||||
1
src/vite-env.d.ts
vendored
Normal file
1
src/vite-env.d.ts
vendored
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
/// <reference types="vite/client" />
|
||||||
28
tsconfig.app.json
Normal file
28
tsconfig.app.json
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||||
|
"target": "ES2020",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
/* Bundler mode */
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowImportingTsExtensions": true,
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"moduleDetection": "force",
|
||||||
|
"noEmit": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
"jsxImportSource": "solid-js",
|
||||||
|
|
||||||
|
/* Linting */
|
||||||
|
"strict": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"noFallthroughCasesInSwitch": true
|
||||||
|
},
|
||||||
|
"include": ["src"]
|
||||||
|
}
|
||||||
11
tsconfig.json
Normal file
11
tsconfig.json
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
{
|
||||||
|
"files": [],
|
||||||
|
"references": [
|
||||||
|
{
|
||||||
|
"path": "./tsconfig.app.json"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "./tsconfig.node.json"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
13
tsconfig.node.json
Normal file
13
tsconfig.node.json
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowSyntheticDefaultImports": true,
|
||||||
|
"strict": true,
|
||||||
|
"noEmit": true
|
||||||
|
},
|
||||||
|
"include": ["vite.config.ts"]
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue