cozytown/website
cozytown/website
3
0
Fork 0
Code Issues Pull requests Releases Activity

still concept; still not standardized html

Browse source
This commit is contained in:
Vrifox 2020-12-27 20:19:40 +01:00
parent 2cb70b0fe7
commit 9d31171f73
Signed by: vrifox
GPG key ID: D40098E5B60B2197
3 changed files with 33 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
index.css
View file

@ -13,15 +13,15 @@ html {
overflow: hidden; overflow: hidden;
} }
body { body {
background: #28283c; background: rgb(30, 30, 40);
color: #f5f5ff; color: rgb(245, 245, 255);
font-family: 'Lucida Console', 'Courier New', monospace; font-family: 'Lucida Console', 'Courier New', monospace;
line-height: 1.8; line-height: 1.8;
margin: 0; margin: 0;
scroll-behaviour: smooth; scroll-behaviour: smooth;
} }
solarsystem { solarsystem {
background: linear-gradient(rgb(5, 5, 50), rgb(200, 65, 65)); background: url(stars.png);
display: block; display: block;
min-height: 100vh; min-height: 100vh;
overflow: hidden; overflow: hidden;
@ -31,21 +31,31 @@ solarsystem > h1 {
text-align: center; text-align: center;
} }
planet { planet {
background: rgb(240, 120, 120); background: linear-gradient(-60deg, rgb(30, 30, 40), rgb(27, 56, 70) 200%);
border-radius: 100%; border-radius: 100%;
bottom: 0; bottom: 50vh;
height: 1000vh; height: 60vh;
left: 50%; left: 70vw;
position: absolute; position: absolute;
transform: translate(-50%,97%); transform: translate(-50%,50%);
width: 1000vh; width: 60vh;
}
moon {
background: linear-gradient(-60deg, rgb(20, 23, 28), rgb(108, 97, 97));
border-radius: 100%;
height: 4vh;
position: absolute;
right: 16vh;
top: 20vh;
width: 4vh;
} }
surface { surface {
height: 30vh; background: linear-gradient(rgb(68, 43, 43), rgb(0, 0, 0));
bottom: 0;
height: 50vh;
left: 50%; left: 50%;
position: absolute; position: absolute;
top: 0; transform: translate(-50vw, 0);
transform: translate(-50%, 0);
width: 100vw; width: 100vw;
} }
sign { sign {
@ -62,9 +72,9 @@ sign {
to { transform: translate(-50%,0) rotate(10deg); } to { transform: translate(-50%,0) rotate(10deg); }
} }
sign content { sign content {
background: #d5664c; background: rgb(98, 49, 37);
border: 5px outset #dd4949; border: 5px outset rgb(49, 17, 17);
color: #ffe9e9; color: rgb(193, 193, 193);
display: block; display: block;
height: 200px; height: 200px;
overflow: hidden; overflow: hidden;
@ -72,7 +82,7 @@ sign content {
width: 300px; width: 300px;
} }
sign pole { sign pole {
background: linear-gradient(#4d0000, rgb(135, 35, 35)); background: linear-gradient(rgb(32, 11, 11), rgb(47, 27, 27));
border-radius: 0 0 20px 5px; border-radius: 0 0 20px 5px;
bottom: 0; bottom: 0;
content: ''; content: '';
@ -93,12 +103,3 @@ sun {
top: 18vh; top: 18vh;
width: 5vh; width: 5vh;
} }
moon {
background: rgb(129, 141, 142);
border-radius: 100%;
height: 4vh;
position: absolute;
right: 16vh;
top: 30vh;
width: 4vh;
}

5
index.html
View file

@ -9,17 +9,16 @@
</head> </head>
<body> <body>
<solarsystem> <solarsystem>
<h1>cozy.town</h1>
<planet> <planet>
<moon></moon>
</planet>
<surface> <surface>
<sign> <sign>
<content>It's not cozy here for now, this little universe has to form itself first. :)</content> <content>It's not cozy here for now, this little universe has to form itself first. :)</content>
<pole></pole> <pole></pole>
</sign> </sign>
</surface> </surface>
</planet>
<sun></sun> <sun></sun>
<moon></moon>
</solarsystem> </solarsystem>
</body> </body>
</html> </html>

BIN
stars.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 336 B