danvics/debrid-services-comparison
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Enhance header and footer design; update navigation links and descriptions

Browse source 
- Added a blurred background to the header for improved aesthetics.
- Introduced a logo wrapper with glow effect and separated logo text into primary and secondary spans.
- Updated navigation links to include text spans for better accessibility.
- Revamped hero section text for clarity and conciseness.
- Simplified section descriptions throughout the document for better readability.
- Enhanced footer with new logo design, tagline, and statistics icons.
- Updated quick links and resources in the footer with icons for visual appeal.
- Improved copyright and last updated information styling in the footer.
This commit is contained in:
fynks 2025-10-11 11:25:59 +05:00
parent b70a908985
commit 350e1367d9
2 changed files with 809 additions and 395 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

920
dist/css/styles.css vendored
View file

File diff suppressed because it is too large Load diff

284
dist/index.html vendored
View file

@ -273,41 +273,70 @@
<a class="skip-link" href="#main-content">Skip to main content</a>
<div class="page-wrapper">
<header class="site-header">
<div class="header-blur-bg"></div>
<div class="container">
<div class="header-content">
<a href="/" class="site-title">
<svg class="logo-icon" role="img" aria-label="Debrid Comparison Logo">
<use href="#icon-logo" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
Debrid Compare
<div class="logo-wrapper">
<svg class="logo-icon" role="img" aria-label="Debrid Comparison Logo">
<use href="#icon-logo" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
<div class="logo-glow"></div>
</div>
<span class="logo-text">
<span class="logo-primary">Debrid</span>
<span class="logo-secondary">Compare</span>
</span>
</a>
<nav id="primary-navigation" class="header-nav" aria-label="Main navigation" aria-hidden="true"
role="navigation">
<a href="#what-are-debrid-services" class="nav-link">Intro</a>
<a href="#debrid-pricing-comparison" class="nav-link">Pricing</a>
<a href="#supported-file-hosts" class="nav-link">Hosts</a>
<a href="#compare-debrid-services" class="nav-link">Compare</a>
<a href="#adult-content-file-hosts" class="nav-link">Adult Hosts</a>
<a href="#refund-policies-legal" class="nav-link">Policies</a>
<a href="#debrid-speed-test" class="nav-link">Speed Test</a>
<a href="#service-status-monitoring" class="nav-link">Status</a>
<a href="#debrid-resources-tools" class="nav-link">Resources</a>
<a href="#what-are-debrid-services" class="nav-link">
<span class="nav-link-text">Intro</span>
</a>
<a href="#debrid-pricing-comparison" class="nav-link">
<span class="nav-link-text">Pricing</span>
</a>
<a href="#supported-file-hosts" class="nav-link">
<span class="nav-link-text">Hosts</span>
</a>
<a href="#compare-debrid-services" class="nav-link">
<span class="nav-link-text">Compare</span>
</a>
<a href="#adult-content-file-hosts" class="nav-link">
<span class="nav-link-text">Adult Hosts</span>
</a>
<a href="#refund-policies-legal" class="nav-link">
<span class="nav-link-text">Policies</span>
</a>
<a href="#debrid-speed-test" class="nav-link">
<span class="nav-link-text">Speed Test</span>
</a>
<a href="#service-status-monitoring" class="nav-link">
<span class="nav-link-text">Status</span>
</a>
<a href="#debrid-resources-tools" class="nav-link">
<span class="nav-link-text">Resources</span>
</a>
</nav>
<div class="header-actions">
<button id="darkModeToggle" class="dark-mode-toggle" aria-label="Toggle dark mode"
type="button">
<svg class="sun-icon" role="img" aria-hidden="true">
<use href="#icon-sun" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
<svg class="moon-icon" role="img" aria-hidden="true">
<use href="#icon-moon" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
<div class="theme-toggle-inner">
<svg class="sun-icon" role="img" aria-hidden="true">
<use href="#icon-sun" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
<svg class="moon-icon" role="img" aria-hidden="true">
<use href="#icon-moon" stroke="currentColor" stroke-width="2" fill="none" />
</svg>
</div>
</button>
<button class="nav-toggle" id="navToggle" aria-label="Open navigation menu"
aria-controls="primary-navigation" aria-expanded="false" type="button">
<span class="nav-toggle-bar"></span>
<span class="nav-toggle-bar"></span>
<span class="nav-toggle-bar"></span>
<span class="nav-toggle-icon">
<span class="nav-toggle-bar"></span>
<span class="nav-toggle-bar"></span>
<span class="nav-toggle-bar"></span>
</span>
</button>
</div>
</div>
@ -324,8 +353,8 @@
Compare Premium <span class="gradient-text">Debrid Services</span>
</h1>
<p class="hero-description">
A community-driven, up-to-date comparison of premium debrid and multi-hoster services: pricing, 400+ file host support,
refund policies, speed tests, and real-time performance monitoring.
Compare pricing, features, and 400+ file hosts across 9 premium debrid services.
Find the perfect multi-hoster for your needs.
</p>
<div class="hero-actions">
<a href="#debrid-pricing-comparison" class="btn btn-primary">View Pricing</a>
@ -352,8 +381,7 @@
<div class="section-header">
<h2 id="what-title" class="section-title">What are Debrid Services? Premium Link Generators Explained</h2>
<p class="section-description">
Debrid services (also known as premium link generators or multi-hosters) act as a high‑speed intermediary: they
fetch files from any supported host, then serve you a fast, ad‑free direct link for streaming or downloading.
Debrid services fetch files from any supported host and serve you fast, ad-free direct links for streaming or downloading.
</p>
<div class="meta-chips" aria-label="Key traits">
<span class="chip">Premium link generator</span>
@ -420,7 +448,7 @@
<div class="content-container">
<div class="section-header">
<h2 id="pricing-title" class="section-title">Debrid Service Pricing Comparison 2025</h2>
<p class="section-description">Compare subscription plans and costs across all major debrid services - from free trials to yearly plans
<p class="section-description">Compare subscription costs across all major debrid services.
</p>
</div>
@ -597,11 +625,9 @@
<div class="content-container">
<div class="section-header">
<h2 id="hosts-title" class="section-title">Supported File Hosts - 400+ Services Compared</h2>
<p class="section-description">Browse and search through 400+ supported file hosting services including Mega, Rapidgator, Uptobox, and more
</p>
</div>
<div class="search-section">
<p class="section-description">Browse 400+ supported file hosting services.
</p>
</div> <div class="search-section">
<form class="search-container" role="search" aria-label="Search file hosts"
onsubmit="return false">
<svg class="search-icon" role="img" aria-hidden="true">
@ -636,7 +662,7 @@
<div class="content-container">
<div class="section-header">
<h2 id="compare-title" class="section-title">Compare Debrid Services Side-by-Side</h2>
<p class="section-description">Select two debrid services to see a detailed side-by-side comparison of features, pricing, and host support
<p class="section-description">See a detailed side-by-side comparison of any two services.
</p>
</div>
@ -683,9 +709,7 @@
<div class="section-header">
<h2 id="adult-hosts-title" class="section-title">Adult Content File Hosts Support</h2>
<p class="section-description">
Support for adult content varies significantly across debrid services. Compare which platforms
actively support major adult file hosts, while others exclude them entirely due to
policy or legal considerations.
Compare which debrid services support major adult file hosts.
</p>
</div>
@ -728,8 +752,7 @@
<div class="section-header">
<h2 id="policies-title" class="section-title">Refund Policies, Terms of Service & Legal Information</h2>
<p class="section-description">
Official Terms of Service, Privacy Policies, Refund Policies, and Support pages for each debrid provider. Refund eligibility
varies widely; always verify before purchase.
Review terms, privacy policies, and refund options for each service.
</p>
</div>
@ -838,8 +861,7 @@
<div class="section-header">
<h2 id="speed-title" class="section-title">Debrid Service Speed Test & Performance</h2>
<p class="section-description">
Test download speeds for debrid services. Actual speeds vary by location, time of day, host performance, and server load. Test before
committing to a long-term plan.
Test download speeds for each service. Results vary by location and server load.
</p>
</div>
@ -985,8 +1007,7 @@
<div class="section-header">
<h2 id="notes-title" class="section-title">Important Information & Disclaimers</h2>
<p class="section-description">
This project aims to provide accurate and up-to-date information about debrid services, but the debrid service
landscape is dynamic and constantly changing.
Information is updated regularly but debrid services change frequently. Verify details on official sites.
</p>
</div>
@ -1073,8 +1094,7 @@
<div class="content-container">
<div class="section-header">
<h2 id="resources-title" class="section-title">Debrid Resources, Tools & Community</h2>
<p class="section-description">Enhance your debrid experience with these trusted tools,
browser extensions, guides, and active communities</p>
<p class="section-description">Discover browser extensions, tools, guides, and communities to enhance your debrid experience.</p>
</div>
<div class="resources-categories enhanced-resources">
@ -1210,36 +1230,93 @@
<!-- Footer -->
<footer class="site-footer" role="contentinfo">
<div class="footer-grid-bg"></div>
<div class="container">
<div class="content-container">
<div class="footer-content improved">
<div class="footer-section">
<div class="footer-content">
<div class="footer-section footer-brand-section">
<div class="footer-brand">
<svg class="footer-logo" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2">
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" />
</svg>
<h4>Debrid Compare</h4>
<div class="footer-logo-wrapper">
<svg class="footer-logo" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2">
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" />
</svg>
<div class="footer-logo-glow"></div>
</div>
<div class="footer-brand-text">
<h4>Debrid Compare</h4>
<p class="footer-tagline">Your Ultimate Comparison Hub</p>
</div>
</div>
<p class="footer-description">
A comprehensive, community-driven comparison of premium debrid services.
Compare pricing, features, and host support to find the best service for your needs.
</p>
<div class="footer-stats">
<span class="footer-stat">9 Services</span>
<span class="footer-stat">400+ Hosts</span>
<div class="footer-stat">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
<circle cx="9" cy="7" r="4"></circle>
<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
</svg>
<span>9 Services</span>
</div>
<div class="footer-stat">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="2" y="7" width="20" height="14" rx="2" ry="2"></rect>
<path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path>
</svg>
<span>400+ Hosts</span>
</div>
</div>
</div>
<div class="footer-section">
<h5>Quick Links</h5>
<ul class="footer-links">
<li><a href="#debrid-pricing-comparison">Pricing Comparison</a></li>
<li><a href="#supported-file-hosts">File Hosts</a></li>
<li><a href="#compare-debrid-services">Compare Services</a></li>
<li><a href="#refund-policies-legal">Policies & Legal</a></li>
<li><a href="#debrid-speed-test">Speed Tests</a></li>
<li><a href="#service-status-monitoring">Service Status</a></li>
<li><a href="#debrid-pricing-comparison">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
Pricing Comparison
</a></li>
<li><a href="#supported-file-hosts">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path>
<polyline points="13 2 13 9 20 9"></polyline>
</svg>
File Hosts
</a></li>
<li><a href="#compare-debrid-services">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
</svg>
Compare Services
</a></li>
<li><a href="#refund-policies-legal">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
<polyline points="14 2 14 8 20 8"></polyline>
<line x1="16" y1="13" x2="8" y2="13"></line>
<line x1="16" y1="17" x2="8" y2="17"></line>
<polyline points="10 9 9 9 8 9"></polyline>
</svg>
Policies & Legal
</a></li>
<li><a href="#debrid-speed-test">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M23 12a11.05 11.05 0 0 0-22 0zm-5 7a3 3 0 0 1-6 0z"></path>
</svg>
Speed Tests
</a></li>
<li><a href="#service-status-monitoring">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline>
</svg>
Service Status
</a></li>
</ul>
</div>
@ -1247,13 +1324,46 @@
<h5>Resources</h5>
<ul class="footer-links">
<li><a href="https://github.com/debridmediamanager/awesome-debrid" target="_blank"
rel="noopener noreferrer">Awesome Debrid</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<polyline points="16 18 22 12 16 6"></polyline>
<polyline points="8 6 2 12 8 18"></polyline>
</svg>
Awesome Debrid
</a></li>
<li><a href="https://github.com/debridmediamanager/debrid-media-manager" target="_blank"
rel="noopener noreferrer">DMM Tool</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
<line x1="12" y1="8" x2="12" y2="16"></line>
<line x1="8" y1="12" x2="16" y2="12"></line>
</svg>
DMM Tool
</a></li>
<li><a href="https://github.com/rogerfar/rdt-client" target="_blank"
rel="noopener noreferrer">RDT Client</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"></circle>
<line x1="2" y1="12" x2="22" y2="12"></line>
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
</svg>
RDT Client
</a></li>
<li><a href="https://github.com/g0ldyy/comet" target="_blank"
rel="noopener noreferrer">Comet Addon</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
Comet Addon
</a></li>
</ul>
</div>
@ -1261,11 +1371,31 @@
<h5>Project</h5>
<ul class="footer-links">
<li><a href="https://github.com/fynks/debrid-services-comparison" target="_blank"
rel="noopener noreferrer">Source Code</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
</svg>
Source Code
</a></li>
<li><a href="https://github.com/fynks/debrid-services-comparison/issues" target="_blank"
rel="noopener noreferrer">Report Issues</a></li>
rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"></circle>
<line x1="12" y1="8" x2="12" y2="12"></line>
<line x1="12" y1="16" x2="12.01" y2="16"></line>
</svg>
Report Issues
</a></li>
<li><a href="https://github.com/fynks/debrid-services-comparison/blob/main/CONTRIBUTING.md"
target="_blank" rel="noopener noreferrer">Contribute</a></li>
target="_blank" rel="noopener noreferrer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
<circle cx="8.5" cy="7" r="4"></circle>
<line x1="20" y1="8" x2="20" y2="14"></line>
<line x1="23" y1="11" x2="17" y2="11"></line>
</svg>
Contribute
</a></li>
</ul>
</div>
</div>
@ -1273,16 +1403,24 @@
<div class="footer-bottom">
<div class="footer-bottom-content">
<div class="footer-left">
<p>&copy; 2025 Debrid Services Comparison. <span class="made-with">Made with ❤️</span>
by <a href="https://github.com/fynks" target="_blank"
rel="noopener noreferrer">Fynks</a></p>
<p class="footer-disclaimer">This is an independent, open-source project not affiliated
with any debrid service.</p>
<p class="footer-copyright">
&copy; 2025 <strong>Debrid Services Comparison</strong>.
<span class="made-with">Made with <span class="heart-icon">❤️</span></span>
by <a href="https://github.com/fynks" target="_blank" rel="noopener noreferrer">Fynks</a>
</p>
<p class="footer-disclaimer">
This is an independent, open-source project not affiliated with any debrid service.
</p>
</div>
<div class="footer-right">
<div class="footer-meta">
<span class="last-updated">Last updated: <time datetime="2025-09-16">September 16,
2025</time></span>
<span class="last-updated">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
<time datetime="2025-09-16">Sep 16, 2025</time>
</span>
<a href="https://github.com/fynks/debrid-services-comparison" target="_blank"
rel="noopener noreferrer" class="github-link"
aria-label="View source on GitHub">