mirror of
https://github.com/godotengine/godot-website.git
synced 2025-12-31 09:48:43 +03:00
233 lines
6.7 KiB
HTML
233 lines
6.7 KiB
HTML
---
|
|
layout: default
|
|
---
|
|
|
|
{% include header.html %}
|
|
|
|
<style>
|
|
.showcase-video-image {
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.showcase-developer-quote {
|
|
font-style: italic;
|
|
color: var(--base-color-text-title);
|
|
|
|
}
|
|
|
|
.showcase-developer-quote p:first-child::before {
|
|
content: '“';
|
|
font-size: 150%;
|
|
margin-right: -0.1rem;
|
|
}
|
|
|
|
.showcase-developer-quote p:last-child::after {
|
|
content: '”';
|
|
font-size: 150%;
|
|
margin-left: -0.1rem;
|
|
}
|
|
|
|
@media (min-width: 900px) {
|
|
.showcase-video-image {
|
|
margin-left: 1rem;
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
|
|
article h3 {
|
|
margin-bottom: 0;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
footer.footer-global {
|
|
margin-top: 60px;
|
|
}
|
|
</style>
|
|
|
|
<div class="head">
|
|
<div class="container flex eqsize responsive">
|
|
<div class="main">
|
|
|
|
<div style="margin: 1.25rem 0">
|
|
<a href="/showcase/"><strong><</strong> Back to showcase</a>
|
|
</div>
|
|
|
|
<h1 class="intro-title">{{ page.title }}</h1>
|
|
<h3 style="opacity: 0.75; margin-top: 0.5rem">
|
|
by <a href="{{ page.website }}" target="_blank"
|
|
style="text-decoration: underline; text-decoration-thickness: 0.125rem; text-decoration-color: hsla(0, 0%, 100%, 0.5)">{{
|
|
page.author }}</a>
|
|
| {% if page.release_date == "TBD" %}Release date: <abbr title="To Be Determined">TBD</abbr>{% else %}{{
|
|
page.release_date }}{% endif %}
|
|
</h3>
|
|
<div style="filter: invert(100%); opacity: 0.75; margin-top: 1rem">
|
|
|
|
|
|
{% if page.windows %}
|
|
<img src="/assets/images/platforms/windows.svg" alt="Windows" title="Windows" style="margin: 0 0.125rem" width="24"
|
|
height="24">
|
|
{% endif %}
|
|
|
|
{% if page.macos %}
|
|
<img src="/assets/images/platforms/macos.svg" alt="Mac" title="Mac" style="margin: 0 0.125rem" width="24" height="24">
|
|
{% endif %}
|
|
|
|
{% if page.linux %}
|
|
<img src="/assets/images/platforms/linux.svg" alt="Linux" title="Linux" style="margin: 0 0.125rem" width="24" height="24">
|
|
{% endif %}
|
|
|
|
{% if page.switch %}
|
|
<img src="/assets/images/platforms/switch.svg" alt="Nintendo Switch" title="Switch" style="margin: 0 0.125rem" width="24"
|
|
height="24">
|
|
{% endif %}
|
|
|
|
{% if page.quest %}
|
|
<img src="/assets/images/platforms/vr.svg" alt="VR" title="VR" style="margin: 0 0.125rem" width="24"
|
|
height="24">
|
|
{% endif %}
|
|
|
|
{% if page.html5 %}
|
|
<img src="/assets/images/platforms/web.svg" alt="HTML5" title="HTML5" style="margin: 0 0.125rem" width="24" height="24">
|
|
{% endif %}
|
|
|
|
{% if page.android %}
|
|
<img src="/assets/images/platforms/android.svg" alt="Android" title="Android" style="margin: 0 0.125rem" width="24"
|
|
height="24">
|
|
{% endif %}
|
|
|
|
{% if page.ios %}
|
|
<img src="/assets/images/platforms/ios.svg" alt="iOS" title="iOS" style="margin: 0 0.125rem" width="24" height="24">
|
|
{% endif %}
|
|
|
|
{% if page.playstation %}
|
|
<img src="/assets/images/platforms/playstation.svg" alt="PlayStation" title="PlayStation" style="margin: 0 0.125rem"
|
|
width="24" height="24">
|
|
{% endif %}
|
|
|
|
{% if page.xbox %}
|
|
<img src="/assets/images/platforms/xbox.svg" alt="Xbox" title="Xbox" style="margin: 0 0.125rem" width="24" height="24">
|
|
{% endif %}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<section class="flex eqsize responsive">
|
|
<article>
|
|
{{ content }}
|
|
|
|
<div class="flex responsive" style="justify-content: center; margin-top: 2rem">
|
|
{% if page.steam %}
|
|
<a href="{{ page.steam }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Steam
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.itch %}
|
|
<a href="{{ page.itch }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on itch.io
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.humble %}
|
|
<a href="{{ page.humble }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Humble Store
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.gog %}
|
|
<a href="{{ page.gog }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on GOG.com
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.quest %}
|
|
<a href="{{ page.quest }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Meta Store
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.nintendo %}
|
|
<a href="{{ page.nintendo }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Nintendo Switch
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.microsoft %}
|
|
<a href="{{ page.microsoft }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Xbox
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.sony %}
|
|
<a href="{{ page.sony }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on PlayStation
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.github %}
|
|
<a href="{{ page.github }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on GitHub
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.appstore %}
|
|
<a href="{{ page.appstore }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on App Store
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.googleplay %}
|
|
<a href="{{ page.googleplay }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
View on Google Play
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if page.custom %}
|
|
<a href="{{ page.custom }}" class="btn" style="margin: 0 0.5rem; white-space: nowrap" target="_blank">
|
|
Learn More
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</article>
|
|
<article class="showcase-video-image">
|
|
{% if page.youtube_id %}
|
|
<div class="card youtube" style="padding-bottom: 56.25%">
|
|
<iframe src="https://www.youtube-nocookie.com/embed/{{ page.youtube_id }}"
|
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
|
allowfullscreen="" frameborder="0">
|
|
</iframe>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% for image in page.gallery %}
|
|
<a href="{{ image }}" class="lightbox" data-group="showcase">
|
|
<img class="rounded-lg" src="{{ image }}" alt="Screenshot of {{ page.title }} by {{ page.author }}"
|
|
style="width: 100%; height: auto; margin-top: 1rem; background: linear-gradient(90deg, #947451 12%, #a8885f 29%, #8c8977 65%, #d2ba9f 98%) "
|
|
width="16" height="9">
|
|
</a>
|
|
{% endfor %}
|
|
</article>
|
|
</section>
|
|
{% if page.developer_interview %}
|
|
<section style="margin-top: 3rem">
|
|
<h3>{{ page.developer_interview.title }}</h3>
|
|
|
|
<blockquote class="showcase-developer-quote">
|
|
{{ page.developer_interview.text }}
|
|
</blockquote>
|
|
|
|
{% if page.developer_interview.url %}
|
|
<a href="{{ page.developer_interview.url }}">{{ page.developer_interview.context }}</a>
|
|
{% else %}
|
|
<p>{{ page.developer_interview.context }}</p>
|
|
{% endif %}
|
|
</section>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% include footer.html %}
|