Compare commits
29 Commits
63c9b2b078
...
master
Author | SHA1 | Date | |
---|---|---|---|
ff067c831f | |||
ceac02720b | |||
5f6a027c46 | |||
77de4035db | |||
470fc6a948 | |||
f9a6fae90e | |||
819f46a417 | |||
7926c1b745 | |||
4bd53380d9 | |||
0bfc4d4b50 | |||
de4bd9a2cb | |||
9374a8fff3 | |||
779b189e45 | |||
6e7a5bc12a | |||
40f3f4b48f | |||
71aa9bc211 | |||
296f5f4477 | |||
e563e62c0f | |||
6f1b876937 | |||
bafaf4ea3e | |||
d362343f02 | |||
6de9533a18 | |||
3e2c7de215 | |||
f4f6f2dbe3 | |||
edf1592474 | |||
f399e0b180 | |||
1eb803a3d8 | |||
6183e87901 | |||
2df67ac8bb |
@@ -5,8 +5,11 @@
|
||||
alt: "image of mastodon logo"
|
||||
- name: listenbrainz
|
||||
href: https://listenbrainz.org/user/beppev/
|
||||
img: /img/listenbrainz.jpg
|
||||
alt: "litsenbrainz image"
|
||||
- name: myanimelist
|
||||
href: https://myanimelist.net/profile/BeppeV
|
||||
img: /img/myanimelist.jpg
|
||||
- name: gitea
|
||||
href: https://git.beppe.online/beppe
|
||||
img: /img/gitea.gif
|
||||
@@ -16,3 +19,6 @@
|
||||
- name: goodreads
|
||||
href: https://www.goodreads.com/user/show/193197549-beppe-v
|
||||
img: /img/goodreads.png
|
||||
- name: newgrounds
|
||||
href: https://8looper.newgrounds.com
|
||||
img: /img/newgrounds.gif
|
||||
|
@@ -1,7 +1,9 @@
|
||||
<footer>
|
||||
<div class="footerdiv">
|
||||
<p class="footertitle">mylinks:</p>
|
||||
<ul class="mylinks">
|
||||
{% for link in site.data.links %}
|
||||
<li>
|
||||
<li class="footerlinks">
|
||||
<a href="{{ link.href }}" {{link.otherparams}}>
|
||||
{% if link.img %}
|
||||
<img src="{{ link.img }}" alt="{{ link.alt }}">
|
||||
@@ -13,15 +15,19 @@
|
||||
{% endfor %}
|
||||
|
||||
</ul>
|
||||
<ul class="mybuttons">
|
||||
{% assign image_files = site.static_files | where: "buttons", true %}
|
||||
{% for button in image_files %}
|
||||
|
||||
<li class="button">
|
||||
{% if button.basename == "88x31" %}
|
||||
<a href="https://cyber.dabamos.de/88x31/index.html"><img src="{{ button.path }}"></a>
|
||||
{% else %}
|
||||
<img src="{{ button.path }}">
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
|
@@ -1,21 +1,6 @@
|
||||
<!-- <div class="sidebar">
|
||||
<a href="/index.html">index</a>
|
||||
<h2>my links:</h2>
|
||||
<p><a rel="me" href="https://blorbo.social/@beppe">Mastodon(my art will be here)</a></p>
|
||||
<p><a href="https://steamcommunity.com/id/bvanroll/">steam</a></p>
|
||||
<p><a href="https://letterboxd.com/beppev/">letterboxd</a></p>
|
||||
<p><a href="https://git.beppe.online/beppe">gitea</a></p>
|
||||
<a href="#" onclick="toggle(1);" >blogposts</a>
|
||||
<ul class="submenu">
|
||||
{% for post in site.posts %}
|
||||
<li><a href="{{ post.url }}">{{ post.title }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>-->
|
||||
|
||||
<nav>
|
||||
{% for item in site.data.navigation %}
|
||||
<a href="{{ iten.link }}" {% if page.url == item.link %}style="color: red;"{% endif %}>
|
||||
<a class="navlink" href="{{ iten.link }}" {{ item.link }} {% if page.url == item.link %}style="color: red;"{% endif %}>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
|
@@ -9,14 +9,16 @@
|
||||
</head>
|
||||
<body>
|
||||
<div class="header">
|
||||
<h1>
|
||||
beppe.online
|
||||
</h1>
|
||||
<a href="/"><img src="/img/logo.png"></a>
|
||||
|
||||
</div>
|
||||
{% include nav.html %}
|
||||
<div class="content">
|
||||
{{ content }}
|
||||
<div class="container">
|
||||
{% include nav.html %}
|
||||
<div class="content">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
{% include footer.html %}
|
||||
|
||||
{% include footer.html %}
|
||||
</body>
|
||||
</html>
|
||||
|
185
css/main.css
185
css/main.css
@@ -1,149 +1,68 @@
|
||||
/*
|
||||
@import url(https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css);
|
||||
|
||||
body {
|
||||
font-family: "Fira Code", monospace;
|
||||
color: black;
|
||||
background: #201b1a;
|
||||
background-attachment: local;
|
||||
background-position: top;
|
||||
background-image: url("/img/background.jpg");
|
||||
}
|
||||
|
||||
|
||||
.header {
|
||||
padding: 2.5em;
|
||||
}
|
||||
|
||||
.header a {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.header img {
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 2em;
|
||||
/*text-shadow: -1px -1px 0 #000, 1px -1px #000, -1px 1px #000, 1px 1px #000;*/
|
||||
/*display: grid;*/
|
||||
/*background: #2e2828;
|
||||
}
|
||||
|
||||
a:link {
|
||||
color: black;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #111;
|
||||
}
|
||||
|
||||
|
||||
a:hover {
|
||||
color: #111;
|
||||
}
|
||||
|
||||
|
||||
a:active {
|
||||
color: #111;
|
||||
}
|
||||
|
||||
* {
|
||||
}
|
||||
*/
|
||||
/*.header {*/
|
||||
/*height: 10vh;*/
|
||||
/*float: left;*/
|
||||
/* text-align: center;
|
||||
background: #DDD;
|
||||
border-radius: 16px;
|
||||
width:100%;
|
||||
padding:1em;
|
||||
padding-left: .2em;
|
||||
padding-right:.2em;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width:20%;
|
||||
float: left;
|
||||
background: #DDD;
|
||||
border-radius:16px;
|
||||
padding:1em;
|
||||
margin-top: 2em;
|
||||
|
||||
}
|
||||
|
||||
.content {
|
||||
float: right;
|
||||
width: 70%;
|
||||
margin-top: 2em;
|
||||
background: #DDD;
|
||||
padding:1em;
|
||||
border-radius: 16px;
|
||||
}
|
||||
*/
|
||||
|
||||
/*.navbar_links {
|
||||
/*display: grid;*/
|
||||
/*grid-template-columns: auto auto;*/
|
||||
/* list-style: none;
|
||||
}*/
|
||||
/*
|
||||
iframe {
|
||||
}
|
||||
|
||||
.navbar_link {
|
||||
width:10em;
|
||||
display: table-cell;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
* {
|
||||
|
||||
}
|
||||
|
||||
#queen {
|
||||
width: 20em;
|
||||
border: black;
|
||||
padding: .3em;
|
||||
border-style: double;
|
||||
background: white;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#susie {
|
||||
height: 5em;
|
||||
}
|
||||
|
||||
#glados {
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 90%;
|
||||
height: 400px;
|
||||
margin: 3%;
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px){
|
||||
.sidebar {width:100%}
|
||||
.content {width:100%}
|
||||
|
||||
}
|
||||
|
||||
footer {
|
||||
display: inline-block;
|
||||
width: 98%;
|
||||
border-radius: 16px;
|
||||
padding:1em;
|
||||
margin-left: 0%;
|
||||
margin-top: 5em;
|
||||
background: #DDD;
|
||||
img {
|
||||
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
body {
|
||||
background: black;
|
||||
}
|
||||
|
||||
nav {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: white;
|
||||
.navlink {
|
||||
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 30em;
|
||||
margin-left: 8em;
|
||||
height: 40em;
|
||||
overflow: scroll;
|
||||
scrollbar-width: none;
|
||||
padding: 2em;
|
||||
|
||||
background: white;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 1em;
|
||||
|
||||
background: white;
|
||||
}
|
||||
|
||||
.footerdiv {
|
||||
width: 50em;
|
||||
|
||||
}
|
||||
|
||||
.footerdiv > p {
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.footerlinks {
|
||||
display: inline-block;
|
||||
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-block;
|
||||
}
|
||||
|
BIN
img/background.jpg
Normal file
BIN
img/background.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 171 KiB |
BIN
img/listenbrainz.jpg
Normal file
BIN
img/listenbrainz.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 5.9 KiB |
BIN
img/logo.png
Normal file
BIN
img/logo.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 33 KiB |
BIN
img/myanimelist.jpg
Normal file
BIN
img/myanimelist.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 5.6 KiB |
BIN
img/newgrounds.gif
Normal file
BIN
img/newgrounds.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.4 KiB |
14
index.html
14
index.html
@@ -3,26 +3,20 @@ layout: default
|
||||
title: home
|
||||
---
|
||||
|
||||
<img src="img/queen.gif" id="queen">
|
||||
<img src="img/queen.gif" id="queen" style="/* display: inline-block; */ width: 12em; float: right; margin-left: 2em;">
|
||||
<h1> Welcome! </h1>
|
||||
<p>Welcome to my webpage! If you don't know me (how did you get here?) i'm beppe, a (currentyear - 1996) year old sysdamin from the ghent area in belgium! I like to draw/paint, play guitar, play games, read comics and manga, i like watching movies too, and anime and tv shows! Oh and i really like riding my bycicle!
|
||||
<p>If you don't know me (how did you get here?) i'm beppe, a sysdamin from belgium! I like to draw/paint, play guitar, play games, read comics and manga, i like watching movies too, and anime and tv shows! Oh and i really like riding my bycicle!
|
||||
|
||||
<h2> what's coming </h2>
|
||||
|
||||
|
||||
<img src="img/glados.gif" id="glados" style="/* display: inline-block; */ float: left; margin-right: 2em;">
|
||||
<p>
|
||||
I wanna spice up the website, but i'm really bad at doing visual stuff. at least when it's not code based. so maybe i'll write some code that makes the site look cooler :p but for now i'm bedrotting :p
|
||||
</p>
|
||||
<img src="img/glados.gif" id="glados">
|
||||
<p> oh, and another thing i'm gonna do is just to write a bunch of paragraphs on this page and get a link system kindof like wikipedia when you read a huge article on that. something like that is the plan :p</p>
|
||||
<p>
|
||||
also i wanna make it so my pico8 games are playable in the browser here on a seperate page. so i'm gonna work on that too.
|
||||
</p>
|
||||
|
||||
<h2>
|
||||
update: i did it!
|
||||
<img src="img/susie.gif" id="susie">
|
||||
</h2>
|
||||
<p> here are all the pico 8 games i've hosted on my site so far: </p>
|
||||
<a href="games/lou.html">lou</a>
|
||||
|
||||
|
||||
|
Reference in New Issue
Block a user