Initial commit for comfitu.re repo.
This commit is contained in:
commit
d6fb052949
BIN
Web437_IBM_VGA_8x16-2x.woff
Normal file
BIN
Web437_IBM_VGA_8x16-2x.woff
Normal file
Binary file not shown.
BIN
Web437_IBM_VGA_8x16.woff
Normal file
BIN
Web437_IBM_VGA_8x16.woff
Normal file
Binary file not shown.
88
index.html
Normal file
88
index.html
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Comfitu.re - Sweet comfy</title>
|
||||
|
||||
<link href="style.css" rel="stylesheet"/>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div class="background"></div>
|
||||
|
||||
<div class="container">
|
||||
<header>
|
||||
<pre>
|
||||
___ __ _ _
|
||||
/ __|___ _ __ / _(_) |_ _ _ _ _ ___
|
||||
| (__/ _ \ ' \| _| | _| || |_| '_/ -_) v0.1.33
|
||||
\___\___/_|_|_|_| |_|\__|\_,_(_)_| \___| by Fristi-kan
|
||||
</pre>
|
||||
<a class="active" href="#home">Home</a> | <a href="#projects">Projects</a> | <a href="#contact">Contact</a> <br/>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div id="home">
|
||||
<pre>
|
||||
( )
|
||||
( )
|
||||
( )
|
||||
( )
|
||||
) )
|
||||
( ( /\
|
||||
(_) / \ /\
|
||||
________[_]________ /\/ \/ \
|
||||
/\ /\ ______ \ / /\/\ /\/\
|
||||
/ \ //_\ \ /\ \ /\/\/ \/ \
|
||||
/\ / /\/\ //___\ \__/ \ \/
|
||||
/ \ /\/ \//_____\ \ |[]| \
|
||||
/\/\/\/ //_______\ \|__| \
|
||||
/ \ /XXXXXXXXXX\ \
|
||||
\ /_I_II I__I_\__________________\
|
||||
I_I| I__I_____[]_|_[]_____I
|
||||
I_II I__I_____[]_|_[]_____I
|
||||
I II__I I XXXXXXX I
|
||||
~~~~~" "~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
</pre>
|
||||
|
||||
<p>
|
||||
Hello, welcome to my comfy personal website! 0w0
|
||||
</p>
|
||||
|
||||
<p>
|
||||
I am a webdeveloper and general tinkerer from the Netherlands.
|
||||
Most of my time is usually spent on PHP/Laravel projects.
|
||||
In my free time I maintain my Linux server, running a number
|
||||
of services including a Pleroma microblogging instance, a Nextcloud instance,
|
||||
a Prosody XMPP instance, as well as some of my websites and some other small things.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!--<div id="projects">
|
||||
<h1>Software Projects</h1>
|
||||
</div>
|
||||
|
||||
<div id="contact">
|
||||
<h1>Contact information</h1>
|
||||
</div>
|
||||
|
||||
<div id="copyright">
|
||||
<h1>Copyright notice</h1>
|
||||
</div>-->
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<br/>
|
||||
<div style="text-align: right"><a href="#copyright">CC0</a> 2021 Comfitu.re. No rights reserved.</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
158
style.css
Normal file
158
style.css
Normal file
|
|
@ -0,0 +1,158 @@
|
|||
@font-face {
|
||||
font-family: IBMVGA8;
|
||||
src: url("Web437_IBM_VGA_8x16.woff");
|
||||
}
|
||||
|
||||
html {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.test {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left :20px;
|
||||
width: 300px;
|
||||
height: 20px;
|
||||
|
||||
border-top-left-radius: 50%;
|
||||
border-top-right-radius: 50%;
|
||||
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
.background {
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-image: url("3.jpeg");
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
.container {
|
||||
position:absolute;
|
||||
box-sizing: border-box;
|
||||
top:0;
|
||||
left:0;
|
||||
bottom:0;
|
||||
right:0;
|
||||
width: 880px;
|
||||
height: 652px;
|
||||
|
||||
padding:30px 40px;
|
||||
margin:auto;
|
||||
|
||||
background-color: rgba(31, 37, 47, 0.9);
|
||||
color: rgba(90, 228, 70, 1);
|
||||
|
||||
font-family: IBMVGA8, monospace;
|
||||
font-size: 16px;
|
||||
|
||||
line-height: 16px;
|
||||
|
||||
border-radius: 90px / 820px;
|
||||
border-style: outset;
|
||||
border-color: rgba(126, 126, 134, 1);
|
||||
border-width: 8px;
|
||||
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
header, main, footer {
|
||||
position: relative;
|
||||
margin:0;
|
||||
padding:0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
header {
|
||||
height: 96px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
main {
|
||||
height: 448px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
footer {
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgba(240,240,240, 1);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:before {
|
||||
content: '[';
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: ']';
|
||||
}
|
||||
|
||||
a:hover, a:active {
|
||||
background-color: rgba(240,240,240, 1);
|
||||
color: rgba(31, 37, 47, 0.8);
|
||||
}
|
||||
|
||||
a.active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
padding: 0;
|
||||
margin: 0 0 16px 0;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h1:before {
|
||||
content: '# ';
|
||||
}
|
||||
|
||||
h2:before {
|
||||
content: '## ';
|
||||
}
|
||||
|
||||
h3:before {
|
||||
content: '### ';
|
||||
}
|
||||
|
||||
h4:before {
|
||||
content: '#### ';
|
||||
}
|
||||
|
||||
h5:before {
|
||||
content: '##### ';
|
||||
}
|
||||
|
||||
h6:before {
|
||||
content: '###### ';
|
||||
}
|
||||
|
||||
p {
|
||||
padding:0;
|
||||
margin: 0 0 16px 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
margin:0;
|
||||
padding:0;
|
||||
font-family: IBMVGA8, monospace;
|
||||
}
|
||||
Loading…
Reference in a new issue