edward/starry.network
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Initial commit

Browse source
This commit is contained in:
Edward Shen 2022-09-14 02:06:00 -07:00
commit 9fa78b1a6e
Signed by: edward
GPG key ID: 19182661E818369F
2 changed files with 150 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
index.html Normal file
View file

@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>The Starry Network</title>
<meta name="description" content="A ">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=M+PLUS+Code+Latin&display=swap" rel="stylesheet">
<link rel="icon" href="data:,">
<link href="stars.css" rel="stylesheet">
<style>
html {
background: linear-gradient(to bottom, #2a2981 0%, #13151d 40%, #000 100%);
height: 100%;
margin: 0;
padding: 0;
}
body {
font-family: 'M PLUS Code Latin', sans-serif;
color: #ccc;
overflow: hidden;
height: 100%;
margin: 0;
padding: 0;
}
#wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
main {
max-width: 80ch;
width: 80ch;
padding: 0 2ch;
}
a:visited {
color: #999;
}
a {
color: #ccc;
}
</style>
</head>
<body>
<div id='stars'></div>
<div id='stars2'></div>
<div id='stars3'></div>
<div id="wrapper">
<main>
<h1>starry.network</h1>
<p>Like a dancer in the dark,</p>
<p>Illuminated only by a stellar comet,</p>
<p>A bluerose diamond dazzles,</p>
<p>Beyond the Never Ending Midnights.</p>
</main>
</div>
</body>
</html>

78
stars.css Normal file
View file

@ -0,0 +1,78 @@
/*
Copyright (c) 2022 by sarazond (https://codepen.io/sarazond/pen/LYGbwj)
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
html {
height: 100%;
background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);
overflow: hidden;
}
#stars {
width: 1px;
height: 1px;
background: transparent;
box-shadow: 138vw 82vh #FFF, 11vw 46vh #FFF, 84vw 100vh #FFF, 129vw 190vh #FFF, 66vw 104vh #FFF, 131vw 98vh #FFF, 45vw 123vh #FFF, 141vw 126vh #FFF, 100vw 78vh #FFF, 158vw 153vh #FFF, 130vw 98vh #FFF, 167vw 100vh #FFF, 66vw 175vh #FFF, 13vw 133vh #FFF, 194vw 63vh #FFF, 62vw 21vh #FFF, 127vw 18vh #FFF, 93vw 145vh #FFF, 167vw 145vh #FFF, 181vw 186vh #FFF, 159vw 194vh #FFF, 187vw 125vh #FFF, 48vw 46vh #FFF, 175vw 5vh #FFF, 132vw 45vh #FFF, 85vw 175vh #FFF, 138vw 89vh #FFF, 37vw 182vh #FFF, 112vw 180vh #FFF, 47vw 76vh #FFF, 20vw 19vh #FFF, 105vw 61vh #FFF, 179vw 97vh #FFF, 163vw 40vh #FFF, 99vw 17vh #FFF, 195vw 190vh #FFF, 39vw 7vh #FFF, 196vw 8vh #FFF, 112vw 132vh #FFF, 136vw 121vh #FFF, 174vw 59vh #FFF, 128vw 17vh #FFF, 133vw 9vh #FFF, 144vw 118vh #FFF, 54vw 132vh #FFF, 66vw 144vh #FFF, 152vw 121vh #FFF, 151vw 4vh #FFF, 89vw 85vh #FFF, 171vw 123vh #FFF, 171vw 133vh #FFF, 173vw 73vh #FFF, 193vw 9vh #FFF, 139vw 176vh #FFF, 68vw 140vh #FFF, 150vw 174vh #FFF, 17vw 86vh #FFF, 74vw 77vh #FFF, 146vw 192vh #FFF, 109vw 174vh #FFF, 185vw 51vh #FFF, 48vw 82vh #FFF, 176vw 159vh #FFF, 18vw 94vh #FFF, 37vw 121vh #FFF, 124vw 93vh #FFF, 134vw 12vh #FFF, 6vw 115vh #FFF, 116vw 171vh #FFF, 24vw 111vh #FFF, 95vw 99vh #FFF, 66vw 177vh #FFF, 5vw 104vh #FFF, 134vw 10vh #FFF, 152vw 96vh #FFF, 37vw 91vh #FFF, 52vw 69vh #FFF, 70vw 2vh #FFF, 55vw 5vh #FFF, 74vw 184vh #FFF, 66vw 38vh #FFF, 175vw 31vh #FFF, 53vw 47vh #FFF, 28vw 12vh #FFF, 67vw 120vh #FFF, 120vw 146vh #FFF, 144vw 125vh #FFF, 7vw 79vh #FFF, 77vw 112vh #FFF, 142vw 129vh #FFF, 175vw 42vh #FFF, 153vw 3vh #FFF, 39vw 122vh #FFF, 28vw 47vh #FFF, 134vw 47vh #FFF, 164vw 119vh #FFF, 42vw 38vh #FFF, 19vw 120vh #FFF, 143vw 154vh #FFF, 37vw 127vh #FFF;
animation: animStar 50s linear infinite;
}
#stars:after {
content: " ";
position: absolute;
top: 2000px;
width: 1px;
height: 1px;
background: transparent;
box-shadow: 138vw 82vh #FFF, 11vw 46vh #FFF, 84vw 100vh #FFF, 129vw 190vh #FFF, 66vw 104vh #FFF, 131vw 98vh #FFF, 45vw 123vh #FFF, 141vw 126vh #FFF, 100vw 78vh #FFF, 158vw 153vh #FFF, 130vw 98vh #FFF, 167vw 100vh #FFF, 66vw 175vh #FFF, 13vw 133vh #FFF, 194vw 63vh #FFF, 62vw 21vh #FFF, 127vw 18vh #FFF, 93vw 145vh #FFF, 167vw 145vh #FFF, 181vw 186vh #FFF, 159vw 194vh #FFF, 187vw 125vh #FFF, 48vw 46vh #FFF, 175vw 5vh #FFF, 132vw 45vh #FFF, 85vw 175vh #FFF, 138vw 89vh #FFF, 37vw 182vh #FFF, 112vw 180vh #FFF, 47vw 76vh #FFF, 20vw 19vh #FFF, 105vw 61vh #FFF, 179vw 97vh #FFF, 163vw 40vh #FFF, 99vw 17vh #FFF, 195vw 190vh #FFF, 39vw 7vh #FFF, 196vw 8vh #FFF, 112vw 132vh #FFF, 136vw 121vh #FFF, 174vw 59vh #FFF, 128vw 17vh #FFF, 133vw 9vh #FFF, 144vw 118vh #FFF, 54vw 132vh #FFF, 66vw 144vh #FFF, 152vw 121vh #FFF, 151vw 4vh #FFF, 89vw 85vh #FFF, 171vw 123vh #FFF, 171vw 133vh #FFF, 173vw 73vh #FFF, 193vw 9vh #FFF, 139vw 176vh #FFF, 68vw 140vh #FFF, 150vw 174vh #FFF, 17vw 86vh #FFF, 74vw 77vh #FFF, 146vw 192vh #FFF, 109vw 174vh #FFF, 185vw 51vh #FFF, 48vw 82vh #FFF, 176vw 159vh #FFF, 18vw 94vh #FFF, 37vw 121vh #FFF, 124vw 93vh #FFF, 134vw 12vh #FFF, 6vw 115vh #FFF, 116vw 171vh #FFF, 24vw 111vh #FFF, 95vw 99vh #FFF, 66vw 177vh #FFF, 5vw 104vh #FFF, 134vw 10vh #FFF, 152vw 96vh #FFF, 37vw 91vh #FFF, 52vw 69vh #FFF, 70vw 2vh #FFF, 55vw 5vh #FFF, 74vw 184vh #FFF, 66vw 38vh #FFF, 175vw 31vh #FFF, 53vw 47vh #FFF, 28vw 12vh #FFF, 67vw 120vh #FFF, 120vw 146vh #FFF, 144vw 125vh #FFF, 7vw 79vh #FFF, 77vw 112vh #FFF, 142vw 129vh #FFF, 175vw 42vh #FFF, 153vw 3vh #FFF, 39vw 122vh #FFF, 28vw 47vh #FFF, 134vw 47vh #FFF, 164vw 119vh #FFF, 42vw 38vh #FFF, 19vw 120vh #FFF, 143vw 154vh #FFF, 37vw 127vh #FFF;
}
#stars2 {
width: 2px;
height: 2px;
background: transparent;
box-shadow: 15vw 70vh #FFF, 128vw 67vh #FFF, 181vw 150vh #FFF, 42vw 58vh #FFF, 160vw 128vh #FFF, 148vw 51vh #FFF, 79vw 186vh #FFF, 47vw 37vh #FFF, 200vw 25vh #FFF, 128vw 6vh #FFF, 149vw 15vh #FFF, 55vw 127vh #FFF, 139vw 99vh #FFF, 86vw 197vh #FFF, 131vw 189vh #FFF, 131vw 20vh #FFF, 83vw 196vh #FFF, 35vw 60vh #FFF, 57vw 152vh #FFF, 124vw 6vh #FFF, 9vw 39vh #FFF, 132vw 109vh #FFF, 124vw 123vh #FFF, 176vw 96vh #FFF, 27vw 147vh #FFF, 57vw 106vh #FFF, 59vw 53vh #FFF, 177vw 65vh #FFF, 126vw 168vh #FFF, 174vw 152vh #FFF, 102vw 45vh #FFF, 29vw 188vh #FFF, 125vw 42vh #FFF, 184vw 154vh #FFF, 199vw 75vh #FFF, 165vw 108vh #FFF, 29vw 10vh #FFF, 190vw 185vh #FFF, 20vw 73vh #FFF, 179vw 117vh #FFF, 44vw 95vh #FFF, 26vw 191vh #FFF, 170vw 32vh #FFF, 34vw 120vh #FFF, 126vw 187vh #FFF, 49vw 121vh #FFF, 156vw 122vh #FFF, 80vw 188vh #FFF, 107vw 75vh #FFF, 60vw 195vh #FFF;
animation: animStar 100s linear infinite;
}
#stars2:after {
content: " ";
position: absolute;
top: 2000px;
width: 2px;
height: 2px;
background: transparent;
box-shadow: 15vw 70vh #FFF, 128vw 67vh #FFF, 181vw 150vh #FFF, 42vw 58vh #FFF, 160vw 128vh #FFF, 148vw 51vh #FFF, 79vw 186vh #FFF, 47vw 37vh #FFF, 200vw 25vh #FFF, 128vw 6vh #FFF, 149vw 15vh #FFF, 55vw 127vh #FFF, 139vw 99vh #FFF, 86vw 197vh #FFF, 131vw 189vh #FFF, 131vw 20vh #FFF, 83vw 196vh #FFF, 35vw 60vh #FFF, 57vw 152vh #FFF, 124vw 6vh #FFF, 9vw 39vh #FFF, 132vw 109vh #FFF, 124vw 123vh #FFF, 176vw 96vh #FFF, 27vw 147vh #FFF, 57vw 106vh #FFF, 59vw 53vh #FFF, 177vw 65vh #FFF, 126vw 168vh #FFF, 174vw 152vh #FFF, 102vw 45vh #FFF, 29vw 188vh #FFF, 125vw 42vh #FFF, 184vw 154vh #FFF, 199vw 75vh #FFF, 165vw 108vh #FFF, 29vw 10vh #FFF, 190vw 185vh #FFF, 20vw 73vh #FFF, 179vw 117vh #FFF, 44vw 95vh #FFF, 26vw 191vh #FFF, 170vw 32vh #FFF, 34vw 120vh #FFF, 126vw 187vh #FFF, 49vw 121vh #FFF, 156vw 122vh #FFF, 80vw 188vh #FFF, 107vw 75vh #FFF, 60vw 195vh #FFF;
}
#stars3 {
width: 3px;
height: 3px;
background: transparent;
box-shadow: 144vw 104vh #FFF, 12vw 50vh #FFF, 28vw 153vh #FFF, 175vw 134vh #FFF, 82vw 112vh #FFF, 177vw 200vh #FFF, 45vw 154vh #FFF, 5vw 39vh #FFF, 82vw 59vh #FFF, 153vw 100vh #FFF;
animation: animStar 150s linear infinite;
}
#stars3:after {
content: " ";
position: absolute;
top: 2000px;
width: 3px;
height: 3px;
background: transparent;
box-shadow: 144vw 104vh #FFF, 12vw 50vh #FFF, 28vw 153vh #FFF, 175vw 134vh #FFF, 82vw 112vh #FFF, 177vw 200vh #FFF, 45vw 154vh #FFF, 5vw 39vh #FFF, 82vw 59vh #FFF, 153vw 100vh #FFF;
}
@keyframes animStar {
from {
transform: translateY(0px);
}
to {
transform: translateY(-2000px);
}
}