-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
132 lines (131 loc) · 5.99 KB
/
index.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
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Ethiopic:wght@600&display=swap');
@keyframes rainbow {
0%{filter: hue-rotate(0deg);}
50%{filter: hue-rotate(180deg);}
100%{filter: hue-rotate(360deg);}
}
@media (prefers-color-scheme: dark) {
body {
background-color: #495057;
color: #f1f3f5;
font-family: 'Noto Sans Ethiopic', sans-serif;
}
small {
color: #868e96;
}
}
@media (prefers-color-scheme: light) {
body {
background-color: #f1f3f5;
color: #495057;
font-family: 'Noto Sans Ethiopic', sans-serif;
}
small {
color: #ced4da
}
}
a {
color: unset;
text-decoration: none;
}
</style>
</head>
<body>
<svg
id="sw-js-blob-svg"
viewBox="0 0 100 100"
version="1.1"
style="animation: rainbow 5s infinite linear;margin: auto;display: block; max-width: 65vw; max-height: 65vh;"
sodipodi:docname="blue-nomargin.svg"
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview16933"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
showgrid="false"
inkscape:zoom="5.6568543"
inkscape:cx="39.774756"
inkscape:cy="51.088465"
inkscape:window-width="1920"
inkscape:window-height="1009"
inkscape:window-x="1912"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="sw-js-blob-svg" />
<defs
id="defs16928">
<linearGradient
id="sw-gradient"
x1="-20.331665"
x2="29.240893"
y1="25.038646"
y2="-24.533912"
spreadMethod="pad"
gradientTransform="matrix(2.0074483,0,0,1.5524157,41.057593,49.608223)"
gradientUnits="userSpaceOnUse">
<stop
id="stop2"
stop-color="rgba(224.606, 31, 251, 1)"
offset="0"
style="stop-color:#4bedef;stop-opacity:0.89937109;" />
<stop
id="stop1"
stop-color="rgba(198.694, 55, 248, 1)"
offset="1"
style="stop-color:#46c9ff;stop-opacity:1;" />
</linearGradient>
</defs>
<path
fill="url(#sw-gradient)"
d="m 73.010087,14.125065 c 8.297056,4.413329 13.239982,15.534915 18.712509,29.127965 5.472525,13.593049 11.474654,29.657562 5.649059,37.778087 -6.002125,7.943989 -24.008501,7.943989 -37.42502,7.061324 C 46.530117,87.209775 37.703461,85.267912 26.581877,83.679114 15.460291,82.090316 2.2203065,80.854583 0.45497528,74.675924 -1.3103559,68.320732 8.3989655,57.022613 12.63576,46.783692 17.049088,36.544771 15.989889,27.541582 19.873618,22.245588 23.757345,17.126127 32.40747,15.537331 42.64639,13.771999 52.885311,11.830136 64.536495,9.7117369 73.010087,14.125065 Z"
width="100%"
height="100%"
stroke-width="0"
style="fill:url(#sw-gradient);stroke:none;stroke-opacity:1"
id="path16930" />
<circle
style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.39502;stroke-opacity:1;paint-order:markers fill stroke"
id="path19313"
cx="31.78583"
cy="33.680111"
r="3.8703837" />
<circle
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.39502;stroke-opacity:1;paint-order:markers fill stroke"
id="path19313-3"
cx="66.619278"
cy="29.391317"
r="3.8703837" />
<path
style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.73435;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;paint-order:markers fill stroke"
d="M 54.615865,67.912094 53.282152,65.610783"
id="path28312" />
</svg>
<h1 style="text-align: center" id="funnyCaption">[insert funny caption]</h1>
<small style="position: fixed; bottom: 0">Please do not use Blobbie without <a href="mailto:[email protected]">asking for permission</a></small>
<script>
let captions = [
"I'm a blob",
"[Insert text under Blobbie with comedic value]",
"Be gay and... there is no second part, just be gay",
"blob",
"bottom text",
"and then he turned himself into a blob, funniest shit i've ever seen",
"lang.funny.caption"
]
document.getElementById("funnyCaption").innerHTML = captions[Math.floor(Math.random() * captions.length)];
</script>
</body>
</html>