lywsvip/Sunshine
1
0
Fork 0
mirror of https://github.com/LizardByte/Sunshine.git synced 2026-05-06 13:40:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(gh-pages): style fixes for theme switcher (#4748)

Browse Source
This commit is contained in:
David Lane
2026-02-19 21:28:26 -05:00
committed by GitHub
parent c9bcee4480
commit 4913b673dc
4 changed files with 260 additions and 467 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
gh-pages-template/_config.yml
View File

@@ -1,4 +1,4 @@
---
# See https://github.com/daattali/beautiful-jekyll/blob/master/_config.yml for documented options
# See https://github.com/LizardByte/beautiful-jekyll-next/blob/master/_config.yml for documented options
avatar: "/Sunshine/assets/img/navbar-avatar.png"

167
gh-pages-template/_data/clients.yml Normal file
View File

@@ -0,0 +1,167 @@
---
- name: "Android"
type: "official"
github: "https://github.com/moonlight-stream/moonlight-android"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/android.svg"
alt: "Android"
invert: true
downloads:
- label: "Get it on Google Play"
url: "https://play.google.com/store/apps/details?id=com.limelight"
img_src: "https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
img_height: 60
- label: "Available at Amazon Appstore"
url: "https://www.amazon.com/gp/product/B00JK4MFN2"
img_src: "https://images-na.ssl-images-amazon.com/images/G/01/mobile-apps/devportal2/res/images/amazon-appstore-badge-english-black.png" # yamllint disable rule:line-length
img_height: 60
img_style: "padding: 10px;"
- label: "Get it on F-Droid"
url: "https://f-droid.org/packages/com.limelight"
img_src: "https://fdroid.gitlab.io/artwork/badge/get-it-on.png"
img_height: 60
- name: "iOS"
type: "official"
github: "https://github.com/moonlight-stream/moonlight-ios"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/ios.svg"
alt: "iOS"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/appletv.svg"
alt: "Apple TV"
invert: true
downloads:
- label: "Download on the App Store"
url: "https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566"
img_src: "https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
img_height: 40
- label: "Download on Apple TV"
url: "https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566"
img_src: "https://developer.apple.com/app-store/marketing/guidelines/images/badge-download-on-apple-tv.svg"
img_height: 40
- name: "QT"
type: "official"
github: "https://github.com/moonlight-stream/moonlight-qt"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/linux.svg"
alt: "Linux"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/macos.svg"
alt: "macOS"
invert: true
- src: "https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/windows.svg"
alt: "Windows"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/steam.svg"
alt: "Steam"
invert: true
downloads:
- label: "Download on GitHub"
url: "https://github.com/moonlight-stream/moonlight-qt/releases"
icon_fa: "fab fa-github"
btn_class: "btn btn-info"
- name: "Embedded"
type: "official"
github: "https://github.com/moonlight-stream/moonlight-embedded"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/raspberrypi.svg"
alt: "Raspberry Pi"
invert: true
downloads:
- label: "Download"
url: "https://github.com/irtimmer/moonlight-embedded/wiki/Packages"
icon_fa: "fas fa-download"
btn_class: "btn btn-info"
- name: "Xbox One/Series"
type: "community"
github: "https://github.com/TheElixZammuto/moonlight-xbox"
icons:
- src: "https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/xbox.svg"
alt: "Xbox"
invert: true
downloads:
- label: "Get it from Microsoft"
url: "https://apps.microsoft.com/store/detail/moonlight-uwp/9MW1BS08ZBTH"
img_src: "https://get.microsoft.com/images/en-us%20dark.svg"
img_height: 40
- name: "PS Vita"
type: "community"
github: "https://github.com/xyzz/vita-moonlight"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/playstationvita.svg"
alt: "PlayStation Vita"
invert: true
downloads:
- label: "Download on GitHub"
url: "https://github.com/xyzz/vita-moonlight/releases"
icon_fa: "fab fa-github"
btn_class: "btn btn-info"
- name: "Moonlight Switch"
type: "community"
github: "https://github.com/XITRIX/Moonlight-Switch"
icons:
- src: "https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/nintendo-switch.svg"
alt: "Nintendo Switch"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/android.svg"
alt: "Android"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/appletv.svg"
alt: "Apple TV"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/ios.svg"
alt: "iOS"
invert: true
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/macos.svg"
alt: "macOS"
invert: true
downloads:
- label: "Download on GitHub"
url: "https://github.com/XITRIX/Moonlight-Switch/releases"
icon_fa: "fab fa-github"
btn_class: "btn btn-info"
- name: "Nintendo Wii U"
type: "community"
github: "https://github.com/GaryOderNichts/moonlight-wiiu"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v12/icons/wiiu.svg"
alt: "Wii U"
invert: true
downloads:
- label: "Download"
url: "https://github.com/GaryOderNichts/moonlight-wiiu#quick-start"
icon_fa: "fas fa-download"
btn_class: "btn btn-info"
- name: "New Nintendo 3DS"
type: "community"
github: "https://github.com/zoeyjodon/moonlight-N3DS"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v12/icons/nintendo3ds.svg"
alt: "3DS"
invert: true
downloads:
- label: "Download"
url: "https://github.com/zoeyjodon/moonlight-N3DS"
icon_fa: "fas fa-download"
btn_class: "btn btn-info"
- name: "LG webOS TV"
type: "community"
github: "https://github.com/mariotaku/moonlight-tv"
icons:
- src: "https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/lg.svg"
alt: "LG webOS TV"
invert: true
downloads:
- label: "Download"
url: "https://github.com/mariotaku/moonlight-tv#download"
icon_fa: "fas fa-download"
btn_class: "btn btn-info"

40
gh-pages-template/_data/features.yml Normal file
View File

@@ -0,0 +1,40 @@
---
- title: "Self-hosted"
icon_fa: "fas fa-server"
description: >
Run Sunshine on your own hardware. No need to pay monthly fees to a
cloud gaming provider.
- title: "Moonlight Support"
icon_img: "https://moonlight-stream.org/images/moonlight.svg"
icon_img_alt: "Moonlight"
description: >
Connect to Sunshine from any Moonlight client. Moonlight is available
for Windows, macOS, Linux, Android, iOS, Xbox, and more. See
<a href="#Clients">clients</a> for more information.
- title: "Hardware Encoding"
icon_fa: "fas fa-microchip"
description: >
Sunshine supports AMD, Intel, and Nvidia GPUs for hardware encoding.
Software encoding is also available.
- title: "Low Latency"
icon_fa: "fas fa-globe"
description: >
Sunshine is designed to provide the lowest latency possible to achieve optimal gaming performance.
- title: "Control"
icon_fa: "fas fa-gamepad"
description: >
Sunshine emulates an Xbox, PlayStation, or Nintendo Switch controller.
Use nearly any controller on your Moonlight client!
<br><small><ul>
<li>Nintendo Switch emulation is only available on Linux.</li>
<li>Gamepad emulation is not currently supported on macOS.</li>
</ul></small>
- title: "Configurable"
icon_fa: "fas fa-gear"
description: >
Sunshine offers many configuration options to customize your experience.

518
gh-pages-template/index.html
View File

@@ -17,7 +17,7 @@ ext-js:
<!-- About section-->
<section class="py-5" id="About">
<div class="container px-auto">
<p class="lead text-center text-white mx-auto mt-0 mb-5">
<p class="lead text-center mx-auto mt-0 mb-5">
Sunshine is a self-hosted game stream host for Moonlight. Offering low latency, cloud gaming
server capabilities with support for AMD, Intel, and Nvidia GPUs for hardware encoding. Software
encoding is also available. You can connect to Sunshine from any Moonlight client on a variety
@@ -30,122 +30,29 @@ ext-js:
<!-- Features section-->
<section class="py-5" id="Features">
<div class="container px-auto">
<h2 class="text-center text-white fw-bolder my-5">Features</h2>
<!-- Create a card for each feature -->
<h2 class="text-center fw-bolder my-5">Features</h2>
<div class="row gx-5">
{% for feature in site.data.features %}
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-custom h-100 shadow border-0 rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<i class="fa-fw fa-2x fas fa-server"></i>
<div class="icon">
{% if feature.icon_fa %}
<i class="fa-fw fa-2x {{ feature.icon_fa }}"></i>
{% elsif feature.icon_img %}
<img {% if feature.icon_img_invert %}class="invert"{% endif %} src="{{ feature.icon_img }}" alt="{{ feature.icon_img_alt | default: feature.title }}"/>
{% endif %}
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Self-hosted</h5>
<p class="mb-0">
Run Sunshine on your own hardware. No need to pay monthly fees to a
cloud gaming provider.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="icon" src="https://moonlight-stream.org/images/moonlight.svg" alt="Moonlight"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Moonlight Support</h5>
<p class="mb-0">
Connect to Sunshine from any Moonlight client. Moonlight is available
for Windows, macOS, Linux, Android, iOS, Xbox, and more. See
<a class="text-white" href="#Clients">clients</a> for more information.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<i class="fa-fw fa-2x fas fa-microchip"></i>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Hardware Encoding</h5>
<p class="mb-0">
Sunshine supports AMD, Intel, and Nvidia GPUs for hardware encoding.
Software encoding is also available.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<i class="fa-fw fa-2x fas fa-globe"></i>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Low Latency</h5>
<p class="mb-0">
Sunshine is designed to provide the lowest latency possible to achieve optimal gaming performance.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<i class="fa-fw fa-2x fas fa-gamepad"></i>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Control</h5>
<p class="mb-0">
Sunshine emulates an Xbox, PlayStation, or Nintendo Switch controller.
Use nearly any controller on your Moonlight client!<br>
<small>
<ul>
<li>Nintendo Switch emulation is only available on Linux.</li>
<li>Gamepad emulation is not currently supported on macOS.</li>
</ul>
</small>
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<i class="fa-fw fa-2x fas fa-gear"></i>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">Configurable</h5>
<p class="mb-0">
Sunshine offers many configuration options to customize your experience.
</p>
<h5 class="fw-bolder mb-0">{{ feature.title }}</h5>
<p class="mb-0">{{ feature.description }}</p>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
@@ -153,379 +60,58 @@ ext-js:
<!-- Clients section-->
<section class="py-5" id="Clients">
<div class="container px-auto">
<h2 class="text-center text-white fw-bolder my-5">Clients</h2>
<!-- Create a card for each client -->
<h2 class="text-center fw-bolder my-5">Clients</h2>
<div class="row gx-5">
<!-- Android -->
{% for client in site.data.clients %}
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/android.svg" alt="Android"/>
<div class="icon">
{% for icon in client.icons %}
<img {% if icon.invert %}class="invert"{% endif %} src="{{ icon.src }}" alt="{{ icon.alt }}"/>
{% endfor %}
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/moonlight-stream/moonlight-android" target="_blank" class="text-white text-decoration-none">
Android
<a href="{{ client.github }}" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
{{ client.name }}
</a>
</h5>
</div>
<div class="ms-auto">
{% if client.type == "official" %}
<span class="badge text-bg-info rounded-pill">Official</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div>
<a href="https://play.google.com/store/apps/details?id=com.limelight" target="_blank">
<img alt="Get it on Google Play"
src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
height="60"/>
</a>
</div>
<div>
<a href="https://www.amazon.com/gp/product/B00JK4MFN2" target="_blank">
<img alt="Available at Amazon Appstore"
src="https://images-na.ssl-images-amazon.com/images/G/01/mobile-apps/devportal2/res/images/amazon-appstore-badge-english-black.png"
height="60"
style="padding: 10px;"/>
</a>
</div>
<div>
<a href="https://f-droid.org/packages/com.limelight" target="_blank">
<img alt="Get it on F-Droid"
src="https://fdroid.gitlab.io/artwork/badge/get-it-on.png"
height="60"/>
</a>
</div>
</div>
</div>
</div>
<!-- ChromeOS -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/chromewebstore.svg" alt="Chrome Web Store"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/moonlight-stream/moonlight-chrome" target="_blank" class="text-white text-decoration-none">
ChromeOS
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-info rounded-pill">Official</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://chrome.google.com/webstore/detail/moonlight-game-streaming/gemamigbbenahjlfnmlfdjhdnkpbkfjj" target="_blank" class="btn btn-outline-light">
<img alt="Available in the Chrome Web Store"
src="https://developer.chrome.com/static/docs/webstore/branding/image/206x58-chrome-web-043497a3d766e.png"
height="30"/>
</a>
</div>
</div>
</div>
</div>
<!-- iOS -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/ios.svg" alt="iOS"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/appletv.svg" alt="Apple TV"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/moonlight-stream/moonlight-ios" target="_blank" class="text-white text-decoration-none">
iOS
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-info rounded-pill">Official</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566" target="_blank">
<img alt="Download on the App Store"
src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
height="40"/>
</a>
</div>
<div class="pb-3">
<a href="https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566" target="_blank">
<img alt="Download on Apple TV"
src="https://developer.apple.com/app-store/marketing/guidelines/images/badge-download-on-apple-tv.svg"
height="40"/>
</a>
</div>
</div>
</div>
</div>
<!-- Moonlight-QT -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/linux.svg" alt="Linux"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/macos.svg" alt="macOS"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/windows.svg" alt="Windows"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/steam.svg" alt="Steam"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/moonlight-stream/moonlight-qt" target="_blank" class="text-white text-decoration-none">
QT
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-info rounded-pill">Official</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/moonlight-stream/moonlight-qt/releases" target="_blank" class="btn btn-info">
<i class="fab fa-github"></i> Download on GitHub
</a>
</div>
</div>
</div>
</div>
<!-- Embedded -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/raspberrypi.svg" alt="Raspberry Pi"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/moonlight-stream/moonlight-embedded" target="_blank" class="text-white text-decoration-none">
Embedded
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-info rounded-pill">Official</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/irtimmer/moonlight-embedded/wiki/Packages" target="_blank" class="btn btn-info">
<i class="fas fa-download"></i> Download
</a>
</div>
</div>
</div>
</div>
<!-- Xbox One/Series -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/xbox.svg" alt="Xbox"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/TheElixZammuto/moonlight-xbox" target="_blank" class="text-white text-decoration-none">
Xbox One/Series
</a>
</h5>
</div>
<div class="ms-auto">
{% elsif client.type == "community" %}
<span class="badge text-bg-warning rounded-pill">Community</span>
{% endif %}
</div>
</div>
</div>
{% if client.downloads %}
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://apps.microsoft.com/store/detail/moonlight-uwp/9MW1BS08ZBTH" target="_blank">
<img alt="Get it from Microsoft"
src="https://get.microsoft.com/images/en-us%20dark.svg"
height="40"/>
{% for download in client.downloads %}
<div class="{% unless forloop.last %}pb-3{% endunless %}">
{% if download.img_src %}
<a href="{{ download.url }}" target="_blank"{% if download.btn_class %} class="{{ download.btn_class }}"{% endif %}>
<img alt="{{ download.label }}"
src="{{ download.img_src }}"
height="{{ download.img_height }}"
{% if download.img_style %}style="{{ download.img_style }}"{% endif %}/>
</a>
{% else %}
<a href="{{ download.url }}" target="_blank" class="{{ download.btn_class | default: 'btn btn-info' }}">
{% if download.icon_fa %}<i class="{{ download.icon_fa }}"></i>{% endif %}
{{ download.label }}
</a>
{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
<!-- PS Vita -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/playstationvita.svg" alt="PlayStation Vita"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/xyzz/vita-moonlight" target="_blank" class="text-white text-decoration-none">
PS Vita
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-warning rounded-pill">Community</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/xyzz/vita-moonlight/releases" target="_blank" class="btn btn-info">
<i class="fab fa-github"></i> Download on GitHub
</a>
</div>
</div>
</div>
</div>
<!-- Nintendo Switch -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/nintendo-switch.svg" alt="Nintendo Switch"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/android.svg" alt="Android"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/appletv.svg" alt="Apple TV"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/ios.svg" alt="iOS"/>
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/macos.svg" alt="macOS"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/XITRIX/Moonlight-Switch" target="_blank" class="text-white text-decoration-none">
Moonlight Switch
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-warning rounded-pill">Community</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/XITRIX/Moonlight-Switch/releases" target="_blank" class="btn btn-info">
<i class="fab fa-github"></i> Download on GitHub
</a>
</div>
</div>
</div>
</div>
<!-- Nintendo Wii U -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v12/icons/wiiu.svg" alt="Wii U"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/GaryOderNichts/moonlight-wiiu" target="_blank" class="text-white text-decoration-none">
Nintendo Wii U
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-warning rounded-pill">Community</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/GaryOderNichts/moonlight-wiiu#quick-start" target="_blank" class="btn btn-info">
<i class="fas fa-download"></i> Download
</a>
</div>
</div>
</div>
</div>
<!-- New Nintendo 3DS -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v12/icons/nintendo3ds.svg" alt="3DS"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/zoeyjodon/moonlight-N3DS" target="_blank" class="text-white text-decoration-none">
New Nintendo 3DS
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-warning rounded-pill">Community</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/zoeyjodon/moonlight-N3DS" target="_blank" class="btn btn-info">
<i class="fas fa-download"></i> Download
</a>
</div>
</div>
</div>
</div>
<!-- LG webOS TV -->
<div class="col-md-6 col-lg-4 mb-5">
<div class="card bg-dark text-white rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<div class="icon text-white">
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/lg.svg" alt="LG webOS TV"/>
</div>
<div class="ms-3">
<h5 class="fw-bolder mb-0">
<a href="https://github.com/mariotaku/moonlight-tv" target="_blank" class="text-white text-decoration-none">
LG webOS TV
</a>
</h5>
</div>
<div class="ms-auto">
<span class="badge text-bg-warning rounded-pill">Community</span>
</div>
</div>
</div>
<div class="card-footer p-3 px-4">
<div class="pb-3">
<a href="https://github.com/mariotaku/moonlight-tv#download" target="_blank" class="btn btn-info">
<i class="fas fa-download"></i> Download
</a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
@@ -535,7 +121,7 @@ ext-js:
<div class="container col-md-10">
<!-- Docs section -->
<section class="py-4" id="Docs">
<div class="card bg-dark text-white rounded-0">
<div class="card-custom shadow border-0 rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<i class="fa-fw fa-2x fas fa-book"></i>
@@ -548,7 +134,7 @@ ext-js:
</div>
</div>
<div class="card-footer p-3 px-4">
<a class="btn btn-outline-light me-3 mb-3" href="https://docs.lizardbyte.dev/projects/sunshine" target="_blank">
<a class="btn btn-outline-theme me-3 mb-3" href="https://docs.lizardbyte.dev/projects/sunshine" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/readthedocs.svg" alt="ReadTheDocs"/>
Read the Docs
</a>
@@ -558,7 +144,7 @@ ext-js:
<!-- Download section -->
<section class="py-4" id="Download">
<div class="card bg-dark text-white rounded-0">
<div class="card-custom shadow border-0 rounded-0">
<div class="card-body p-4">
<div class="d-flex align-items-center">
<i class="fa-fw fa-2x fas fa-download"></i>
@@ -571,7 +157,7 @@ ext-js:
</div>
</div>
<div class="card-footer p-3 px-4">
<a class="latest-button btn btn-outline-light me-3 mb-3 d-none" href="https://github.com/LizardByte/Sunshine/releases/latest" target="_blank">
<a class="latest-button btn btn-outline-theme me-3 mb-3 d-none" href="https://github.com/LizardByte/Sunshine/releases/latest" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/github.svg" alt="GitHub"/>
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/windows.svg" alt="Windows"/>
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/debian.svg" alt="Debian"/>
@@ -580,7 +166,7 @@ ext-js:
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/linux.svg" alt="AppImage"/>
Latest: <span id="latest-version" class="crowdin-ignore"></span>
</a>
<a class="beta-button btn btn-outline-light me-3 mb-3 d-none" href="#" target="_blank">
<a class="beta-button btn btn-outline-theme me-3 mb-3 d-none" href="#" target="_blank">
<i class="fa-fw fa-lg fas fa-flask"></i>
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/icons/windows.svg" alt="Windows"/>
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/debian.svg" alt="Debian"/>
@@ -589,19 +175,19 @@ ext-js:
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/linux.svg" alt="AppImage"/>
Beta: <span id="beta-version" class="crowdin-ignore"></span>
</a>
<a class="btn btn-outline-light me-3 mb-3" href="https://github.com/LizardByte/pacman-repo" target="_blank">
<a class="btn btn-outline-theme me-3 mb-3" href="https://github.com/LizardByte/pacman-repo" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/archlinux.svg" alt="Arch Linux"/>
Arch Linux
</a>
<a class="btn btn-outline-light me-3 mb-3" href="https://hub.docker.com/r/lizardbyte/sunshine" target="_blank">
<a class="btn btn-outline-theme me-3 mb-3" href="https://hub.docker.com/r/lizardbyte/sunshine" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/docker.svg" alt="Docker"/>
Docker
</a>
<a class="btn btn-outline-light me-3 mb-3" href="https://flathub.org/apps/dev.lizardbyte.app.Sunshine" target="_blank">
<a class="btn btn-outline-theme me-3 mb-3" href="https://flathub.org/apps/dev.lizardbyte.app.Sunshine" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/flathub.svg" alt="Flathub"/>
Flathub
</a>
<a class="btn btn-outline-light me-3 mb-3" href="https://github.com/LizardByte/homebrew-homebrew" target="_blank">
<a class="btn btn-outline-theme me-3 mb-3" href="https://github.com/LizardByte/homebrew-homebrew" target="_blank">
<img class="icon-sm invert" src="https://cdn.jsdelivr.net/npm/simple-icons@v14/icons/homebrew.svg" alt="Homebrew"/>
Homebrew
</a>