CakhiaTV Sports Streaming Portal

Overview

CakhiaTV is a high-traffic sports streaming portal designed for real-time data delivery and content-heavy engagement. It serves as an excellent reference for cloning complex information architectures that combine live data filtering, sticky navigation, and SEO-optimized long-form content.

Design System

• Color Palette & Visual Hierarchy: The site uses a deep "Dark Mode" foundation (rgb(22, 27, 38)) to reduce eye strain during night viewing. It employs a vibrant red-to-orange gradient (#F03131 to #FF6601) for primary calls-to-action and active states, creating a high-contrast focal point against the dark background.
• Typography: The system relies on a clean sans-serif stack with a clear scale of emphasis. Section titles use bold, centered spans often set at 51% relative size for stylized headers, while body text uses text-muted-foreground (gray) or white for high readability.
• Page Structure: The layout follows a logical flow: a global navigation header, a high-impact promotional banner, a functional match-filter tab bar, a split-column main section (33/66) containing a sticky Table of Contents and analytical data tables, and finally, multiple horizontal post sliders for auxiliary news.
• Reusable Components:
  • Filter Tab Bar: A horizontal scrolling container with pill-shaped buttons using Tailwind-style utility classes for active/inactive states.
  • Analytical Data Tables: Structured <table> elements with alternating row highlights and point-based ranking columns.
  • Blog Sliders: Flickity-based carousels with hover-effect cards featuring image covers and centered text blocks on a dark gray background (rgb(55, 55, 55)).
• Interaction & Motion: The matching filter system uses transition-colors for smooth state changes. The blog items use box-blog-post has-hover classes, suggesting a subtle scale or shadow lift on transition.
• Implementation Clues: The HTML reveals a WordPress core customized with the UX Builder/Flatsome framework, utilizing utility classes for layout (e.g., flex, gap-3, grid-cols-1).

Use Cases

• Who should clone this pattern: Developers building real-time dashboards, betting portals, or community-driven news sites that require a balance between dense data tables and long-form editorial content.
• Effective Remixes: This pattern can be effectively remixed for e-sports tournament trackers, crypto-currency price portals with integrated news, or technical documentation sites that need a robust TOC and feature comparison tables.
• Practical Directions: Builders should reuse the sticky sidebar TOC logic and the responsive table structure. The brand style can be easily swapped by updating the primary gradient colors, while the match filters can be adapted into product categories or price tiers.
• Suggested Scope: A full-page clone is ideal for those needing a comprehensive content hub; however, the match-filter tab bar and the analytical table styles are the most valuable individual components for isolated reuse.