Ellpeck
/
Web
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

added a support section to the website
Web/pipeline/head This commit looks good Details

This commit is contained in:
Ell 2022-03-05 14:24:45 +01:00
parent b845186f2d
commit 490844c5cf
6 changed files with 68 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
main/.htaccess
View File

@ -21,6 +21,8 @@ RewriteRule ^foefrenzy/?$ "https://store.steampowered.com/app/1194170/" [R=301,L
# anchor redirects
RewriteRule ^projects/?$ "https://ellpeck.de/#projects" [R=301,L,NE]
RewriteRule ^blog/?$ "https://ellpeck.de/#blog" [R=301,L,NE]
RewriteRule ^support/?$ "https://ellpeck.de/#support" [R=301,L,NE]
RewriteRule ^💸/?$ "https://ellpeck.de/#support" [R=301,L,NE]
# actually additions redirects
RewriteRule ^actaddchangelog/?$ "https://github.com/Ellpeck/ActuallyAdditions/blob/main/update/changelog.md" [R=301,L]

25
main/_data/support.json Normal file
View File

@ -0,0 +1,25 @@
[{
"name": "☕ Buy me a Coffee",
"text": "Ko-fi is a great site that allows you to send me just enough money to buy a coffee. And I love those. You can also use it to send monthly payments, but the other sites in this list are usually better for that.",
"links": [{
"name": "Take me there",
"link": "https://ko-fi.com/ellpeck"
}]
}, {
"name": "⭐ Become a Patron",
"text": "Patreon allows you to support me on a monthly basis with an amount of money of your choosing. You can also get fun rewards, like player accessories to impress your friends when using my Minecraft mods!",
"links": [{
"name": "Take me there",
"link": "https://patreon.com/Ellpeck"
}]
}, {
"name": "💻 Sponsor on GitHub",
"text": "GitHub Sponsors is basically Patreon for programmers, and it provides a monthly support option, but it also allows you to make one-time payments. Here, you can get the same rewards as you get on Patreon.",
"links": [{
"name": "Sponsor monthly",
"link": "https://github.com/sponsors/Ellpeck?frequency=recurring"
}, {
"name": "Sponsor once",
"link": "https://github.com/sponsors/Ellpeck?frequency=one-time"
}]
}]

3
main/_includes/nav/indexnav.html
View File

@ -1,4 +1,5 @@
<a class="nav-item nav-link" href="#projects">💻 Projects</a>
<a class="nav-item nav-link" href="#social">🔗 Social</a>
<a class="nav-item nav-link" href="#about">💬 About</a>
<a class="nav-item nav-link" href="#blog">📔 Blog</a>
<a class="nav-item nav-link" href="#blog">📔 Blog</a>
<a class="nav-item nav-link" href="#support">💸 Support</a>

31
main/_includes/support.html Normal file
View File

@ -0,0 +1,31 @@
<span class="anchor" id="support"></span>
<div class="list-display rounded">
<h1>💸 Support</h1>
<p>
Most of the projects you know me from, I work on in my free time, but by supporting me, you help out with all of my projects equally. As I'm a student, a bit of extra cash is always helpful for me, and it feels especially good when it comes from something that I enjoy doing a lot.
<br><span class="text-muted">Please only support me if you have money to spare. Always take care of your own finances first.</span>
</p>
<div id="support-list">
{% for item in site.data.support %}
<div class="card bg-light support-entry rounded-0">
<div class="card-body">
<h4 class="card-title">{{ item.name }}</h4>
<p class="card-text">{{ item.text }}</p>
{%- for link in item.links -%}
<a href="{{ link.link }}" class="card-link btn rounded-0 btn-outline-dark">{{ link.name }}</a>
{%- endfor -%}
</div>
</div>
{% endfor %}
</div>
<script>
if (dark) {
$("#support-list").find(".btn-outline-dark").each(function () {
let e = $(this);
e.removeClass("btn-outline-dark");
e.addClass("btn-outline-light");
});
}
</script>
</div>

21
main/index.html
View File

@ -10,28 +10,12 @@ nav: nav/indexnav.html
<div class="container">
<div class="row">
<div class="col-md-auto">
<img src="./res/me.jpeg" class="rounded-circle" width="200" height="200" id="navbar-image" alt="A cover photo of Ellpeck">
<img src="./res/me.jpeg" class="rounded-circle" width="150" height="150" id="navbar-image" alt="A cover photo of Ellpeck">
</div>
<div class="col">
<h1 class="display-4" id="intro-text"></h1>
<script src="./scripts/greet.js"></script>
<p class="lead">Welcome to my little website! I'm Ellpeck, a student and programmer from Germany. I do a lot of stuff, actually. My life is pretty busy.</p>
<!-- Donation buttons -->
<div id="donation-buttons">
<a href="https://github.com/sponsors/Ellpeck" class="card-link btn rounded-0 btn-outline-primary">❤️ Sponsor on GitHub</a>
<a href="https://patreon.com/Ellpeck" class="card-link btn rounded-0 btn-outline-primary">⭐ Become a Patron</a>
<a href="https://ko-fi.com/ellpeck" class="card-link btn rounded-0 btn-outline-primary">☕ Buy me a Coffee</a>
</div>
<script>
if (dark) {
$("#donation-buttons").find(".btn-outline-primary").each(function () {
let e = $(this);
e.removeClass("btn-outline-primary");
e.addClass("btn-outline-info");
});
}
</script>
</div>
</div>
</div>
@ -40,4 +24,5 @@ nav: nav/indexnav.html
{% include projects.html %}
{% include social.html %}
{% include about.html %}
{% include blog.html %}
{% include blog.html %}
{% include support.html %}

5
main/style/style.css
View File

@ -234,6 +234,11 @@ pre.highlight {
padding: 15px;
}
.support-entry {
margin-top: 20px;
}
@media(max-width: 1199px) {
.blog-title {
margin-top: 15px;