-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy path404.html
146 lines (123 loc) · 6.21 KB
/
404.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="en">
<head>
<title>404: Page Not Found</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="/assets/img/favicons/favicon.ico">
<link rel="icon" type="image/png" sizes="96x96" href="/assets/img/favicons/favicon-96x96.png">
<link rel="icon" type="image/svg+xml" href="/assets/img/favicons/favicon.svg">
<link rel="icon" type="image/x-icon" href="/assets/img/favicons/favicon.ico">
<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
<link rel="manifest" href="/assets/img/favicons/site.webmanifest">
<meta name="description" content="404 page of Kiran Brahmatewari's macOS-inspired personal website">
<meta name="author" content="Kiran Brahmatewari">
<meta name="apple-mobile-web-app-title" content="Lynkos">
<meta name="keywords" content="404, error, code, lynkos, front-end, website, macos, terminal, apple">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta property="og:title" content="Lynkos">
<meta property="og:description" content="404 page of Kiran Brahmatewari's macOS-inspired personal website">
<meta property="og:url" content="https://lynkos.dev">
<meta property="og:site_name" content="Lynkos">
<meta property="og:image" content="https://lynkos.dev/assets/img/favicons/favicon.svg">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@0xLynkos">
<meta name="twitter:creator" content="@0xLynkos">
<meta name="twitter:title" content="Lynkos">
<meta name="twitter:description" content="404 page of Kiran Brahmatewari's macOS-inspired personal website">
<meta name="twitter:image" content="https://lynkos.dev/assets/img/favicons/favicon.svg">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link rel="stylesheet" href="/assets/stylesheets/css/404.css">
<link rel="preload" as="script" href="/dist/components/404.js">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.14/vue.min.js" integrity="sha256-kXTEJcRFN330VirZFl6gj9+UM6gIKW195fYZeR3xDhc=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src="/dist/lib/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js" integrity="sha256-AAhU14J4Gv8bFupUUcHaPQfvrdNauRHMt+S4UVcaJb0=" crossorigin="anonymous" defer></script>
</head>
<body>
<div class="layer"></div>
<canvas id="neuro"></canvas>
<div id="mount">
<div class="window" ref="window" :class="[{'basic': aero.basic, 'opaque': !aero.transparency, 'blurred': aero.blur, 'box-shadow': aero.css.boxShadow, 'drop-shadow': aero.css.dropShadowFilter}]">
<div class="titlebar">
<div class="title">
<span class="icon"></span>
<span class="text">Error 404: Page Not Found</span>
</div>
<div class="controls">
<button type="button" class="minimize-button"><span class="sr">Minimize</span><i class="control-icon"></i></button>
<button type="button" class="maximize-button"><span class="sr">Maximize</span><i class="control-icon"></i></button>
<button type="button" class="close-button"><span class="sr">Close</span><i class="control-icon"></i></button>
</div>
</div>
<div class="viewport">
<section class="client-area">
<button class="windows00"><a onclick="history.back()" alt="Link to go to previous page">Go Back</a></button>
<button class="windows00"><a href="https://lynkos.dev" alt="Link to homepage">Homepage</a></button>
</section>
</div>
<template>
<svg width="0" height="0">
<defs>
<clipPath id="close-icon"><polygon points="6.67,8 4.67,5.61 2.68,8 0,8 3.33,4 0,0 2.68,0 4.67,2.39 6.67,0 9.35,0 6.02,4 9.35,8 "/></clipPath>
<clipPath id="maximize-button"><path d="M10,8H0V0h10V8z M8,2H2v4h6V2z"/></clipPath>
</defs>
</svg>
</template>
</div>
<script type="x-shader/x-fragment" id="vertShader">
precision mediump float;
varying vec2 vUv;
attribute vec2 a_position;
void main() {
vUv = .2 * (a_position + 1.);
gl_Position = vec4(a_position, 0.0, 1.0);
}
</script>
<script type="x-shader/x-fragment" id="fragShader">
precision mediump float;
varying vec2 vUv;
uniform float u_time;
uniform float u_ratio;
uniform vec2 u_pointer_position;
uniform float u_scroll_progress;
vec2 rotate(vec2 uv, float th) {
return mat2(cos(th), sin(th), -sin(th), cos(th)) * uv;
}
float neuro_shape(vec2 uv, float t, float p) {
vec2 sine_acc = vec2(0.);
vec2 res = vec2(0.);
float scale = 8.;
for (int j = 0; j < 200; j++) {
uv = rotate(uv, 1.);
sine_acc = rotate(sine_acc, 1.);
vec2 layer = uv * scale + float(j) + sine_acc - t;
sine_acc += sin(layer);
res += (.5 + .5 * cos(layer)) / scale;
scale *= ((j<5?1.2:j<45?1.3:1.35) - .07 * p);
}
return res.x + res.y;
}
void main() {
vec2 uv = 2.95 * vUv;
uv.x *= u_ratio;
vec2 pointer = vUv - u_pointer_position;
pointer.x *= u_ratio;
float p = clamp(length(pointer), 0., 1.);
p = .05 * pow(1. - p, 2.);
float t = .0009 * u_time;
vec3 color = vec3(0.);
float noise = neuro_shape(uv, t, p);
noise = 1.05 * pow(noise, 1.);
noise += pow(noise, 10.);
noise = max(.0, noise - .5);
noise *= (1. - length(vUv - .5));
color = normalize(vec3(0.4, .7 + .0 * cos(3. * u_scroll_progress), .6 + .9 * sin(3. * u_scroll_progress)));
color = color * noise;
gl_FragColor = vec4(color, noise);
}
</script>
<script src="/dist/components/404.js"></script>
</body>
</html>