godotengine/godot-website
1
0
Fork 0
mirror of https://github.com/godotengine/godot-website.git synced 2025-12-31 09:48:43 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add a download card for use in articles

Browse Source
This commit is contained in:
Yuri Sizov
2023-10-25 17:58:01 +02:00
parent 6a43e5ce7b
commit 9863552ad6
12 changed files with 255 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
_includes/articles/download_card.html Normal file
View File

@@ -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>

0
_includes/outdated_article_notice.html → _includes/articles/outdated_notice.html
View File

5
_includes/articles/prerelease_notice.html Normal file
View File

@@ -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
_layouts/article.html
View File

@@ -188,7 +188,7 @@ layout: default
</div>
</div>
{% include outdated_article_notice.html %}
{% include articles/outdated_notice.html %}
<div class="article-body">
{{ content }}
@@ -198,6 +198,7 @@ layout: default
</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', () => {
@@ -206,6 +207,10 @@ layout: default
// 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');

33
_plugins/make_download.rb
View File

@@ -108,14 +108,35 @@ module MakeDownloadFilter
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
new_version = input.dup
new_version["flavor"] = release["name"]
new_version["release_date"] = release["release_date"]
new_version["release_notes"] = release["release_notes"]
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 = 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

2
_plugins/outdated_article_threshold.rb
View File

@@ -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

135
assets/css/article-cards.css Normal file
View File

@@ -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;
}
}

27
assets/css/main.css
View File

@@ -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);
@@ -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;
@@ -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);
@@ -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;
@@ -815,26 +819,15 @@ p.small {
box-shadow: 0 0 12px rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.1);
}
a.card {
display: block;
text-decoration: none;
}
.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 {
text-decoration: none;
display: flex;
}
.steam-download:hover {
color: hsla(0, 0%, 100%);
}
.tabs {
display: flex;
align-items: flex-end;
@@ -1474,4 +1467,4 @@ section.sponsors .grid {
.sponsor-empty:hover {
background-color: #8484841c;
}
}

10
collections/_article/dev-snapshot-godot-4-2-beta-1.md
View File

@@ -352,9 +352,7 @@ 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.
@@ -362,11 +360,7 @@ The downloads for this pre-release build can be found in our GitHub repository:
- .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

10
collections/_article/dev-snapshot-godot-4-2-beta-2.md
View File

@@ -90,9 +90,7 @@ This release is built from commit [`f8818f85e`](https://github.com/godotengine/g
## Downloads
The downloads for this pre-release build can be found in our GitHub repository:
* [**Download Godot 4.2 beta 2**](https://github.com/godotengine/godot-builds/releases/tag/4.2-beta2).
{% include articles/download_card.html version="4.2" release="beta2" article=page %}
**Standard build** includes support for GDScript and GDExtension.
@@ -100,11 +98,7 @@ The downloads for this pre-release build can be found in our GitHub repository:
- .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

10
collections/_article/dev-snapshot-godot-4-2-beta-3.md
View File

@@ -96,9 +96,7 @@ This release is built from commit [`e8d57afae`](https://github.com/godotengine/g
## Downloads
The downloads for this pre-release build can be found in our GitHub repository:
* [**Download Godot 4.2 beta 3**](https://github.com/godotengine/godot-builds/releases/tag/4.2-beta3).
{% include articles/download_card.html version="4.2" release="beta3" article=page %}
**Standard build** includes support for GDScript and GDExtension.
@@ -107,11 +105,7 @@ The downloads for this pre-release build can be found in our GitHub repository:
- [.NET 8.0](https://dotnet.microsoft.com/en-us/download/dotnet/8.0) should also be supported, but keep in mind this version of the .NET SDK is still in preview. Give it a try and let us know if you find any bugs.
- 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

5
pages/community/community.html
View File

@@ -10,11 +10,6 @@ layout: default
height: 100%;
}
a.card {
display: block;
text-decoration: none;
}
.card img {
width: 100%;
height: auto;