Proposal for new frontpage

docs/index.md

@@ -4,30 +4,23 @@ hide:
   - toc
 layout: default
 title: Home
+template: home.html
+
+features:
+  - title: Perfect multi-room sync
+    bullets:
+      - "Lyrion offers rock-solid millisecond-accurate synchronization across your entire home, ensuring your music stays perfectly in beat throughout the entire house."
+      - "The system effortlessly syncs diverse hardware, allowing old and new devices to play together as one seamless audio network."
+    image: multi-room.png
+  - title: True ownership
+    bullets:
+      - "Lyrion offers first-class support to your local music, giving you full control and high-fidelity access to your own music collection without relying on the cloud."
+      - "It perfectly integrates your personal files with modern streaming services into one unified library, offering the ultimate hybrid listening experience."
+    image: local-library.png
+  - title: Future-Proof and keeps old hardware alive
+    bullets:
+      - "Lyrion's open-source core ensures it evolves with the community, staying relevant long after traditional systems fade."
+      - "You can brilliantly repurpose vintage hardware into a modern, high-fidelity multi-room audio setup."
+    image: "future-proof.png"
 ---
-
-<style>
-.md-content {
-  max-width: 900px;
-  margin-left: auto;
-  margin-right: auto;
-}
-</style>
-
-# Lyrion Music Server (LMS)
-
-Lyrion Music Server (formerly Logitech Media Server, and often abbreviated as "LMS" ) is open-source software which can control and serve (stream) music to a wide range of physical and virtual audio players called [Squeezeboxes](players-and-controllers/index.md). Lyrion Music Server can stream your local music collection, internet radio stations, and content from many streaming services (with and without subscriptions).
-
-<figure markdown="span">
-  ![](assets/screenshot.png){ width="600" }
-</figure>
-
-## The Lyrion Music Server (LMS) ecosystem
-
-In 2000, Squeezebox players hit the market as hardware and software developed by Slim Devices, later acquired by Logitech. A wide array of hardware and software solutions make up the LMS ecosystem of servers and players for many different operating systems, and these have changed many times over the years.
-
-For a LMS system, there will need to be server software running on a controlling computer or device. This provides connections, settings, and customizations to one or more music players. The peer user community is committed to developing the Lyrion software for a wide variety of common and easily obtained devices such as a Windows or Mac computer, tablets and phones, and Raspberry Pi. Because of its scalability, all of these services can be distributed across separate devices to support libraries of hundreds of thousands of tracks and numerous players distributing music throughout an entire house and even across multiple locations.
-
-With Lyrion, you have greater control and customization of your music - how the server works, how you interact with it, and what it looks like.  You have the ability to use the same interface to access your music on almost any device, and to select the appropriate player for every need. There is wide support by the LMS community to add new functionality, fix issues, integrate with other products, and help support users to get the most enjoyment from their music.
-
-If you're new to Lyrion, click on [Getting Started with LMS](getting-started/index.md) to learn more.
+{newline}

docs/learn-more.md

@@ -0,0 +1,133 @@
+---
+hide:
+  - navigation
+  - toc
+layout: default
+title: Learn more about Lyrion Music Server
+---
+<style>
+.md-content {
+  max-width: 900px;
+  margin-left: auto;
+  margin-right: auto;
+}
+</style>
+
+# Learn more about Lyrion Music Server
+<p style="margin-top: -1.5rem; font-size: 1.1rem; color: gray;">Free your music.</p>
+
+## :material-music: What is Lyrion?
+
+**Lyrion Music Server**, formerly known as Logitech Media Server (LMS) or SlimServer, is a mature, community-driven, open-source audio streaming platform. It acts as a central hub for your music, allowing you to stream your personal local music collection (MP3, FLAC, ALAC, DSD, etc.) alongside major internet streaming services to any room in your house.
+
+Unlike many modern alternatives, Lyrion is completely independent of any single hardware brand or cloud service. It is designed to be lightweight enough to run on a low-power Raspberry Pi, yet powerful enough to manage libraries containing hundreds of thousands of tracks on desktop class hardware or NAS devices.
+
+* Perfect multi-room sync
+* Play you own music
+* Give life to old devices
+
+<!--<figure markdown="span">
+  ![](assets/lyrion-material-screenshot.png){ width="800" }
+</figure>-->
+
+=== "Material skin"
+    ![Material skin](assets/lyrion-material-screenshot.png)
+
+=== "Default skin"
+    ![Default skin](assets/screenshot.png)
+
+=== "Jivelite"
+    ![Jivelite](players-and-controllers/assets/jivelite.jpg)
+
+
+## :material-star-shooting: Why Choose Lyrion?
+
+Lyrion is the premier choice for music enthusiasts who value control and longevity. While commercial systems often lock you into specific hardware or monthly fees, Lyrion offers:
+
+<div class="grid cards" markdown>
+
+-   :material-clock-fast:{ .lg .middle } __Lyrion runs everywhere__
+
+    ---
+
+    It runs on almost anything, from a vintage laptop to a high-end NAS, Raspberry Pi, or Docker container.
+
+    [:octicons-arrow-right-24: Getting started](getting-started/index.md)
+
+-   :material-human-greeting-variant:{ .lg .middle } __Community powered__
+
+    ---
+
+    Being open-source means the system is built by people who actually use it. On our forums you will find a welcoming community.
+
+    [:octicons-arrow-right-24: Forums](https://forums.lyrion.org/)
+
+-   :material-home-heart:{ .lg .middle } __True ownership__
+
+    ---
+
+    Your data and library remain yours. No mandatory cloud accounts, tracking, or unexpected subscription hikes.
+
+-   :material-rocket-launch:{ .lg .middle } __Future-Proof__
+
+    ---
+
+    You are never at the mercy of a single company's financial decisions or discontinued product lines.
+
+-   :material-puzzle:{ .lg .middle } __Extremely extensible__
+
+    ---
+
+    There are [plugins](plugins/index.md) and [extensions](extensions/applications/index.md) created for every use case imaginable.
+
+    [:octicons-arrow-right-24: Plugins](plugins/directory.md)
+
+-   :material-scale-balance:{ .lg .middle } __Open Source__
+
+    ---
+
+    For over 25 years Lyrion has been open-source! The sourcecode is available on [GitHub](https://github.com/LMS-Community).
+
+    [:octicons-arrow-right-24: License](https://github.com/LMS-Community/slimserver?tab=License-1-ov-file)
+
+</div>
+
+## :material-rocket-launch: Lyrion philosophy
+
+Based on the Lyrion philosophy, the system is built on these four pillars:
+
+1.  **Free Software:** Completely open-source and free to use forever.
+2.  **Hardware Agnostic:** Although originally designed for [Squeezebox audio players](players-and-controllers/index.md#squeezebox-hardware-discontinued), Lyrion has evolved to be hardware agnostic supporting all of the common standards like AirPlay receivers, Chromecasts, or DIY players (like Squeezelite).
+3.  **Massive Scalability:** Effortlessly handles libraries with 100,000+ tracks with lightning-fast indexing and search.
+4.  **Perfect Multi-room:** Achieve sample-accurate synchronization across your entire home, regardless of the different hardware brands you use.
+
+## :material-details: Detailed Feature Analysis
+
+### 1. The Power of Plugins
+Lyrion’s greatest asset is its community repository. Lyrion allows you to "bolt on" features to suit your specific needs:
+
+*   **Material Skin:** A modern, responsive web interface that transforms the look into a sleek, contemporary app experience.
+*   **Streaming services:** All the major streaming services are supported, allowing full library integration for a seamless experience.
+*   **Music and Artist Information:** Automatically pulls biographies, lyrics, and high-quality artwork from multiple web sources.
+*   **Bridge Plugins:** Use the UPnP/DLNA, Chromecast, and AirPlay bridges to turn almost any smart speaker into a Lyrion player.
+*   **DSD support:** Supports DSD64, DSD128, and DSD256. Through the **DSDPlayer plugin**, it handles `.dsf` and `.dff` files. It offers "Native DSD" for supported DACs on Linux/Windows and "DoP" (DSD over PCM) for macOS and hardware-limited bridges. Also, it can transcode DSD streams to players that don't natively support them.
+
+### 2. Interfaces and Customization
+Lyrion isn't locked into a single "look." Users can choose their experience:
+
+*   **Default Web UI**: The original, desktop-oriented interface for straightforward library management and player control.
+*   **Material Skin:** The gold standard for modern browsers and mobile devices.
+*   **Classic Web UI:** Lightweight and functional for older hardware.
+*   **JiveLite:** A specialized interface for local displays, perfect for Raspberry Pi touchscreens.
+
+### 3. Metadata and Library Management
+Lyrion is famous for its ability to handle complex libraries where others fail.
+
+*   **Classical Music Support:** Proper handling of "Works," "Conductors," and "Composers."
+*   **Box Set Management:** Intelligent grouping of multi-disc sets.
+*   **On-the-fly Transcoding:** The server can downsample hi-res files in real-time for older devices while maintaining the original quality for your main Hi-Fi system.
+
+
+## :octicons-move-to-end-24: Getting started
+
+Convinced and want to try it out? Click on [Getting Started with LMS](getting-started/index.md) to learn more.

docs/overrides/home.css

@@ -0,0 +1,198 @@
+.home h1,
+.home h2,
+.home p,
+.home ul,
+.home li,
+.home a,
+.home span {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	text-decoration: none;
+}
+
+/*@media only screen and (min-width: 76.25em) {
+	.md-main__inner {
+		max-width: 100%;
+	}
+	.md-sidebar--primary {
+		left: 0;
+	}
+	.md-sidebar--secondary {
+		right: 0;
+		margin-left: 0;
+		-webkit-transform: none;
+		transform: none;
+	}
+}*/
+
+.home {
+	box-sizing: border-box;
+	margin: 0 auto;
+	max-width: 1300px;
+	padding-top: 50px;
+	width: 80%;
+}
+
+
+.Lyrion {
+	margin: 0px auto 100px auto;
+	max-width: 1300px;
+	text-align: left;
+}
+
+.Lyrion img {
+	width: 100%;
+}
+
+.title {
+	margin-bottom: 30px;
+}
+
+.title h1 {
+	font-size: 50px;
+	font-weight: bold;
+}
+
+.title h2 {
+	font-size: 32px;
+	font-weight: 600;
+}
+
+.Lyrion p {
+	font-weight: medium;
+	font-size: 20px;
+	margin-bottom: 50px;
+}
+
+.download-hyperlink {
+	text-align: center;
+}
+
+.download-hyperlink a:hover {
+	background-color: black;
+	color: #e1fcc4;
+}
+
+.download-hyperlink h2{
+	font-size: 35px;
+	font-weight: 600;
+	margin-bottom: 20px;
+}
+
+.upper-button {
+	margin-top: 75px;
+}
+
+.upper-button a {
+	border: solid 2px black;
+	display: inline-block;
+	font-weight: medium;
+	font-size: 30px;
+	padding: 10px 20px;
+	text-align: center;
+	transition: all 0.2s;
+}
+
+.feature {
+	display: inline-flex;
+	margin-bottom: 125px;
+}
+
+.feature:last-child {
+	margin-bottom: 0px;
+}
+
+.feature-left {
+	flex-direction: row-reverse;
+}
+
+.feature img {
+	align-self: flex-start;
+	width: 60%;
+}
+
+.feature-text {
+	box-sizing: border-box;
+	margin-bottom: 50px;
+	width: 40%;
+}
+
+.feature-left .feature-text {
+	padding-left: 20px;
+}
+
+.feature-right .feature-text {
+	padding-right: 20px;
+}
+
+.feature > * {
+	display: inline-block;
+}
+
+.feature-text h2 {
+	font-weight: bold;
+	font-size: 42px;
+	margin-bottom: 30px;
+}
+
+.feature-description-container {
+	display: flex;
+	flex-direction: column;
+}
+
+.feature-description {
+	display: inline-flex;
+	margin-bottom: 20px;
+}
+
+.feature-description:last-child {
+	margin-bottom: 0px;
+}
+
+.feature-description .bullet-point {
+	color: #e1fcc4;
+	font-weight: 600;
+	margin-right: 5px;
+}
+
+.feature-description p {
+	display: inline-block;
+	font-weight: medium;
+	font-size: 21px;
+}
+
+.feature-link {
+	display: none;
+	font-size: 18px;
+	margin-top: 20px;
+}
+
+.feature-link a {
+	color: var(--md-accent-fg-color);
+	display: block;
+	transition: all 0.2s;
+}
+
+.feature-link .documentation-link {
+	margin-bottom: 7px;
+}
+
+.feature-link a:hover{
+	color: #c53d13;
+}
+
+.bottom-button {
+	margin: 100px 0px;
+}
+
+.bottom-button a {
+	border: solid 2px black;
+	display: inline-block;
+	font-weight: medium;
+	font-size: 30px;
+	padding: 10px 20px;
+	text-align: center;
+	transition: all 0.2s;
+}
+