godotengine/godot-website
1
0
Fork 0
mirror of https://github.com/godotengine/godot-website.git synced 2026-01-06 14:09:58 +03:00
Code Issues Packages Projects Releases Wiki Activity

Update website for the imminent Godot 4 release (#579)

Browse Source 
* Update Home and Features pages for Godot 4

Adds support for 2 simultaneous stable versions of the engine
Dubs Godot 4 as Latest and Godot 3 as LTS
References new features of Godot 4 as extras on the Features page
Downloads are WIP

* Split Download pages for 4.x and 3.x and cross-link them

Also slightly improve styling of the pages

* Promote Features over Showcase in main navigation again

* replace editor image

---------

Co-authored-by: Emi <2206700+coppolaemilio@users.noreply.github.com>
This commit is contained in:
Yuri Sizov
2023-03-01 13:19:59 +01:00
committed by GitHub
parent bf2bcc6dd5
commit 408ed76629
26 changed files with 1209 additions and 468 deletions
Download Patch File Download Diff File Expand all files Collapse all files

381
_layouts/download.html
View File

@@ -6,333 +6,18 @@ layout: default
{% include header.html %}
<link rel="stylesheet" href="/assets/css/transparent-nav.css">
<link rel="stylesheet" href="/assets/css/download.css">
<style>
.hero {
padding: 124px 0 60px;
background: url('/assets/download/download-background.jpg');
background-size: cover;
background-position: center;
position: relative;
}
.hero h1 {
font-size: 60px;
text-shadow: 0 0 28px #00000080;
margin-bottom: 20px;
color: white;
}
.hero .hero-wrapper {
flex-direction: column;
text-align: center;
max-width: 580px;
margin: 0 auto;
}
.hero .main-downloads {
max-width: 600px;
margin: 40px auto;
display: grid;
gap: 24px;
text-align: center;
}
.hero .main-download-details {
color: var(--download-main-details-color);
font-size: 14px;
margin-top: 0;
opacity: 0.6;
}
.hero .previous-releases {
color: var(--download-hero-color);
font-size: 95%;
}
.hero .other-platforms {
color: var(--download-hero-color);
font-weight: 600;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 8px;
}
.hero .other-platforms .other-platforms-wrapper {
max-width: 1200px;
margin: auto;
}
.btn.btn-download-main,
.btn.btn-download-main2 {
background-color: var(--primary-color);
color: white;
display: inline-flex;
flex-basis: content;
padding: 0px;
margin-bottom: 8px;
}
.btn.btn-download-main2 {
background-color: rgb(111 111 111 / 27%);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
.btn.btn-download-main img,
.btn.btn-download-main2 img {
display: inline-block;
filter: invert();
margin-right: 10px;
width: 20px;
vertical-align: text-bottom;
}
.btn.btn-download-main .download-hint,
.btn.btn-download-main2 .download-hint {
background-color: var(--primary-color-text-title);
color: var(--dark-color);
line-height: 32px;
padding: 12px 16px;
}
.btn.btn-download-main .download-title,
.btn.btn-download-main2 .download-title {
color: var(--primary-color-text-title);
font-size: 20px;
line-height: 32px;
padding: 12px 32px 12px 24px;
}
.platform-details .card {
margin-top: 32px;
}
.platform-details pre {
background-color: var(--platform-code-background-color);
}
.platform-details .download {
display: flex;
flex-direction: column;
gap: 6px;
margin-bottom: 8px;
}
.platform-details .download-details {
color: var(--secondary-color-text);
font-size: 14px;
padding: 0 12px;
}
.platform-details .download-note {
padding: 16px 12px;
font-size: 92%;
background-color: var(--platform-note-background-color);
margin-top: 28px;
}
.platform-details .download-note p {
margin: 0;
}
.platform-details .platform-split {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
}
@media (max-width: 1200px) {
.platform-details .platform-split {
grid-template-columns: 1fr;
gap: 0;
}
}
.other-download {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
max-width: 100%;
}
@media (min-width: 768px) {
.other-download {
grid-template-columns: 1fr 1fr 1fr;
}
}
.other-download-card {
background: var(--card-background-color);
border-radius: 6px;
padding: 26px 35px;
}
.platform-tabs {
margin-bottom: -1px;
justify-content: center;
flex-wrap: wrap;
}
.platform-tabs .tab img {
display: block;
}
@media (prefers-color-scheme: dark) {
.platform-tabs .tab img {
filter: invert(100%);
}
}
.platform-tabs .tab:not(.active):hover {
background: var(--card-background-color);
color: var(--base-color-text-hl);
}
.platform-tabs .tab.active {
background: var(--card-background-color);
}
.digital-stores {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
}
@media (max-width: 1200px) {
.digital-stores {
grid-template-columns: 1fr;
}
}
.digital-stores p {
margin-top: 0;
}
.digital-stores .digital-store-list {
display: flex;
justify-content: center;
gap: 16px;
}
.btn.btn-digital-store {
background-color: var(--primary-color);
color: var(--dark-color-text-title);
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 16px;
padding: 12px 24px;
}
.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;
}
background-image: url('/assets/download/download-background-4.x.jpg');
}
</style>
{% assign stable_version = site.data.versions.godot_4 | find: "flavor", "stable" %}
<div class="hero">
<div class="hero-wrapper">
<h1>Download Godot for {{ page.platform }}</h1>
<h1>Download Godot&nbsp;4 for {{ page.platform }}</h1>
<div class="main-downloads">
{% assign featured_downloads = page.downloads | where: "featured", "true" %}
@@ -342,7 +27,7 @@ layout: default
{% if download.custom %}
{{download.custom}}
{% else %}
https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/{% if download.mono %}mono/{% endif %}Godot_v{{site.stable_version}}-stable_{{ download.slug }}
https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/{% if download.mono %}mono/{% endif %}Godot_v{{stable_version.name}}-stable_{{ download.slug }}
{% endif %}
{% endcapture %}
@@ -352,16 +37,18 @@ layout: default
<img src="/assets/icons/{{ page.platform | slugify }}.svg" alt="({{ page.platform }})">
Godot Engine{% if download.featured_flavor %} - {{ download.featured_flavor }}{% endif %}
</div>
<div class="download-hint">{{ site.stable_version }}</div>
<div class="download-hint">{{ stable_version.name }}</div>
</a>
<p class="main-download-details">
{{ page.platform }}<strong>{% for tag in download.tags %} · {{ tag }}{% endfor %}</strong> · {{ site.stable_version_date }}
<strong>{% for tag in download.tags %}{{ tag }} · {% endfor %}</strong>{{ stable_version.release_date }}
</p>
</div>
{% endfor %}
<p class="previous-releases">
<strong class="previous-releases-featured">For the LTS version, <a href="/download/3.x/windows" class="set-os-download-url" data-version="3">Download Godot 3</a>.</strong>
<br>
You can find previous releases on <a href="https://github.com/godotengine/godot/releases">GitHub</a> or the <a href="https://downloads.tuxfamily.org/godotengine">download repository</a>.
</p>
</div>
@@ -380,14 +67,18 @@ layout: default
<h3>Requirements</h3>
<ul>
<li>OpenGL 2.1 / OpenGL ES 2.0 compatible hardware</li>
{% unless page.ignore_mono %}
<li>
<strong>For the .NET version:</strong> <a href="https://dotnet.microsoft.com/download">.NET SDK</a> or the
<a href="https://www.mono-project.com/download/stable/">Mono SDK</a>
</li>
{% endunless %}
<li><strong>Recommended:</strong> Vulkan 1.0 compatible hardware</li>
<li><strong>Minimal:</strong> OpenGL 3.3 / OpenGL ES 3.0 compatible hardware</li>
</ul>
{% unless page.ignore_mono %}
<p>Additional requirements for the .NET version:</p>
<ul>
<li>
<a href="https://dotnet.microsoft.com/download">.NET SDK</a>
</li>
</ul>
{% endunless %}
</div>
<div class="platform-split">
@@ -400,7 +91,7 @@ layout: default
{% if download.custom %}
{{download.custom}}
{% else %}
https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/{% if download.mono %}mono/{% endif %}Godot_v{{site.stable_version}}-stable_{{ download.slug }}
https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/{% if download.mono %}mono/{% endif %}Godot_v{{stable_version.name}}-stable_{{ download.slug }}
{% endif %}
{% endcapture %}
@@ -412,14 +103,14 @@ layout: default
{% unless page.ignore_export %}
<div class="download">
<a href="https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/Godot_v{{site.stable_version}}-stable_export_templates.tpz">
<a href="https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/Godot_v{{stable_version.name}}-stable_export_templates.tpz">
Export templates (Standard)
</a>
<span class="download-details">Used to export your games to all supported platforms</span>
</div>
{% unless page.ignore_mono %}
<div class="download">
<a href="https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/mono/Godot_v{{site.stable_version}}-stable_mono_export_templates.tpz">
<a href="https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/mono/Godot_v{{stable_version.name}}-stable_mono_export_templates.tpz">
Export templates (.NET)
</a>
<span class="download-details">Used to export your games to all supported platforms · C# support</span>
@@ -463,13 +154,15 @@ layout: default
<div>
<ul>
<li>Digital store versions <strong>do not</strong> include .NET/C# support.</li>
<li><strong>Steam</strong> version includes full set of export templates and demo projects.</li>
<li><strong>Steam</strong> version is available as a <code>stable-4.0</code> beta branch.</li>
</ul>
</div>
</div>
</div>
</div>
<div id="platforms" class="padded">
<div class="platforms-wrapper">
<div id="platforms" class="container">
<h2>Supported platforms</h2>
<div class="tabs platform-tabs">
@@ -489,17 +182,15 @@ layout: default
<img width="24" height="24" src="/assets/icons/windows.svg" title="Windows" alt="Windows" />
<span>Windows</span>
</a>
<a href="/download/server" class="tab title-font {% if page.platform == 'Linux Server' %} active {% endif %}">
<img width="24" height="24" src="/assets/icons/linux-server.svg" title="Linux Server" alt="Linux Server" />
<span>Linux Server</span>
</a>
<a href="https://editor.godotengine.org/releases/{{site.stable_version}}.stable/" target="_blank" class="tab title-font">
<a href="https://editor.godotengine.org/releases/{{stable_version.name}}.stable/" target="_blank" class="tab title-font">
<img width="24" height="24" src="/assets/icons/html5.svg" title="Web Editor" alt="Web Editor" />
<span>Web Editor</span>
</a>
</div>
</div>
</div>
<div class="container">
<div id="extras" class="padded" style="padding-top: 0">
<h2>Other Godot downloads</h2>
@@ -508,7 +199,7 @@ layout: default
<div class="other-download-card">
<h3>Godot demo projects</h3>
<p>
Give a try to demo projects showcasing some of the engine features.
Give a try to demo projects showcasing some of the engine features.
</p>
<p>
<a href="https://github.com/godotengine/godot-demo-projects">
@@ -516,7 +207,9 @@ layout: default
</a>
</p>
<p>
<a href="https://godotengine.org/asset-library/asset?category=10&support[official]=1">
{% assign stable_version_comp = stable_version.name | split: "." %}
<a href="https://godotengine.org/asset-library/asset?category=10&godot_version={{stable_version_comp[0]}}.{{stable_version_comp[1]}}&support[official]=1">
Demo projects in Asset Library
</a>
</p>
@@ -526,12 +219,12 @@ layout: default
<h3>AAR library for Android</h3>
<p>Use it to develop Android plugins in Java or Kotlin using the Godot API.</p>
<p>
<a href="https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/godot-lib.{{site.stable_version}}.stable.release.aar">
<a href="https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/godot-lib.{{stable_version.name}}.stable.release.aar">
AAR library (standard)
</a>
</p>
<p>
<a href="https://downloads.tuxfamily.org/godotengine/{{site.stable_version}}/mono/godot-lib.{{site.stable_version}}.stable.mono.release.aar">
<a href="https://downloads.tuxfamily.org/godotengine/{{stable_version.name}}/mono/godot-lib.{{stable_version.name}}.stable.mono.release.aar">
AAR library (.NET / C#)
</a>
</p>