Enhance homepage content and styling

Author: roxblnfk

.vitepress/config.mts

@@ -108,10 +108,5 @@ export default defineConfig({
     search: {
       provider: 'local',
     },
-
-    footer: {
-      message: 'Released under the MIT License.',
-      copyright: 'Copyright © 2024-present Testo',
-    },
   },
 })

.vitepress/theme/style.css

@@ -1,3 +1,23 @@
+/* Override VitePress brand colors with dough/testo colors */
+:root {
+  --vp-c-brand-1: #d4a574;
+  --vp-c-brand-2: #c8995f;
+  --vp-c-brand-3: #b8864d;
+  --vp-c-brand-soft: rgba(212, 165, 116, 0.14);
+
+  /* For dark mode */
+  --vp-c-brand-dark: #e6c199;
+  --vp-c-brand-darker: #f0d4b3;
+  --vp-c-brand-dimm: rgba(230, 193, 153, 0.08);
+}
+
+.dark {
+  --vp-c-brand-1: #e6c199;
+  --vp-c-brand-2: #d4a574;
+  --vp-c-brand-3: #c8995f;
+  --vp-c-brand-soft: rgba(230, 193, 153, 0.16);
+}
+
 /* Wider content for all pages and blog styling */
 
 .VPDoc .container {
@@ -21,3 +41,273 @@
 .VPDoc.has-aside .content-container p {
   /*margin: 1.25rem 0 !important;*/
 }
+
+/* ===== HOME PAGE STYLES ===== */
+
+/* Logo glow effect with dough colors */
+.VPHero .image-container img,
+.VPHero .VPImage {
+  animation: logo-glow 3s ease-in-out infinite alternate;
+  filter: drop-shadow(0 0 20px rgba(245, 222, 179, 0.5));
+  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+  transform-origin: center center;
+}
+
+@keyframes logo-glow {
+  0% {
+    filter: drop-shadow(0 0 18px rgba(245, 222, 179, 0.4))
+            drop-shadow(0 0 35px rgba(255, 235, 205, 0.3));
+  }
+  100% {
+    filter: drop-shadow(0 0 25px rgba(245, 222, 179, 0.6))
+            drop-shadow(0 0 50px rgba(255, 235, 205, 0.4));
+  }
+}
+
+.VPHero .image-container img:hover,
+.VPHero .VPImage:hover {
+  filter: drop-shadow(0 0 30px rgba(245, 222, 179, 0.7))
+          drop-shadow(0 0 60px rgba(255, 235, 205, 0.5));
+}
+
+/* Hero section enhancements */
+.VPHero {
+  padding-top: 80px !important;
+  padding-bottom: 80px !important;
+}
+
+.VPHero .text {
+  font-size: 64px !important;
+  font-weight: 700;
+}
+
+.VPHero .tagline {
+  font-size: 20px !important;
+  line-height: 1.6 !important;
+  max-width: 800px;
+  margin: 0 auto;
+  opacity: 0.9;
+}
+
+/* Action buttons styling */
+.VPHero .actions {
+  gap: 16px !important;
+  padding-top: 32px !important;
+}
+
+.VPHero .action.brand {
+  background: linear-gradient(135deg, var(--vp-c-brand-1), var(--vp-c-brand-2)) !important;
+  border: none !important;
+  box-shadow: 0 8px 24px rgba(245, 222, 179, 0.3);
+  transition: all 0.3s ease;
+  font-weight: 600;
+  padding: 12px 32px !important;
+  font-size: 16px !important;
+}
+
+.VPHero .action.brand:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 12px 32px rgba(245, 222, 179, 0.4);
+}
+
+.VPHero .action.alt {
+  border: 2px solid var(--vp-c-brand-1) !important;
+  transition: all 0.3s ease;
+  font-weight: 600;
+  padding: 12px 32px !important;
+  font-size: 16px !important;
+}
+
+.VPHero .action.alt:hover {
+  background: var(--vp-c-brand-soft) !important;
+  transform: translateY(-2px);
+  box-shadow: 0 8px 24px rgba(245, 222, 179, 0.2);
+}
+
+/* Features section */
+.VPFeatures {
+  padding-top: 48px !important;
+  padding-bottom: 48px !important;
+}
+
+.VPFeature {
+  background: var(--vp-c-bg-soft);
+  border: 1px solid var(--vp-c-divider);
+  border-radius: надо уменьшить контен12px;
+  transition: all 0.3s ease;
+  height: 100%;
+}
+
+.VPFeature:hover {
+  border-color: var(--vp-c-brand-1);
+  box-shadow: 0 0px 32px rgba(245, 222, 179, 0.15);
+}
+
+.VPFeature .title {
+  font-size: 18px !important;
+  font-weight: 600 !important;
+  margin-bottom: 12px !important;
+}
+
+.VPFeature .details {
+  font-size: 15px !important;
+  line-height: 1.7 !important;
+  opacity: 0.9;
+}
+
+/* Content sections on home page */
+.vp-doc h2 {
+  font-size: 36px !important;
+  font-weight: 700 !important;
+  margin-top: 64px !important;
+  margin-bottom: 24px !important;
+}
+
+.vp-doc .vp-code-group,
+.vp-doc div[class*="language-"] {
+  margin: 24px 0 !important;
+  border-radius: 12px !important;
+  overflow: hidden;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+}
+
+.vp-doc .vp-code-group:hover,
+.vp-doc div[class*="language-"]:hover {
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.15);
+  transform: translateY(-2px);
+}
+
+/* Custom info/tip boxes */
+.vp-doc .custom-block {
+  border-radius: 12px !important;
+  border-left-width: 4px !important;
+  padding: 16px 20px !important;
+  margin: 24px 0 !important;
+}
+
+.vp-doc .custom-block.tip {
+  background: linear-gradient(135deg, rgba(245, 222, 179, 0.05), rgba(245, 222, 179, 0.02));
+  border-left-color: var(--vp-c-brand-1) !important;
+}
+
+/* Sponsors section */
+.sponsors-section {
+  max-width: 1152px;
+  margin: 80px auto 60px;
+  padding: 0 24px;
+  text-align: center;
+}
+
+.sponsors-title {
+  font-size: 28px !important;
+  font-weight: 600 !important;
+  margin-bottom: 32px !important;
+  color: var(--vp-c-text-1);
+}
+
+.sponsors-grid {
+  display: flex;
+  justify-content: center;
+  gap: 24px;
+  flex-wrap: wrap;
+}
+
+.sponsor-card {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 32px 48px;
+  background: var(--vp-c-bg-soft);
+  border: 2px solid var(--vp-c-divider);
+  border-radius: 16px;
+  transition: all 0.3s ease;
+  text-decoration: none;
+  min-width: 280px;
+}
+
+.sponsor-card:hover {
+  border-color: var(--vp-c-brand-1);
+  transform: translateY(-4px);
+  box-shadow: 0 12px 32px rgba(245, 222, 179, 0.2);
+  background: var(--vp-c-bg);
+}
+
+.sponsor-logo {
+  padding: 40px 60px;
+  border-color: transparent;
+  background: transparent;
+}
+
+.sponsor-logo:hover {
+  transform: none;
+  box-shadow: none;
+  border-color: transparent;
+  background: transparent;
+}
+
+.sponsor-image {
+  width: 140px;
+  height: auto;
+}
+
+.dark .sponsor-image {
+  filter: invert(1) brightness(1.2);
+}
+
+.sponsor-cta-link {
+  text-align: center;
+  margin-top: 24px;
+}
+
+.sponsor-cta-link a {
+  font-size: 14px;
+  color: var(--vp-c-text-2);
+  text-decoration: none;
+  transition: color 0.2s ease;
+}
+
+.sponsor-cta-link a:hover {
+  color: var(--vp-c-brand-1);
+}
+
+/* Responsive adjustments */
+@media (max-width: 768px) {
+  .VPHero .text {
+    font-size: 42px !important;
+  }
+
+  .VPHero .tagline {
+    font-size: 17px !important;
+  }
+
+  .vp-doc h2 {
+    font-size: 28px !important;
+  }
+
+  .VPHero .image-container img,
+  .VPHero .VPImage {
+    max-width: 80%;
+  }
+
+  .sponsors-section {
+    margin: 60px auto 40px;
+  }
+
+  .sponsors-title {
+    font-size: 24px !important;
+  }
+
+  .sponsor-card {
+    padding: 24px 32px;
+    min-width: 240px;
+  }
+
+  .sponsor-logo {
+    padding: 32px 40px;
+  }
+
+  .sponsor-image {
+    width: 120px;
+  }
+}

index.md

@@ -2,22 +2,45 @@
 layout: home
 
 hero:
-  name: Testo
-  text: Modern PHP Testing Framework
-  tagline: Simple, fast, and powerful testing for PHP applications
+  name: 
+  text: The PHP Testing Framework You Control
+  tagline: Built for frameworks, SDKs, and complex systems. No inheritance, full extensibility through middleware, clean assertions API.
+  image:
+    src: https://github.com/php-testo/.github/blob/1.x/resources/logo-full.svg?raw=true
+    alt: Testo Logo
   actions:
     - theme: brand
       text: Get Started
       link: /docs/getting-started
     - theme: alt
-      text: View on GitHub
+      text: Why Testo?
+      link: /docs/why-testo
+    - theme: alt
+      text: GitHub
       link: https://github.com/php-testo/testo
 
 features:
-  - title: Simple API
-    details: Write tests with a clean, intuitive syntax that feels natural.
-  - title: Fast Execution
-    details: Run your entire test suite in seconds with parallel execution.
-  - title: Rich Assertions
-    details: Comprehensive assertion library for all your testing needs.
+  - title: Familiar OOP
+    details: Tests are classes without TestCase inheritance or functions. Code stays clean.
+
+  - title: IDE Integration
+    details: PhpStorm/IntelliJ IDEA plugin with test running, navigation, debugging, and all the workflow you expect.
+
+  - title: Small Core
+    details: Everything else is middleware and event dispatchers with unlimited customization.
+
+  - title: Well-Designed API
+    details: Separate Assert (now) and Expect (later) facades with pipe assertions for type-safe checks.
 ---
+
+<div class="sponsors-section">
+  <h2 class="sponsors-title">Sponsored by</h2>
+  <div class="sponsors-grid">
+    <a href="https://buhta.com" class="sponsor-card sponsor-logo" target="_blank" rel="noopener">
+      <img src="/logo-buhta.svg" alt="Buhta" class="sponsor-image">
+    </a>
+  </div>
+  <div class="sponsor-cta-link">
+    <a href="/sponsor">Become a Sponsor</a>
+  </div>
+</div>