From bac3e5f03a69bced1b70f1b52d4093051ab278c5 Mon Sep 17 00:00:00 2001
From: Jose Celano <josecelano@gmail.com>
Date: Fri, 26 Jun 2026 17:47:01 +0100
Subject: [PATCH 1/2] feat: add demo shutdown banner and replace demo links
 with issue reference

Closes #228
---
 src/lib/components/organisms/Hero.svelte      |  4 +-
 .../singletons/TorrustIndexPost.svelte        |  2 +-
 src/lib/constants/constants.ts                |  4 +-
 src/routes/(home)/+page.svelte                |  2 +-
 src/routes/+layout.svelte                     | 39 +++++++++++++++++++
 5 files changed, 45 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/organisms/Hero.svelte b/src/lib/components/organisms/Hero.svelte
index 8cff33f..f250f7a 100644
--- a/src/lib/components/organisms/Hero.svelte
+++ b/src/lib/components/organisms/Hero.svelte
@@ -14,14 +14,14 @@
 				title={'index'}
 				details={'The Index is a feature-rich torrent indexing site split between an API (backend) built with Rust, and our reference web app that consumes the API, built with Vue 3.'}
 				version={'https://github.com/torrust/torrust-index/releases'}
-				liveDemo={'https://index.torrust-demo.com/torrents'}
+				liveDemo={'https://github.com/torrust/torrust-website/issues/228'}
 				learnMore={'/torrent-index'}
 			/>
 			<HeroCard
 				title={'tracker'}
 				details={'A lightweight Rust-based BitTorrent tracker for efficient torrent serving to many peers with high performance, robustness, security, and community support.'}
 				version={'https://github.com/torrust/torrust-tracker/releases'}
-				liveDemo={'https://index.torrust-demo.com/torrents'}
+				liveDemo={'https://github.com/torrust/torrust-website/issues/228'}
 				learnMore={'/torrent-tracker'}
 			/>
 		</div>
diff --git a/src/lib/components/singletons/TorrustIndexPost.svelte b/src/lib/components/singletons/TorrustIndexPost.svelte
index c5f583d..7936b9a 100644
--- a/src/lib/components/singletons/TorrustIndexPost.svelte
+++ b/src/lib/components/singletons/TorrustIndexPost.svelte
@@ -25,7 +25,7 @@
 			<p>
 				We have also taken into consideration cloud environments, making it easy to deploy the index
 				to multiple hosting providers (using either VMs or containers). We run a <a
-					href="https://index.torrust-demo.com/torrents">demo site</a
+					href="https://github.com/torrust/torrust-website/issues/228">demo site</a
 				>
 				on Digital Ocean to collect direct feedback about how easy it is to manage the application on
 				production. Our goal is to make sure sysadmins can:
diff --git a/src/lib/constants/constants.ts b/src/lib/constants/constants.ts
index db13c06..9e80f17 100644
--- a/src/lib/constants/constants.ts
+++ b/src/lib/constants/constants.ts
@@ -175,7 +175,7 @@ export const indexTableData = [
 		polls: 'No',
 		webfeed: 'No',
 		repo: 'https://github.com/torrust/torrust-index',
-		demo: 'https://index.torrust-demo.com/torrents'
+		demo: 'https://github.com/torrust/torrust-website/issues/228'
 	},
 	{
 		name: 'UNIT3D',
@@ -384,7 +384,7 @@ export const trackerTableData = [
 		language: 'Rust',
 		os: 'Linux,MacOs',
 		repo: 'https://github.com/torrust/torrust-tracker',
-		demo: 'udp://tracker.torrust-demo.com:6969/announce'
+		demo: 'https://github.com/torrust/torrust-website/issues/228'
 	},
 	{
 		name: 'Torrust-Actix',
diff --git a/src/routes/(home)/+page.svelte b/src/routes/(home)/+page.svelte
index dd1fbe9..25ceeaa 100644
--- a/src/routes/(home)/+page.svelte
+++ b/src/routes/(home)/+page.svelte
@@ -56,7 +56,7 @@
 		}
 	}
 
-	h2 {
+	.container {
 		text-align: center;
 		color: rgba(245, 245, 245, 0.96);
 		padding-top: 4rem;
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index d365d62..c20fe4d 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -36,6 +36,13 @@
 </script>
 
 <div id="app-container">
+	<div class="demo-shutdown-banner">
+		<p>
+			All public demo services are currently shut down.
+			<a href="https://github.com/torrust/torrust-website/issues/228" target="_blank">Learn more</a
+			>.
+		</p>
+	</div>
 	<Header />
 	<div bind:this={contentDiv} class="content">
 		{@render children?.()}
@@ -44,6 +51,38 @@
 </div>
 
 <style lang="scss">
+	.demo-shutdown-banner {
+		background-color: rgba(25, 25, 25, 0.98);
+		color: rgba(245, 245, 245, 0.96);
+		text-align: center;
+		padding: 0.6rem 1.5rem;
+		font-size: 0.9rem;
+		font-weight: 500;
+		line-height: 1.4;
+		border-bottom: 2px solid rgba(254, 13, 0, 1);
+		position: relative;
+
+		&::before {
+			content: '';
+			position: absolute;
+			left: 0;
+			top: 0;
+			bottom: 0;
+			width: 4px;
+			background-color: rgba(254, 13, 0, 1);
+		}
+
+		a {
+			color: rgba(254, 13, 0, 1);
+			text-decoration: underline;
+			font-weight: 600;
+
+			&:hover {
+				color: rgba(254, 13, 0, 0.7);
+			}
+		}
+	}
+
 	.content {
 		background: rgba(25, 25, 25, 1);
 		overflow-y: scroll;

From 26c69f701538f9eadfd6ee1156a4fd98013b24a9 Mon Sep 17 00:00:00 2001
From: Jose Celano <josecelano@gmail.com>
Date: Fri, 26 Jun 2026 18:54:27 +0100
Subject: [PATCH 2/2] fix: address PR review comments

- Add rel="noopener noreferrer" to banner link
- Update TorrustIndexPost text to reflect demo shutdown
- Change HeroCard button to show "Unavailable" when demo is down
- Fix duplicated .container CSS selector in homepage
- Replace broken demo links in blog posts with issue reference
---
 src/lib/components/atoms/HeroCard.svelte      | 16 +++++-
 .../singletons/TorrustIndexPost.svelte        |  6 +--
 src/lib/constants/constants.ts                | 52 +++++++++----------
 src/routes/(home)/+page.svelte                | 14 ++---
 src/routes/+layout.svelte                     |  5 +-
 .../blog/live-demo-beta-v3/+page.svelte       |  7 +--
 .../new-torrust-tracker-demo/+page.svelte     |  9 ++--
 src/routes/blog/released-v3-0-0/+page.svelte  |  8 +--
 .../+page.svelte                              |  8 ++-
 9 files changed, 72 insertions(+), 53 deletions(-)

diff --git a/src/lib/components/atoms/HeroCard.svelte b/src/lib/components/atoms/HeroCard.svelte
index cbfdcd4..61c44f1 100644
--- a/src/lib/components/atoms/HeroCard.svelte
+++ b/src/lib/components/atoms/HeroCard.svelte
@@ -10,6 +10,11 @@
 	}
 
 	let { title, details, version, liveDemo, learnMore }: Props = $props();
+
+	const isDemoUnavailable = $derived(
+		liveDemo === 'https://github.com/torrust/torrust-website/issues/228'
+	);
+	const demoLabel = $derived(isDemoUnavailable ? 'Unavailable' : 'Live demo');
 </script>
 
 <div class="details-card">
@@ -24,7 +29,9 @@
 		{details}
 	</p>
 	<div class="details-info">
-		<a href={liveDemo} class="live-demo" target="_blank">Live demo</a>
+		<a href={liveDemo} target="_blank" class="live-demo" class:unavailable={isDemoUnavailable}
+			>{demoLabel}</a
+		>
 		<a href={learnMore} class="learn-btn">Learn more</a>
 	</div>
 </div>
@@ -83,6 +90,13 @@
 			background-color: rgba(254, 13, 0, 1);
 		}
 
+		.live-demo.unavailable {
+			background-color: rgba(100, 100, 100, 0.6);
+			cursor: default;
+			opacity: 0.7;
+			pointer-events: none;
+		}
+
 		.learn-btn {
 			background-color: transparent;
 			border: none;
diff --git a/src/lib/components/singletons/TorrustIndexPost.svelte b/src/lib/components/singletons/TorrustIndexPost.svelte
index 7936b9a..ccbd1b8 100644
--- a/src/lib/components/singletons/TorrustIndexPost.svelte
+++ b/src/lib/components/singletons/TorrustIndexPost.svelte
@@ -24,11 +24,11 @@
 
 			<p>
 				We have also taken into consideration cloud environments, making it easy to deploy the index
-				to multiple hosting providers (using either VMs or containers). We run a <a
+				to multiple hosting providers (using either VMs or containers). We previously ran a <a
 					href="https://github.com/torrust/torrust-website/issues/228">demo site</a
 				>
-				on Digital Ocean to collect direct feedback about how easy it is to manage the application on
-				production. Our goal is to make sure sysadmins can:
+				on Digital Ocean to collect direct feedback, though all public demo services are currently shut
+				down. Our goal is to make sure sysadmins can:
 			</p>
 
 			<ul>
diff --git a/src/lib/constants/constants.ts b/src/lib/constants/constants.ts
index 9e80f17..934e731 100644
--- a/src/lib/constants/constants.ts
+++ b/src/lib/constants/constants.ts
@@ -150,7 +150,7 @@ export const indexTableData = [
 	{
 		name: 'Torrust',
 		license: 'AGPL-3.0',
-		stars: '38',
+		stars: '96',
 		contributors: '11',
 		type: 'General',
 		localHosted: 'No',
@@ -180,8 +180,8 @@ export const indexTableData = [
 	{
 		name: 'UNIT3D',
 		license: 'MIT',
-		stars: '1.8k',
-		contributors: '108',
+		stars: '2.4k',
+		contributors: '30',
 		type: 'General',
 		localHosted: 'No',
 		multiuser: 'Yes',
@@ -210,8 +210,8 @@ export const indexTableData = [
 	{
 		name: 'bitmagnet',
 		license: 'MIT    ',
-		stars: '1.8k',
-		contributors: '15',
+		stars: '4.1k',
+		contributors: '24',
 		type: 'General',
 		localHosted: 'Yes',
 		multiuser: 'No',
@@ -240,8 +240,8 @@ export const indexTableData = [
 	{
 		name: 'NexusPHP',
 		license: 'GPL-2.0',
-		stars: '771',
-		contributors: '16',
+		stars: '1.2k',
+		contributors: '24',
 		type: 'General',
 		localHosted: 'No',
 		multiuser: '?',
@@ -270,7 +270,7 @@ export const indexTableData = [
 	{
 		name: 'TorrentPier',
 		license: 'MIT',
-		stars: '260',
+		stars: '343',
 		contributors: '15',
 		type: 'Movies;Music',
 		localHosted: '?',
@@ -364,8 +364,8 @@ export const trackerTableData = [
 	{
 		name: 'Torrust',
 		license: 'AGPL-3.0',
-		stars: '312',
-		contributors: '13',
+		stars: '512',
+		contributors: '23',
 		type: 'Mixed',
 		udp: 'Yes',
 		http: 'No',
@@ -389,7 +389,7 @@ export const trackerTableData = [
 	{
 		name: 'Torrust-Actix',
 		license: 'MIT',
-		stars: '89',
+		stars: '140',
 		contributors: '2',
 		type: 'Mixed',
 		udp: 'Yes',
@@ -439,8 +439,8 @@ export const trackerTableData = [
 	{
 		name: 'bittorrent-tracker',
 		license: 'MIT',
-		stars: '1.7k',
-		contributors: '56',
+		stars: '1.9k',
+		contributors: '30',
 		type: '?',
 		udp: 'Yes',
 		http: 'Yes',
@@ -464,8 +464,8 @@ export const trackerTableData = [
 	{
 		name: 'Chihaya',
 		license: 'BSD 2-Clause',
-		stars: '1.4k',
-		contributors: '29',
+		stars: '1.5k',
+		contributors: '26',
 		type: 'mixed',
 		udp: 'Yes',
 		http: 'No',
@@ -490,7 +490,7 @@ export const trackerTableData = [
 		name: 'Ttorrent',
 		license: 'Apache-2.0',
 		stars: '1.4k',
-		contributors: '29',
+		contributors: '17',
 		type: 'Mixed',
 		udp: 'No',
 		http: 'No',
@@ -514,8 +514,8 @@ export const trackerTableData = [
 	{
 		name: 'aquatic',
 		license: 'Apache-2.0',
-		stars: '444',
-		contributors: '2',
+		stars: '608',
+		contributors: '6',
 		type: 'Open',
 		udp: 'Yes',
 		http: 'Yes',
@@ -539,7 +539,7 @@ export const trackerTableData = [
 	{
 		name: 'privtracker',
 		license: 'AGPL-3.0',
-		stars: '289',
+		stars: '812',
 		contributors: '3',
 		type: 'Private',
 		udp: 'No',
@@ -564,7 +564,7 @@ export const trackerTableData = [
 	{
 		name: 'XBT',
 		license: 'GPL-3.0?',
-		stars: '171',
+		stars: '211',
 		contributors: '4',
 		type: 'Mixed',
 		udp: 'Yes',
@@ -589,8 +589,8 @@ export const trackerTableData = [
 	{
 		name: 'mika',
 		license: 'MIT',
-		stars: '115',
-		contributors: '2',
+		stars: '120',
+		contributors: '1',
 		type: '?',
 		udp: 'No',
 		http: 'Yes',
@@ -614,8 +614,8 @@ export const trackerTableData = [
 	{
 		name: 'Radiance',
 		license: '?',
-		stars: '73',
-		contributors: '4',
+		stars: '79',
+		contributors: '5',
 		type: 'Private',
 		udp: 'Yes',
 		http: 'No',
@@ -639,8 +639,8 @@ export const trackerTableData = [
 	{
 		name: 'Ocelot',
 		license: 'Pending',
-		stars: '21',
-		contributors: '4',
+		stars: '412',
+		contributors: '0',
 		type: 'Mixed ',
 		udp: 'Yes',
 		http: 'No',
diff --git a/src/routes/(home)/+page.svelte b/src/routes/(home)/+page.svelte
index 25ceeaa..afc3855 100644
--- a/src/routes/(home)/+page.svelte
+++ b/src/routes/(home)/+page.svelte
@@ -54,14 +54,14 @@
 		@include bp.for-desktop-up {
 			max-width: 1176px;
 		}
-	}
 
-	.container {
-		text-align: center;
-		color: rgba(245, 245, 245, 0.96);
-		padding-top: 4rem;
-		font-size: 1.8rem;
-		font-weight: bold;
+		h2 {
+			text-align: center;
+			color: rgba(245, 245, 245, 0.96);
+			padding-top: 4rem;
+			font-size: 1.8rem;
+			font-weight: bold;
+		}
 	}
 
 	.grid {
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index c20fe4d..aab3066 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -39,7 +39,10 @@
 	<div class="demo-shutdown-banner">
 		<p>
 			All public demo services are currently shut down.
-			<a href="https://github.com/torrust/torrust-website/issues/228" target="_blank">Learn more</a
+			<a
+				href="https://github.com/torrust/torrust-website/issues/228"
+				target="_blank"
+				rel="noopener noreferrer">Learn more</a
 			>.
 		</p>
 	</div>
diff --git a/src/routes/blog/live-demo-beta-v3/+page.svelte b/src/routes/blog/live-demo-beta-v3/+page.svelte
index 3ad912c..e635251 100644
--- a/src/routes/blog/live-demo-beta-v3/+page.svelte
+++ b/src/routes/blog/live-demo-beta-v3/+page.svelte
@@ -32,7 +32,8 @@
 				</p>
 
 				<Callout type="info"
-					>Live demo: <a href="http://index.torrust-demo.com">http://index.torrust-demo.com</a
+					>Live demo: <a href="https://github.com/torrust/torrust-website/issues/228"
+						>https://github.com/torrust/torrust-website/issues/228</a
 					></Callout
 				>
 
@@ -44,8 +45,8 @@
 				</p>
 
 				<p>
-					You can test it at: <a href="http://index.torrust-demo.com"
-						>http://index.torrust-demo.com</a
+					You can test it at: <a href="https://github.com/torrust/torrust-website/issues/228"
+						>https://github.com/torrust/torrust-website/issues/228</a
 					>
 				</p>
 
diff --git a/src/routes/blog/new-torrust-tracker-demo/+page.svelte b/src/routes/blog/new-torrust-tracker-demo/+page.svelte
index 6a77fff..9dad557 100644
--- a/src/routes/blog/new-torrust-tracker-demo/+page.svelte
+++ b/src/routes/blog/new-torrust-tracker-demo/+page.svelte
@@ -54,10 +54,11 @@
 				<p>
 					For the past couple of years we have been running the
 					<a href="https://github.com/torrust/torrust-demo">Torrust Demo</a>, a combined Tracker +
-					Index solution hosted on a Digital Ocean droplet. The demo index is still available at
-					<a href="https://index.torrust-demo.com/torrents">index.torrust-demo.com/torrents</a>, and
-					the tracker it uses is linked to it so that every uploaded torrent automatically includes
-					the demo tracker URL.
+					Index solution hosted on a Digital Ocean droplet. The demo index was available at
+					<a href="https://github.com/torrust/torrust-website/issues/228"
+						>index.torrust-demo.com/torrents</a
+					>, and the tracker it used was linked to it so that every uploaded torrent automatically
+					included the demo tracker URL.
 				</p>
 
 				<p>
diff --git a/src/routes/blog/released-v3-0-0/+page.svelte b/src/routes/blog/released-v3-0-0/+page.svelte
index 48d40c9..77d95c9 100644
--- a/src/routes/blog/released-v3-0-0/+page.svelte
+++ b/src/routes/blog/released-v3-0-0/+page.svelte
@@ -104,9 +104,11 @@
 				<h2 id="important-notice-demo-availability">Important Notice: Demo Availability</h2>
 
 				<Callout type="warning">
-					Please note that the <a href="https://index.torrust-demo.com/">demo</a> environment may experience
-					downtime or resets as part of our ongoing testing. As this is a beta version, data may be lost
-					during these phases. We appreciate your patience and understanding as we fine-tune the system.
+					Please note that the <a href="https://github.com/torrust/torrust-website/issues/228"
+						>demo</a
+					> environment may experience downtime or resets as part of our ongoing testing. As this is a
+					beta version, data may be lost during these phases. We appreciate your patience and understanding
+					as we fine-tune the system.
 				</Callout>
 
 				<h2 id="special-thanks">Special Thanks</h2>
diff --git a/src/routes/blog/vortex-rust-bittorrent-client-review/+page.svelte b/src/routes/blog/vortex-rust-bittorrent-client-review/+page.svelte
index d7f2df3..d4f0b72 100644
--- a/src/routes/blog/vortex-rust-bittorrent-client-review/+page.svelte
+++ b/src/routes/blog/vortex-rust-bittorrent-client-review/+page.svelte
@@ -38,8 +38,8 @@
 					beyond—I wanted to understand how Vortex works, what makes it different, and share my
 					findings with others who are curious about modern BitTorrent implementations. This is a
 					hands-on exploration where I install Vortex, test it with a real torrent from the
-					<a href="https://index.torrust-demo.com/">Torrust Demo Index</a>, and document everything
-					I learn along the way.
+					<a href="https://github.com/torrust/torrust-website/issues/228">Torrust Demo Index</a>,
+					and document everything I learn along the way.
 				</p>
 
 				<Callout type="info">
@@ -216,9 +216,7 @@
 					<li><strong>Name:</strong> Arch Linux 2026.02.01 x86_64 ISO</li>
 					<li>
 						<strong>Torrust Index Link:</strong>
-						<a
-							href="https://index.torrust-demo.com/torrent/8e3f4283d1c8360d2f18544a8b166813086675a1/archlinux-20260201-x86-64iso"
-						>
+						<a href="https://github.com/torrust/torrust-website/issues/228">
 							archlinux-20260201-x86-64iso
 						</a>
 					</li>