mirror of
https://github.com/LizardByte/Sunshine.git
synced 2025-03-28 19:20:26 +00:00
docs(website): add clients section (#2791)
This commit is contained in:
ReenigneArcher
GitHub
parent
4552f142d7
commit
defd98d3f5
@ -164,7 +164,8 @@
|
||||
<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.
|
||||
for Windows, macOS, Linux, Android, iOS, Xbox, and more. See
|
||||
<a class="text-white" href="#Clients">clients</a> for more information.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -251,6 +252,351 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Clients section-->
|
||||
<section class="offset-anchor bg-dark 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 -->
|
||||
<div class="row gx-5">
|
||||
|
||||
<!-- Android -->
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card bg-dark-gray 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 fab fa-android"></i>
|
||||
</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>
|
||||
</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 ms-3">
|
||||
<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-gray 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 fab fa-chrome"></i>
|
||||
</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 ms-3">
|
||||
<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-gray 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 fab fa-apple"></i>
|
||||
</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 ms-3">
|
||||
<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-gray 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 fab fa-linux"></i>
|
||||
<i class="fa-fw fa-2x fab fa-apple"></i>
|
||||
<i class="fa-fw fa-2x fab fa-windows"></i>
|
||||
<i class="fa-fw fa-2x fab fa-steam"></i>
|
||||
</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 ms-3">
|
||||
<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-gray 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">
|
||||
<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 ms-3">
|
||||
<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-gray 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 fab fa-xbox"></i>
|
||||
</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">
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer p-3 ms-3">
|
||||
<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">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PS Vita -->
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card bg-dark-gray 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 fab fa-playstation"></i>
|
||||
</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 ms-3">
|
||||
<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-gray 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-code"></i>
|
||||
</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">
|
||||
Nintendo 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 ms-3">
|
||||
<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-gray 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-code"></i>
|
||||
</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 ms-3">
|
||||
<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>
|
||||
|
||||
<!-- LG webOS TV -->
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card bg-dark-gray 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-code"></i>
|
||||
</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 ms-3">
|
||||
<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>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- More cards -->
|
||||
<div class="container py-5 px-auto">
|
||||
<div class="container col-md-10">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user