Update donation popup and update links going to /donate/

This commit is contained in:
Emi
2025-01-03 19:56:43 +01:00
parent 84ec3f348c
commit 44f8e37f87
9 changed files with 187 additions and 285 deletions

View File

@@ -57,9 +57,11 @@
<a class="card-download-other" href="/download/archive/{{ release_version.name }}-{{ release_version.flavor }}">
Export templates and other downloads
</a>
<a class="card-download-donate" href="/donate/">
<a class="card-download-donate" href="https://fund.godotengine.org/">
Make a Donation
</a>
</div>
</div>
{% include thankyou.html %}

177
_includes/thankyou.html Normal file
View File

@@ -0,0 +1,177 @@
<style>
.thankyou-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.85);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 10;
}
.thankyou {
background: var(--base-color);
box-shadow: var(--more-shadow);
padding: 30px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
position: relative;
border-radius: 13px;
}
.thankyou-reading {
font-size: 16px;
}
.thankyou-reading-list {
font-size: 16px;
margin: 0;
margin-left: 48px;
padding-left: 0;
}
.thankyou-donate {
margin-bottom: 24px;
text-align: center;
}
.btn.btn-donate {
background-color: var(--primary-color);
color: hsla(0, 0%, 100%, 0.9);
font-size: 22px;
font-weight: 600;
margin-bottom: 26px;
}
.thankyou h2 {
text-shadow: var(--base-shadow);
font-size: 36px;
font-weight: 800;
margin-bottom: 12px;
}
.thankyou h2 .anchored-link {
/* Hiding the anchored text automatically added on blogposts */
display: none !important;
}
.thankyou p {
max-width: 620px;
font-size: 25px;
}
@media (max-width: 768px) {
.thankyou-wrapper {
display: block;
}
.thankyou {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: scroll;
padding: 30px 40px 18px 40px;
}
.thankyou-reading-list {
margin-left: 24px;
}
.btn-close-thankyou-popup {
width: 48px;
height: 48px;
display: flex;
justify-content: center;
align-items: center;
}
}
.btn-close-thankyou-popup {
cursor: pointer;
position: absolute;
top: 12px;
right: 12px;
}
.btn-close-thankyou-popup img {
background: transparent !important; /* for overwriting the style in the blogposts img */
}
@media (prefers-color-scheme: light) {
.btn-close-thankyou-popup img {
filter: invert(1);
opacity: 0.75;
}
}
</style>
<script>
document.addEventListener('DOMContentLoaded', () => {
const thankYouWrapper = document.getElementById('thank-you');
// Close itself, when clicked outside of the popup area.
thankYouWrapper.addEventListener('click', (e) => {
if (e.target === thankYouWrapper) {
thankYouWrapper.style.display = 'none';
}
});
// Close with a close button.
const thankYouBackButton = document.querySelector('.btn-close-thankyou-popup');
thankYouBackButton.addEventListener('click', () => {
thankYouWrapper.style.display = 'none';
});
// Open from the main download buttons.
const downloadButtons = document.querySelectorAll('.btn-download');
downloadButtons.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
document.querySelector('.btn.btn-donate').focus();
});
});
// Open from the all downloads list.
const downloadLinks = document.querySelectorAll('.download-link');
downloadLinks.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
});
});
// Close the dialog when the user presses the escape key.
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
thankYouWrapper.style.display = 'none';
}
});
});
</script>
<div class="thankyou-wrapper" id="thank-you" style="display: none;">
<div class="thankyou">
<h2>Godot is downloading...</h2>
<p class="thankyou-donate">
Godot exists thanks to donations from people like you. Help us continue our work:
</p>
<a href="https://fund.godotengine.org" class="btn btn-donate">
Make a Donation
</a>
<div class="btn-close-thankyou-popup">
<img src="/assets/icons/cross.svg" width="24" height="24" alt="Close this popup" class="lightbox-ignore">
</div>
</div>
</div>

View File

@@ -306,90 +306,6 @@ layout: default
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
const thankYouWrapper = document.getElementById('thank-you');
// Close itself, when clicked outside of the popup area.
thankYouWrapper.addEventListener('click', (e) => {
if (e.target === thankYouWrapper) {
thankYouWrapper.style.display = 'none';
}
});
// Close with a close button.
const thankYouBackButton = document.querySelector('.btn-back-to-downloads');
thankYouBackButton.addEventListener('click', () => {
thankYouWrapper.style.display = 'none';
});
// Open from the main download buttons.
const downloadButtons = document.querySelectorAll('.btn-download');
downloadButtons.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
document.querySelector('.btn.btn-donate').focus();
});
});
// Open from the all downloads list.
const downloadLinks = document.querySelectorAll('.download-link');
downloadLinks.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
});
});
// Close the dialog when the user presses the escape key.
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
thankYouWrapper.style.display = 'none';
}
});
});
</script>
<div class="thankyou-wrapper" id="thank-you" style="display:none">
<div class="thankyou">
<h2>Godot is downloading!</h2>
<p class="thankyou-donate">
Godot exists thanks to people like you! Consider supporting continued development of the engine with a donation.
</p>
<a href="https://fund.godotengine.org" class="btn btn-donate">
Make a Donation
</a>
<h3>Thank you!</h3>
<hr style="width:65%">
<p class="thankyou-reading">
If this is your first time using the Godot Engine, take a look at our beginner resources:
</p>
<ul class="thankyou-reading-list">
<li>
A comprehensive
<a href="https://docs.godotengine.org/en/stable/getting_started/step_by_step/">Step by Step tutorial</a>
for 2D and 3D.
</li>
<li>
A collection of
<a href="https://godotengine.org/asset-library/asset?category=10&support[official]=1">official demo projects</a>
showcasing some of the engine features.
</li>
<li>
A guide to install Godot on
<a href="https://docs.godotengine.org/en/stable/about/faq.html#linux">Linux</a>,
<a href="https://docs.godotengine.org/en/stable/about/faq.html#windows">Windows</a>,
and
<a href="https://docs.godotengine.org/en/stable/about/faq.html#macos">macOS</a>.
</li>
</ul>
<div class="btn-back-to-downloads">
<img src="/assets/icons/cross.svg" width="24" height="24" alt="Close this popup">
</div>
</div>
</div>
{% include thankyou.html %}
{% include footer.html %}

View File

@@ -293,90 +293,6 @@ layout: default
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
const thankYouWrapper = document.getElementById('thank-you');
// Close itself, when clicked outside of the popup area.
thankYouWrapper.addEventListener('click', (e) => {
if (e.target === thankYouWrapper) {
thankYouWrapper.style.display = 'none';
}
});
// Close with a close button.
const thankYouBackButton = document.querySelector('.btn-back-to-downloads');
thankYouBackButton.addEventListener('click', () => {
thankYouWrapper.style.display = 'none';
});
// Open from the main download buttons.
const downloadButtons = document.querySelectorAll('.btn-download');
downloadButtons.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
document.querySelector('.btn.btn-donate').focus();
});
});
// Open from the all downloads list.
const downloadLinks = document.querySelectorAll('.download-link');
downloadLinks.forEach((it) => {
it.addEventListener('click', () => {
thankYouWrapper.style.display = '';
});
});
// Close the dialog when the user presses the escape key.
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
thankYouWrapper.style.display = 'none';
}
});
});
</script>
<div class="thankyou-wrapper" id="thank-you" style="display:none">
<div class="thankyou">
<h2>Godot is downloading!</h2>
<p class="thankyou-donate">
Godot exists thanks to people like you! Consider supporting continued development of the engine with a donation.
</p>
<a href="/donate/" class="btn btn-donate">
Make a Donation
</a>
<h3>Thank you!</h3>
<hr style="width:65%">
<p class="thankyou-reading">
If this is your first time using the Godot Engine, take a look at our beginner resources:
</p>
<ul class="thankyou-reading-list">
<li>
A comprehensive
<a href="https://docs.godotengine.org/en/stable/getting_started/step_by_step/">Step by Step tutorial</a>
for 2D and 3D.
</li>
<li>
A collection of
<a href="https://godotengine.org/asset-library/asset?category=10&support[official]=1">official demo projects</a>
showcasing some of the engine features.
</li>
<li>
A guide to install Godot on
<a href="https://docs.godotengine.org/en/stable/about/faq.html#linux">Linux</a>,
<a href="https://docs.godotengine.org/en/stable/about/faq.html#windows">Windows</a>,
and
<a href="https://docs.godotengine.org/en/stable/about/faq.html#macos">macOS</a>.
</li>
</ul>
<div class="btn-back-to-downloads">
<img src="/assets/icons/cross.svg" width="24" height="24" alt="Close this popup">
</div>
</div>
</div>
{% include thankyou.html %}
{% include footer.html %}

View File

@@ -299,112 +299,3 @@
gap: 8px;
}
}
.thankyou-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.45);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 10;
}
.thankyou {
background: var(--base-color);
box-shadow: var(--more-shadow);
padding: 40px 60px 26px 60px;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.thankyou-reading {
font-size: 16px;
}
.thankyou-reading-list {
font-size: 16px;
margin: 0;
margin-left: 48px;
padding-left: 0;
}
.thankyou-donate {
margin-bottom: 24px;
text-align: center;
}
.btn.btn-donate {
background-color: var(--primary-color);
color: hsla(0, 0%, 100%, 0.9);
font-size: 22px;
font-weight: 600;
margin-bottom: 26px;
}
.btn-back-to-downloads {
cursor: pointer;
position: absolute;
top: 12px;
right: 12px;
}
@media (prefers-color-scheme: light) {
.btn-back-to-downloads img {
filter: invert(1);
opacity: 0.75;
}
}
.thankyou h2 {
text-shadow: var(--base-shadow);
font-size: 36px;
font-weight: 600;
margin-bottom: 12px;
}
.thankyou h3 {
font-size: 24px;
margin-bottom: 0;
}
.thankyou p {
max-width: 620px;
}
.thankyou hr {
margin: 28px 0 8px 0;
}
@media (max-width: 768px) {
.thankyou-wrapper {
display: block;
}
.thankyou {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: scroll;
padding: 30px 40px 18px 40px;
}
.thankyou-reading-list {
margin-left: 24px;
}
.btn-back-to-downloads {
width: 48px;
height: 48px;
display: flex;
justify-content: center;
align-items: center;
}
}

View File

@@ -29,7 +29,7 @@ For more details, grab a cup of something strong and enjoy browsing through the
## Giving back<!-- omit in toc -->
As a community effort, Godot relies on individual contributors to improve. In recent years, [user and company donations](/donate/) enabled us to also hire a number of core contributors to work more hours on the engine, and allow us to finalize the Godot 4.0 release faster. As a result, our monthly expenses are higher than our monthly income and we have relied on large one-time donations to fund development. Currently, we need a lot more [monthly donations](/donate/) to be able to sustain the pace we've had for the 4.0 development cycle, not to mention the need to hire more contributors to focus on key areas which are currently missing a maintainer.
As a community effort, Godot relies on individual contributors to improve. In recent years, [user and company donations](https://fund.godotengine.org/) enabled us to also hire a number of core contributors to work more hours on the engine, and allow us to finalize the Godot 4.0 release faster. As a result, our monthly expenses are higher than our monthly income and we have relied on large one-time donations to fund development. Currently, we need a lot more [monthly donations](https://fund.godotengine.org/) to be able to sustain the pace we've had for the 4.0 development cycle, not to mention the need to hire more contributors to focus on key areas which are currently missing a maintainer.
Besides financial support, you can also give back by: writing high-quality bug reports, contributing to the code base, writing documentation, writing tutorials (for the docs or on your own space), and supporting others on the various [community platforms](https://docs.godotengine.org/en/latest/community/channels.html) by answering questions and providing helpful tips.

View File

@@ -23,9 +23,9 @@ For most games and apps made with 4.0 it should be relatively safe to migrate to
## Giving back
As a community effort, Godot relies on individual contributors to improve. In recent years, [user and company donations](https://godotengine.org/donate/) allowed us to also hire a number of core contributors to work full-time on the engine and bring you these fast-paced releases.
As a community effort, Godot relies on individual contributors to improve. In recent years, [user and company donations](https://fund.godotengine.org/) allowed us to also hire a number of core contributors to work full-time on the engine and bring you these fast-paced releases.
Our monthly expenses remain higher than monthly donations, and we still depend on large one-time company donations to fund development. Currently, we need a lot more [monthly donations](https://godotengine.org/donate/) to keep up the pace with Godot 4 updates, not to mention the need to hire more maintainers to review every contribution.
Our monthly expenses remain higher than monthly donations, and we still depend on large one-time company donations to fund development. Currently, we need a lot more [monthly donations](https://fund.godotengine.org/) to keep up the pace with Godot 4 updates, not to mention the need to hire more maintainers to review every contribution.
Besides financial support, you can also give back by: writing detailed bug reports, contributing to the code base, writing documentation, writing guides (for the docs or on your own website), and supporting others on the various [community platforms](https://docs.godotengine.org/en/latest/community/channels.html) by answering questions and providing helpful tips.

View File

@@ -19,7 +19,7 @@ Please read on to learn about the most exciting additions in Godot 4.2, or click
## Giving back
As a community project, Godot is maintained by the efforts of volunteers. Thanks to [user and company donations](https://godotengine.org/donate/) we are able to hire and sponsor a number of core contributors to work full-time and dedicate their undivided attention to the needs of the project.
As a community project, Godot is maintained by the efforts of volunteers. Thanks to [user and company donations](https://fund.godotengine.org/) we are able to hire and sponsor a number of core contributors to work full-time and dedicate their undivided attention to the needs of the project.
Please consider supporting the project financially with a [recurring monthly donation](https://fund.godotengine.org/), if you are able. Godot continues to grow with each passing month, and we are committed to bringing you reliable and feature-rich releases as often as we can, to facilitate creative work of game developers of all levels. Recurring donations make sure the project is sustainable and its development can be planned for years ahead.

View File

@@ -36,7 +36,7 @@ current_tab: "privacy-policy"
<li>you visit the Godot web site (<a href="/">godotengine.org</a>);</li>
<li>you access the Asset Library in the Godot editor application to browse or download assets;</li>
<li>you sign up as a Godot Patreon (<a href="https://patreon.com/godotengine">https://patreon.com/godotengine</a>)
or otherwise donate to Godot (<a href="/donate/">https://godotengine.org/donate</a>);</li>
or otherwise donate to Godot (<a href="https://fund.godotengine.org/">https://fund.godotengine.org/</a>);</li>
<li>you sign up and log in to an account on the Godot Chat platform (<a
href="https://chat.godotengine.org">https://chat.godotengine.org</a>), and use it to participate in private and
public discussions;</li>