diff options
| -rw-r--r-- | LICENCE | 21 | ||||
| -rw-r--r-- | index.html | 29 | ||||
| -rw-r--r-- | style.css | 59 |
3 files changed, 109 insertions, 0 deletions
@@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2021 Loek Le Blansch + +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. diff --git a/index.html b/index.html new file mode 100644 index 0000000..0b4b59f --- /dev/null +++ b/index.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset='utf-8'> + <meta http-equiv='X-UA-Compatible' content='IE=edge'> + <title>Welcome to pipeframe.xyz</title> + <meta name='viewport' content='width=device-width, initial-scale=1'> + <link rel='stylesheet' type='text/css' media='screen' href='style.css'> +</head> +<body> + <div class="centeredpage"> + <h1>Welcome to <span style="color: var(--gold-crayola)">pipeframe.xyz</span></h1> + <p style="text-align: center"> + <a target="_blank" href="https://github.com/lonkaars"><img alt="GitHub followers" src="https://img.shields.io/github/followers/lonkaars?style=social"></a> + </p> + <p> + This is my personal website on which I host some cool things. Most of my projects are hosted on <a target="_blank" href="https://github.com/lonkaars">my GitHub</a>. I'm working on a blog, but for now these are the things hosted on here: + </p> + <ul> + <li>My <a target="_blank" href="https://bitwarden.pipeframe.xyz">bitwarden</a> instance</li> + <li>My <a target="_blank" href="https://git.pipeframe.xyz">git</a> server</li> + <li>My minecraft server <code>minecraft.pipeframe.xyz</code> (invite-only)</li> + <li>My <a target="_blank" href="https://filestash.pipeframe.xyz">filestash</a> instance</li> + <li>An <a target="_blank" href="https://etesync.pipeframe.xyz">etesync</a> server</li> + </ul> + I'm also working on <a target="_blank" href="https://github.com/lonkaars/po-4-op-een-rij">a connect 4 website</a>. This was originally a simple school project, but I decided to go overboard and try to show off as much as I can. It's not finished yet, and has a lot of security issues, but I'm taking it on as my 'summer break project' so that's also going to be hosted on this domain when it's semi-safe to run publicly. + </div> +</body> +</html> diff --git a/style.css b/style.css new file mode 100644 index 0000000..f61ea8e --- /dev/null +++ b/style.css @@ -0,0 +1,59 @@ +:root { + --black: #000000; + --flame: #f46e42; + --lavender-blush: #eee5e9; + --gray-web: #7c7c7c; + --gold-crayola: #efc88b; + + --bg: var(--black); + --fg: var(--lavender-blush); +} + +@media (prefers-color-scheme: light) { + :root { + --flame: #cf5c36; + --gold-crayola: #b5863b; + + --bg: var(--lavender-blush); + --fg: var(--black); + } +} + +body, html { + margin: 0; + padding: 0; + + background-color: var(--bg); + color: var(--fg); + font-family: "Inter", sans-serif; +} + +.centeredpage { + max-width: 700px; + margin: 0 auto; + padding: 0 24px; + + text-align: justify; +} + +h1 { + text-align: center; + font-size: 75px; + font-weight: 700; +} + +a { color: var(--flame); } + +code { + font-family: "JetBrainsMono Nerd Font", "JetBrainsMono", monospace; + color: var(--gold-crayola); +} + +p, ul { + margin: 30px 0; +} + +ul { + line-height: 1.7; +} + |