Skip to content

Commit

Permalink
Add a download card for use in articles
Browse files Browse the repository at this point in the history
  • Loading branch information
YuriSizov committed Oct 25, 2023
1 parent 6a43e5c commit 9863552
Show file tree
Hide file tree
Showing 12 changed files with 254 additions and 53 deletions.
65 changes: 65 additions & 0 deletions _includes/articles/download_card.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
{% assign release_version = include.version | make_release_version: include.release %}
{% if include.page %}
{% assign release_article = page %}
{% else %}
{% assign release_article = site.article | find: "url", release_version.release_notes %}
{% endif %}

<div class="card card-download">
<a class="card-download-link" href="/download/archive/{{ release_version.name }}-{{ release_version.flavor }}">
Download Godot {{ release_version.name }} {{ release_version.flavor }}
</a>

<div class="card-download-details">
{% unless release_article == empty %}
<img class="lightbox-ignore" src="{{ release_article.image }}" />
{% endunless %}

<div class="card-download-platforms">
{% assign download_primary = release_version | get_download_primary: false %}
{% for primary in download_primary %}
{% comment %}
When iterating over a hash, you get an array. 0-th item is the key, and
1-st item is the value.
{% endcomment %}

{% if primary[0] == "linux" or primary[0] == "macos" or primary[0] == "windows" %}
{% assign platform_info = site.data.download_platforms | find: "name", primary[1] %}

<div class="download-platform">
<img width="24" height="24" src="/assets/images/platforms/{{ primary[0] | split: "_" | join: "-" }}.svg" title="{{ platform_info.title }}" alt="{{ platform_info.title }}" class="lightbox-ignore" />
{{ platform_info.title }}
</div>

<a href="{{ release_version | make_download: primary[1], false, "github_builds" }}" class="btn btn-download btn-download-primary">
<div class="download-title">
Standard
</div>
</a>

{% assign mono_download = release_version | make_download: primary[1], true, "github_builds" %}
{% if mono_download == "#" %}
<div></div>
{% else %}
{% assign has_mono = true %}
<a href="{{ mono_download }}" class="btn btn-download btn-download-primary btn-download-primary--mono">
<div class="download-title">
.NET
</div>
</a>
{% endif %}
{% endif %}
{% endfor %}
</div>
</div>

<div class="card-download-sublinks">
<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">
Make a Donation
</a>
</div>

</div>
File renamed without changes.
5 changes: 5 additions & 0 deletions _includes/articles/prerelease_notice.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
<div class="card card-warning">
<p>
While engine maintainers try their best to ensure that each beta release is stable, this is by definition <strong>a pre-release piece of software</strong>. Be sure to make frequent backups, or use a version control system such as Git, to preserve your projects in a case of corruption or data loss.
</p>
</div>
7 changes: 6 additions & 1 deletion _layouts/article.html
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ <h1>
</div>
</div>

{% include outdated_article_notice.html %}
{% include articles/outdated_notice.html %}

<div class="article-body">
{{ content }}
Expand All @@ -198,6 +198,7 @@ <h1>
</div>

<link rel="stylesheet" href="/assets/css/anchor-link.css?1">
<link rel="stylesheet" href="/assets/css/article-cards.css">
<script src="/assets/js/anchor-link.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
Expand All @@ -206,6 +207,10 @@ <h1>

// Add lightbox elements in blog articles for Tobii.
document.querySelectorAll('.article-cover img, .article-body img').forEach((articleImg) => {
if (articleImg.classList.contains('lightbox-ignore')) {
return;
}

const lightbox = document.createElement('a');
lightbox.href = articleImg.src;
lightbox.classList.add('lightbox');
Expand Down
33 changes: 27 additions & 6 deletions _plugins/make_download.rb
Original file line number Diff line number Diff line change
Expand Up @@ -108,14 +108,35 @@ def make_download(input, platform, mono = false, host = "github")
end

def make_release_version(input, release)
if release.nil?
return input
site_data = @context.registers[:site].data

version_data = input
# Input can be a version string, e.g. 4.1. Try to match it against version data.
if input.is_a? String
version_data = site_data["versions"].find { |item| item["name"] == input }
end
if version_data.nil?
return nil
end

release_data = release
# Release name can be a string as well. Try to match it with the current version flavor
# or with one of previous releases.
if release.is_a? String
if version_data["flavor"] == release
release_data = nil
elsif version_data.key?("releases")
release_data = version_data["releases"].find { |item| item["name"] == release }
end
end
if release_data.nil?
return version_data
end

new_version = input.dup
new_version["flavor"] = release["name"]
new_version["release_date"] = release["release_date"]
new_version["release_notes"] = release["release_notes"]
new_version = version_data.dup
new_version["flavor"] = release_data["name"]
new_version["release_date"] = release_data["release_date"]
new_version["release_notes"] = release_data["release_notes"]

return new_version
end
Expand Down
2 changes: 1 addition & 1 deletion _plugins/outdated_article_threshold.rb
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Articles that have a date older than this at build time
# are considered outdated.
#
# See also `_includes/outdated_article_notice.html`.
# See also `_includes/articles/outdated_notice.html`.

AVERAGE_SECONDS_PER_MONTH = 2628000
OUTDATED_THRESHOLD_IN_MONTHS = 18
Expand Down
135 changes: 135 additions & 0 deletions assets/css/article-cards.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
.card-warning {
background: var(--warning-background-color);
border-radius: 4px 4px;
color: var(--warning-color);
font-size: 90%;
padding: 0 12px;
}

.card-download {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
background: var(--head-background-color);
border-radius: 4px 4px;
padding: 10px 16px;
}

.card-download-link {
color: var(--dark-color-text-title);
font-size: 135%;
font-weight: 700;
text-decoration-color: var(--dark-color-text);
}

.card-download-sublinks {
display: flex;
flex-direction: row;
justify-content: space-between;
gap: 12px;
width: 100%;
}
@media (max-width: 768px) {
.card-download-sublinks {
flex-direction: column;
width: auto;
}
}

.card-download-sublinks .card-download-other,
.card-download-sublinks .card-download-donate {
color: var(--dark-color-text-hl);
font-size: 95%;
text-decoration-color: var(--dark-color-text);
text-decoration-thickness: 1px;
}
.card-download-sublinks .card-download-donate {
color: var(--fund-color-faint);
font-weight: 600;
text-decoration-color: var(--fund-color-faint);
}

.card-download-details {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-start;
gap: 12px;
width: 100%;
}
@media (max-width: 768px) {
.card-download-details {
flex-direction: column;
align-items: center;
gap: 20px;
}
}

.card-download-details img, article .content .card-download-details img {
background-color: transparent;
display: inline-block;
margin: 0;
max-width: 200px;
}
@media (max-width: 768px) {
.card-download-details img, article .content .card-download-details img {
max-height: 220px;
max-width: inherit;
}
}

.card-download-platforms {
display: flex;
flex-direction: row;
gap: 4px;
}

.card-download-platforms {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 8px;
}

.card-download-platforms .download-platform {
color: var(--primary-color-text-title);
display: flex;
align-items: center;
gap: 12px;
font-weight: 700;
}

.download-platform img {
filter: invert(100%);
}

.card-download-platforms .btn-download-primary {
margin-bottom: 0;
text-align: left;
}

.card-download-platforms .btn-download-primary.btn-download-primary--mono {
background-color: var(--download-mono-background-color);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
.card-download-platforms .btn-download-primary.btn-download-primary--mono .download-title {
color: #f7f7f7;
}
.card-download-platforms .btn-download-primary.btn-download-primary--mono .download-hint {
background-color: var(--primary-color-subdued);
color: var(--text-color);
}

.card-download-platforms .btn.btn-download-primary .download-title {
font-size: 18px;
line-height: 24px;
padding: 10px 16px;
white-space: nowrap;
}
@media (max-width: 900px) {
.card-download-platforms .btn.btn-download-primary .download-title {
line-height: 28px;
padding: 12px 20px;
}
}
25 changes: 9 additions & 16 deletions assets/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@

--fund-color: #ef6767;
--fund-color-hl: #e53e3e;
--fund-color-faint: #ff9d9d;

--base-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
--more-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
Expand Down Expand Up @@ -69,6 +70,7 @@
--download-table-color: rgba(160, 160, 160, 0.05);
--platform-note-background-color: rgb(48 86 210 / 9%);
--platform-code-background-color: #e5ebf1;
--download-mono-background-color: rgb(43 58 76 / 82%);

--feature-heading-color: #2d76ad;
--feature-note-color: #e53e3e;
Expand Down Expand Up @@ -128,6 +130,7 @@

--fund-color: #ef6767;
--fund-color-hl: #e53e3e;
--fund-color-faint: #ef6767;

--base-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
--more-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
Expand Down Expand Up @@ -157,6 +160,7 @@
--download-table-color: rgba(0, 0, 0, 0.2);
--platform-note-background-color: rgb(255 255 255 / 9%);
--platform-code-background-color: #282b2e;
--download-mono-background-color: rgb(132 151 174 / 68%);

--feature-heading-color: #57b3f8;
--feature-note-color: #ef6767;
Expand Down Expand Up @@ -815,24 +819,13 @@ p.small {
box-shadow: 0 0 12px rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.1);
}

.card .footer {
background-color: var(--card-footer-color);
}

.card-warning {
background: var(--warning-background-color);
border-radius: 4px 4px;
color: var(--warning-color);
font-size: 90%;
padding: 0 12px;
}

a.card {
display: block;
text-decoration: none;
display: flex;
}
.steam-download:hover {
color: hsla(0, 0%, 100%);

.card .footer {
background-color: var(--card-footer-color);
}

.tabs {
Expand Down Expand Up @@ -1474,4 +1467,4 @@ section.sponsors .grid {

.sponsor-empty:hover {
background-color: #8484841c;
}
}
10 changes: 2 additions & 8 deletions collections/_article/dev-snapshot-godot-4-2-beta-1.md
Original file line number Diff line number Diff line change
Expand Up @@ -352,21 +352,15 @@ On top of that, a significant contribution by [konczg](https://github.com/konczg

## Downloads

The downloads for this pre-release build can be found in our GitHub repository:

* [**Download Godot 4.2 beta 1**](https://github.com/godotengine/godot-builds/releases/tag/4.2-beta1).
{% include articles/download_card.html version="4.2" release="beta1" article=page %}

**Standard build** includes support for GDScript and GDExtension.

**.NET build** (marked as `mono`) includes support for C#, as well as GDScript and GDExtension.
- .NET build requires [.NET SDK 6.0](https://dotnet.microsoft.com/en-us/download/dotnet/6.0) or [7.0](https://dotnet.microsoft.com/en-us/download/dotnet/7.0) installed in a standard location.
- To export to Android, .NET 7.0 or later is required. To export to iOS, .NET 8.0 is required. Make sure to set the target framework in the `.csproj` file.

<div class="card card-warning">
<p>
While engine maintainers try their best to ensure that each beta release is stable, this is by definition <strong>a pre-release piece of software</strong>. Be sure to make frequent backups, or use a version control system such as Git, to preserve your projects in a case of corruption or data loss.
</p>
</div>
{% include articles/prerelease_notice.html %}

## Known issues

Expand Down
Loading

0 comments on commit 9863552

Please sign in to comment.