Add link to theme creator

This commit is contained in:
Adam Iannazzone 2024-09-30 11:21:10 -04:00
parent c41e5b083c
commit 33cee8dbe3
2 changed files with 42 additions and 22 deletions

View file

@ -174,7 +174,7 @@ img.d-pad {
} }
/* Link Styles */ /* Link Styles */
.jumbotron p a, footer a, a.btn { .jumbotron p a, footer a, a.btn, .feature-card a {
color: var(--rd-purple); color: var(--rd-purple);
background: var(--rd-black); background: var(--rd-black);
text-decoration: none; text-decoration: none;

View file

@ -151,7 +151,7 @@
<!-- Main Content --> <!-- Main Content -->
<main class="container-fluid px-0 mt-4"> <main class="container-fluid px-0 mt-4">
<!-- Jumbotron --> <!-- Jumbotron -->
<div class="container px-2"> <div class="container px-2">
<div class="p-2 mb-4 bg-body-tertiary rounded-3 jumbotron"> <div class="p-2 mb-4 bg-body-tertiary rounded-3 jumbotron">
@ -159,11 +159,14 @@
<!-- First section --> <!-- First section -->
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-md-8"> <div class="col-md-8">
<h1 class="display-md-5 jumbo-header">Your all-in-one emulation package for the Steam Deck</h1> <h1 class="display-md-5 jumbo-header">Your all-in-one emulation package for the Steam Deck
</h1>
<p class="fs-md-4"> <p class="fs-md-4">
Powered by <a target="_blank" rel="noopener noreferrer" href="https://es-de.org/">ES-DE</a>, Powered by <a target="_blank" rel="noopener noreferrer"
href="https://es-de.org/">ES-DE</a>,
RetroDECK combines all of the best open-source emulators into a single application. RetroDECK combines all of the best open-source emulators into a single application.
Pair that with a best-in-class Steam Deck controller configuration, and you'll be in retro Pair that with a best-in-class Steam Deck controller configuration, and you'll be in
retro
gaming gaming
paradise. paradise.
</p> </p>
@ -171,7 +174,8 @@
<!-- Flathub Link --> <!-- Flathub Link -->
<div class="col-md-4 text-center"> <div class="col-md-4 text-center">
<a type="button" class="btn btn-dark align-center p-2" target="_blank" rel="noopener noreferrer" <a type="button" class="btn btn-dark align-center p-2" target="_blank"
rel="noopener noreferrer"
href="https://flathub.org/apps/details/net.retrodeck.retrodeck"> href="https://flathub.org/apps/details/net.retrodeck.retrodeck">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-4"> <div class="col-4">
@ -211,9 +215,11 @@
<div class="row"></div> <div class="row"></div>
<p class="fs-md-4"> <p class="fs-md-4">
With RetroDECK, everything has been pre-configured for optimal performance and quality on the Steam With RetroDECK, everything has been pre-configured for optimal performance and quality on the
Steam
Deck. Deck.
If you want to dig deeper, you tinker with common emulator settings in the RetroDECK Configurator. If you want to dig deeper, you tinker with common emulator settings in the RetroDECK
Configurator.
And dont worry you can always reset with a single click. And dont worry you can always reset with a single click.
</p> </p>
</div> </div>
@ -291,18 +297,24 @@
<div class="container-fluid mb-4" id="features"> <div class="container-fluid mb-4" id="features">
<div class="carousel slide py-2" id="features-carousel"> <div class="carousel slide py-2" id="features-carousel">
<div class="carousel-indicators"> <div class="carousel-indicators">
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button> <button type="button" data-bs-target="#features-carousel" data-bs-slide-to="0" class="active"
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="1" aria-label="Slide 2"></button> aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="2" aria-label="Slide 3"></button> <button type="button" data-bs-target="#features-carousel" data-bs-slide-to="1"
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="3" aria-label="Slide 4"></button> aria-label="Slide 2"></button>
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="2"
aria-label="Slide 3"></button>
<button type="button" data-bs-target="#features-carousel" data-bs-slide-to="3"
aria-label="Slide 4"></button>
</div> </div>
<div class="carousel-inner pb-md-5" role="listbox"> <div class="carousel-inner pb-md-5" role="listbox">
<div class="carousel-item active feature-container px-md-5"> <div class="carousel-item active feature-container px-md-5">
<img src="assets/screens/screen01.png" class="d-block img-fluid screenshot" alt="The RetroDECK and ES-DE logos on a black screen" /> <img src="assets/screens/screen01.png" class="d-block img-fluid screenshot"
alt="The RetroDECK and ES-DE logos on a black screen" />
<div class="feature-card px-2 mt-2 mx-auto"> <div class="feature-card px-2 mt-2 mx-auto">
<h3>A One-Stop Shop</h3> <h3>A One-Stop Shop</h3>
<p>Designed with the Steam Deck in mind, RetroDECK is your perfect emulation companion. <p>Designed with the Steam Deck in mind, RetroDECK is your perfect emulation companion.
It combines the amazing work of Emulation Station Desktop Edition with our own special features to the best Linux emulation platform around.</p> It combines the amazing work of Emulation Station Desktop Edition with our own special
features to the best Linux emulation platform around.</p>
</div> </div>
</div> </div>
@ -319,7 +331,9 @@
<div class="feature-card px-2 mt-2 mx-auto"> <div class="feature-card px-2 mt-2 mx-auto">
<h3>Custom ES-DE Theme</h3> <h3>Custom ES-DE Theme</h3>
<p>RetroDECK includes a custom ES-DE theme with pixel text and retro vibes. <p>RetroDECK includes a custom ES-DE theme with pixel text and retro vibes.
But you can also choose any ES-DE theme in the settings menu. But you can also choose any ES-DE theme in the settings menu. Thank you to <a
href="https://github.com/Weestuarty" target="_blank"
rel="noopener noreferrer">Weestuarty</a> for their amazing work!
</p> </p>
</div> </div>
</div> </div>
@ -328,17 +342,22 @@
<img src="assets/screens/screen04.png" class="d-block img-fluid screenshot" alt="" /> <img src="assets/screens/screen04.png" class="d-block img-fluid screenshot" alt="" />
<div class="feature-card px-2 mt-2 mx-auto"> <div class="feature-card px-2 mt-2 mx-auto">
<h3>Easy art scraping</h3> <h3>Easy art scraping</h3>
<p>Use the built-in scraping integration to grab beautiful artwork and metadata for your games. You can use Screenscraper or The GamesDB.</p> <p>Use the built-in scraping integration to grab beautiful artwork and metadata for your
games. You can use Screenscraper or The GamesDB.</p>
</div> </div>
</div> </div>
</div> </div>
<button class="carousel-control-prev carousel-button" type="button" data-bs-target="#features-carousel" data-bs-slide="prev" id="carousel-prev"> <button class="carousel-control-prev carousel-button" type="button" data-bs-target="#features-carousel"
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_left_outline.svg" aria-hidden="true"/> data-bs-slide="prev" id="carousel-prev">
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_left_outline.svg"
aria-hidden="true" />
</button> </button>
<button class="carousel-control-next carousel-button" type="button" data-bs-target="#features-carousel" data-bs-slide="next" id="carousel-next"> <button class="carousel-control-next carousel-button" type="button" data-bs-target="#features-carousel"
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_right_outline.svg" aria-hidden="true"/> data-bs-slide="next" id="carousel-next">
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_right_outline.svg"
aria-hidden="true" />
</button> </button>
</div> </div>
</div> </div>
@ -361,7 +380,8 @@
<!-- Donate/Help Link --> <!-- Donate/Help Link -->
<div class="col-md-4 text-center"> <div class="col-md-4 text-center">
<a type="button" class="btn btn-dark align-center p-2" target="_blank" rel="noopener noreferrer" <a type="button" class="btn btn-dark align-center p-2" target="_blank"
rel="noopener noreferrer"
href="https://retrodeck.readthedocs.io/en/latest/wiki_credits/donations-licenses/"> href="https://retrodeck.readthedocs.io/en/latest/wiki_credits/donations-licenses/">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-4"> <div class="col-4">