Skip to content

Commit 2ee9880

Browse files
dddeviddddevid
authored
Update index.html
1 parent 792c5f0 commit 2ee9880

1 file changed

Lines changed: 106 additions & 33 deletions

File tree

‎index.html‎

Lines changed: 106 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -66,11 +66,11 @@
6666
"ratingCount": "150"
6767
},
6868
"description": "Musly is a beautiful, free Subsonic music client with an Apple Music-inspired interface. Stream music from your Subsonic, Navidrome, or Airsonic server on Android, iOS, Windows, Linux, and macOS.",
69-
"image": "https://github.com/dddevid/Musly/blob/master/assets/Musly%20Big%202X.png?raw=true",
70-
"screenshot": "https://github.com/dddevid/Musly/blob/website/screenshots/Screenshot_20260101_024751.png?raw=true",
69+
"image": "https://musly.devid.ink/assets/logo.png",
70+
"screenshot": "https://musly.devid.ink/assets/screenshot.png",
7171
"softwareVersion": "1.0.1",
7272
"downloadUrl": "https://github.com/dddevid/Musly/releases/tag/v1.0.1",
73-
"url": "https://dddevid.github.io/Musly/",
73+
"url": "https://musly.devid.ink/",
7474
"author": {
7575
"@type": "Organization",
7676
"name": "Musly Development"
@@ -596,6 +596,15 @@
596596
transform: translateY(0);
597597
}
598598

599+
@keyframes pulse-dot {
600+
0%, 100% {
601+
opacity: 1;
602+
}
603+
50% {
604+
opacity: 0.5;
605+
}
606+
}
607+
599608
html {
600609
scroll-behavior: smooth;
601610
}
@@ -652,6 +661,7 @@
652661
<ul class="nav-links">
653662
<li><a href="#features">Features</a></li>
654663
<li><a href="#platforms">Platforms</a></li>
664+
<li><a href="#roadmap">Roadmap</a></li>
655665
<li><a href="#download">Download</a></li>
656666
</ul>
657667
<button class="download-btn" onclick="scrollToDownload()" aria-label="Download Musly v1.0.1">
@@ -778,7 +788,99 @@ <h3>macOS</h3>
778788
</div>
779789
</section>
780790

781-
<section class="features" id="download" aria-labelledby="download-title" style="padding: 8rem 5%; background: rgba(28, 28, 30, 0.3);">
791+
<section class="roadmap" id="roadmap" aria-labelledby="roadmap-title" style="padding: 8rem 5%; background: rgba(0, 0, 0, 0.3);">
792+
<div class="section-title reveal">
793+
<h2 id="roadmap-title">Roadmap</h2>
794+
<p>What's coming next to Musly</p>
795+
</div>
796+
<div style="max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2rem; margin-top: 4rem;">
797+
<article class="feature-card reveal">
798+
<div class="feature-icon"><i class="fas fa-desktop"></i></div>
799+
<h3>Custom PC UX</h3>
800+
<p>A dedicated desktop-optimized interface designed specifically for larger screens, moving beyond the mobile-adapted layout.</p>
801+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(52, 199, 89, 0.15); border: 1px solid rgba(52, 199, 89, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #34C759; margin-top: 1rem;">
802+
<span style="width: 8px; height: 8px; background: #34C759; border-radius: 50%;"></span>
803+
Semi-Completed
804+
</div>
805+
</article>
806+
<article class="feature-card reveal">
807+
<div class="feature-icon"><i class="fas fa-car-side"></i></div>
808+
<h3>CarPlay Support</h3>
809+
<p>Native CarPlay integration with a dedicated browsing interface for safe and intuitive in-car music control.</p>
810+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(255, 159, 10, 0.15); border: 1px solid rgba(255, 159, 10, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #FF9F0A; margin-top: 1rem;">
811+
<span style="width: 8px; height: 8px; background: #FF9F0A; border-radius: 50%; animation: pulse-dot 2s ease-in-out infinite;"></span>
812+
In Planning
813+
</div>
814+
</article>
815+
<article class="feature-card reveal">
816+
<div class="feature-icon"><i class="fas fa-heart"></i></div>
817+
<h3>Last.fm Integration</h3>
818+
<p>Automatic scrobbling support and rich metadata for artists and albums from Last.fm's extensive database.</p>
819+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(255, 159, 10, 0.15); border: 1px solid rgba(255, 159, 10, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #FF9F0A; margin-top: 1rem;">
820+
<span style="width: 8px; height: 8px; background: #FF9F0A; border-radius: 50%; animation: pulse-dot 2s ease-in-out infinite;"></span>
821+
In Planning
822+
</div>
823+
</article>
824+
<article class="feature-card reveal">
825+
<div class="feature-icon"><i class="fas fa-layer-group"></i></div>
826+
<h3>Local Playlists</h3>
827+
<p>Create and manage playlists locally on your device, independent of the Subsonic server for greater flexibility.</p>
828+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(255, 159, 10, 0.15); border: 1px solid rgba(255, 159, 10, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #FF9F0A; margin-top: 1rem;">
829+
<span style="width: 8px; height: 8px; background: #FF9F0A; border-radius: 50%; animation: pulse-dot 2s ease-in-out infinite;"></span>
830+
In Planning
831+
</div>
832+
</article>
833+
<article class="feature-card reveal">
834+
<div class="feature-icon"><i class="fas fa-server"></i></div>
835+
<h3>Custom API Server</h3>
836+
<p>Support for custom backend implementations and extended APIs beyond standard Subsonic compatibility.</p>
837+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(255, 159, 10, 0.15); border: 1px solid rgba(255, 159, 10, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #FF9F0A; margin-top: 1rem;">
838+
<span style="width: 8px; height: 8px; background: #FF9F0A; border-radius: 50%; animation: pulse-dot 2s ease-in-out infinite;"></span>
839+
In Planning
840+
</div>
841+
</article>
842+
<article class="feature-card reveal">
843+
<div class="feature-icon"><i class="fas fa-sync"></i></div>
844+
<h3>Improved Sync</h3>
845+
<p>Enhanced synchronization capabilities for offline music, ensuring your library is always up to date.</p>
846+
<div style="display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(255, 159, 10, 0.15); border: 1px solid rgba(255, 159, 10, 0.3); border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #FF9F0A; margin-top: 1rem;">
847+
<span style="width: 8px; height: 8px; background: #FF9F0A; border-radius: 50%; animation: pulse-dot 2s ease-in-out infinite;"></span>
848+
In Planning
849+
</div>
850+
</article>
851+
</div>
852+
</section>
853+
854+
<section style="padding: 6rem 5%; background: rgba(28, 28, 30, 0.3);" aria-labelledby="compatibility-title">
855+
<div class="section-title reveal">
856+
<h2 id="compatibility-title">Compatible Subsonic Servers</h2>
857+
<p>Musly works seamlessly with all Subsonic-compatible music servers</p>
858+
</div>
859+
<div style="max-width: 1200px; margin: 3rem auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem;">
860+
<article class="platform-card reveal">
861+
<div class="platform-icon"><i class="fas fa-server"></i></div>
862+
<h3>Subsonic</h3>
863+
<p>Original Subsonic music server - full compatibility</p>
864+
</article>
865+
<article class="platform-card reveal">
866+
<div class="platform-icon"><i class="fas fa-compact-disc"></i></div>
867+
<h3>Navidrome</h3>
868+
<p>Modern, fast Subsonic server - fully supported</p>
869+
</article>
870+
<article class="platform-card reveal">
871+
<div class="platform-icon"><i class="fas fa-music"></i></div>
872+
<h3>Airsonic</h3>
873+
<p>Fork of Subsonic - complete integration</p>
874+
</article>
875+
<article class="platform-card reveal">
876+
<div class="platform-icon"><i class="fas fa-headphones"></i></div>
877+
<h3>Gonic</h3>
878+
<p>Lightweight Subsonic server - works perfectly</p>
879+
</article>
880+
</div>
881+
</section>
882+
883+
<section class="features" id="download" aria-labelledby="download-title" style="padding: 8rem 5%; background: rgba(0, 0, 0, 0.3);">
782884
<div class="section-title reveal">
783885
<h2 id="download-title">Download Musly - Free Subsonic Client</h2>
784886
<p>Get the latest stable release of the best Subsonic music client</p>
@@ -830,35 +932,6 @@ <h3 style="font-size: 1.5rem; margin-bottom: 1.5rem; display: flex; align-items:
830932
</div>
831933
</div>
832934
</section>
833-
834-
<section style="padding: 6rem 5%; background: rgba(0, 0, 0, 0.3);" aria-labelledby="compatibility-title">
835-
<div class="section-title reveal">
836-
<h2 id="compatibility-title">Compatible Subsonic Servers</h2>
837-
<p>Musly works seamlessly with all Subsonic-compatible music servers</p>
838-
</div>
839-
<div style="max-width: 1200px; margin: 3rem auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem;">
840-
<article class="platform-card reveal">
841-
<div class="platform-icon"><i class="fas fa-server"></i></div>
842-
<h3>Subsonic</h3>
843-
<p>Original Subsonic music server - full compatibility</p>
844-
</article>
845-
<article class="platform-card reveal">
846-
<div class="platform-icon"><i class="fas fa-compact-disc"></i></div>
847-
<h3>Navidrome</h3>
848-
<p>Modern, fast Subsonic server - fully supported</p>
849-
</article>
850-
<article class="platform-card reveal">
851-
<div class="platform-icon"><i class="fas fa-music"></i></div>
852-
<h3>Airsonic</h3>
853-
<p>Fork of Subsonic - complete integration</p>
854-
</article>
855-
<article class="platform-card reveal">
856-
<div class="platform-icon"><i class="fas fa-headphones"></i></div>
857-
<h3>Gonic</h3>
858-
<p>Lightweight Subsonic server - works perfectly</p>
859-
</article>
860-
</div>
861-
</section>
862935
</main>
863936

864937
<footer>

0 commit comments

Comments
 (0)