init
This commit is contained in:
23
404.html
Normal file
23
404.html
Normal file
@@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>KOTIKOT</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&display=swap"
|
||||
/>
|
||||
<link rel="stylesheet" href="./style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<div id="hero">
|
||||
<h1>404</h1>
|
||||
<a target="_blank" href="/"
|
||||
>[back]</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="./script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
23
index.html
Normal file
23
index.html
Normal file
@@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>KOTIKOT</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&display=swap"
|
||||
/>
|
||||
<link rel="stylesheet" href="./style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<div id="hero">
|
||||
<h1>KOTIKOT</h1>
|
||||
<a target="_blank" href="https://projects.kotikot.com"
|
||||
>[projects]</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="./script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
15
script.js
Normal file
15
script.js
Normal file
@@ -0,0 +1,15 @@
|
||||
import { neonCursor } from 'https://unpkg.com/threejs-toys@0.0.8/build/threejs-toys.module.cdn.min.js'
|
||||
|
||||
neonCursor({
|
||||
el: document.getElementById('app'),
|
||||
shaderPoints: 16,
|
||||
curvePoints: 80,
|
||||
curveLerp: 0.5,
|
||||
radius1: 5,
|
||||
radius2: 30,
|
||||
velocityTreshold: 10,
|
||||
sleepRadiusX: 100,
|
||||
sleepRadiusY: 100,
|
||||
sleepTimeCoefX: 0.0025,
|
||||
sleepTimeCoefY: 0.0025
|
||||
})
|
||||
41
style.css
Normal file
41
style.css
Normal file
@@ -0,0 +1,41 @@
|
||||
body,
|
||||
html,
|
||||
#app {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#app {
|
||||
overflow: hidden;
|
||||
touch-action: pan-up;
|
||||
color: #ffffff;
|
||||
font-family: "Montserrat", sans-serif;
|
||||
text-align: center;
|
||||
text-shadow: 0 0 5px #ffffff, 0 0 20px #000, 0 0 30px #000;
|
||||
}
|
||||
|
||||
#app h1 {
|
||||
--fontSize: 150px;
|
||||
--lineHeight: 105px;
|
||||
width: auto;
|
||||
height: calc(var(--lineHeight));
|
||||
line-height: var(--lineHeight);
|
||||
margin: calc(50vh - (var(--lineHeight))) auto 0;
|
||||
font-size: var(--fontSize);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#app a {
|
||||
margin-top: 15px;
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#app canvas {
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: -1;
|
||||
top: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user