[references] Turn into carousel, so save space and give focus

.gitignore

@@ -25,7 +25,8 @@ yarn-error.log
 
 /demo-runner
 
-resources/json-database/*
+/resources/json-database/*
+!/resources/json-database/references.json
 
 /.env
 

rector.php

@@ -9,7 +9,7 @@
 
 return RectorConfig::configure()
     ->withPaths([__DIR__ . '/config', __DIR__ . '/src', __DIR__ . '/tests', __DIR__ . '/routes'])
-    ->withImportNames(removeUnusedImports: true)
+    ->withImportNames()
     ->withPreparedSets(
         deadCode: true,
         codeQuality: true,

resources/css/app.scss

@@ -363,7 +363,8 @@ h4 {
 
     h2 {
         text-align: center;
-        margin-bottom: 2.5em;
+        margin-top: .5em;
+        margin-bottom: 2em;
         font-weight: 500 !important;
     }
 }
@@ -419,23 +420,14 @@ label.required:before {
 }
 
 #references {
-    .company-logo {
-        max-width: 10em;
-        margin-right: 0;
-    }
-
     .company-quote {
-        font-size: 1.4em;
+        font-size: 1.3em;
 
         @media (max-width: 750px) {
             font-size: 1em;
         }
     }
 
-    .company-quote-card-body {
-        padding: 1.5em 1em 0 2em;
-    }
-
     h3 {
         font-size: 1.8rem;
         margin-top: 0;

resources/json-database/references.json

@@ -0,0 +1,32 @@
+[
+    {
+        "testimonial": "In my time as Head of software engineering at i6, I found in Rector the perfect core and <strong>enabling team to tackle technical debt</strong>, unblock critical upgrades and build strong foundations for leading aviation software project.",
+        "name": "Dom Graziano",
+        "position": "Head of Software Engineering at i6 Group",
+        "picture": "/assets/images/faces/dom_graziano.jpg"
+    },
+    {
+        "testimonial": "I'm <strong>extremely pleased with the progress</strong> we are making.<br>It's really come a long way.",
+        "name": "William Adam Gleiss",
+        "position": "VP of Technology at aRes Travel",
+        "picture": "/assets/images/faces/adam_gleiss.jpg"
+    },
+    {
+        "testimonial": "Tomas' deep expertise and tools-driven approach allowed us to modernize a significantly large legacy PHP codebase while teaching us best practices. Rector team <strong>worked around our schedule to ensure minimal disruption</strong>.</p><p>I highly recommend Rector team for legacy PHP code modernization!",
+        "name": "Eric Molitor",
+        "position": "CTO at Curve",
+        "picture": "/assets/images/faces/eric_molitor.jpg"
+    },
+    {
+        "testimonial": "Thanks to Rector, we were able to quite simply refactor the core of our API, which <strong>saved a lot of work that our developers would otherwise have to do manually</strong>.",
+        "name": "Milan Mimra",
+        "position": "CTO at Spaceflow",
+        "picture": "/assets/images/faces/milan_mimra.jpg"
+    },
+    {
+        "testimonial": "From upgrading our legacy project and <strong>improving team's productivity, to faster and easier code reviews</strong>, Rector is in the center of our PHP ecosystem.",
+        "name": "Nathan Page",
+        "position": "Technical Lead at EONX",
+        "picture": "/assets/images/faces/nathan_page.jpg"
+    }
+]

resources/views/hire_team/references.blade.php

@@ -1,111 +1,135 @@
-<div id="references">
-    <div class="row mb-5 ps-2 pe-2">
-        <div class="card shadow mt-3 pb-2">
-            <div class="card-body company-quote-card-body" style="display: flex">
-                <div>
-                    <img src="/assets/images/faces/dom_graziano.jpg" class="rounded-circle img-face-smaller-left me-4" alt="Dom Graziano face">
-                </div>
+{{-- gpt ref https://grok.com/chat/082afba8-d9c2-42fc-ba27-58a26cb10469 --}}
 
-                <blockquote class="blockquote company-quote me-4">
-                    <p>
-                        "In my time as Head of software engineering at i6, I found in Rector the perfect core and <strong>enabling team to tackle technical debt</strong>, unblock critical upgrades and build strong foundations for leading aviation software project."
-                    </p>
-                    <footer class="blockquote-footer mt-1">
-                        Dom Graziano, Head of Software Engineering at i6 Group
-                    </footer>
-                </blockquote>
-            </div>
-        </div>
+<style>
+    /* Carousel container */
+    .testimonial-carousel {
+        margin: 0 auto;
+        overflow: hidden;
+        position: relative;
+        padding-bottom: 1em;
+    }
 
-    </div>
+    .testimonial-carousel__track {
+        display: flex;
+        transition-property: transform;
+        transition-duration: .5s;
+        transition-timing-function: ease-in-out;
+        align-items: flex-start;
+    }
 
-    <div class="row mb-5 ps-2 pe-2">
-        <div class="card shadow mt-3 pb-2">
-            <div class="card-body company-quote-card-body" style="display: flex">
-                <div>
-                    <img src="https://www.adamgleiss.com/images/face.jpg"
-                         class="rounded-circle img-face-smaller-left me-4" alt="Adam Gleiss face">
-                </div>
+    .testimonial-carousel__item {
+        flex: 0 0 100%;
+        box-sizing: border-box;
+        padding: 0.9375rem; /* 15px */
+        display: flex;
+        justify-content: center;
+        height: auto;
+    }
 
-                <blockquote class="blockquote company-quote me-4">
-                    <p>
-                        "I'm <strong>extremely pleased with the progress</strong> we are making.<br>
-                        It's really come a long way."
-                    </p>
-                    <footer class="blockquote-footer mt-1">
-                        William Adam Gleiss, VP of Technology at aRes Travel
-                    </footer>
-                </blockquote>
-            </div>
-        </div>
-    </div>
+    .testimonial-carousel__item .card {
+        width: 100%;
+        max-width: 56rem;
+    }
 
-    <div class="row mb-5 ps-2 pe-2">
-        <div class="card shadow mt-3 pb-2">
-            <div class="card-body company-quote-card-body" style="display: flex">
-                <div>
-                    <img src="/assets/images/faces/eric_molitor.jpg"
-                         class="rounded-circle img-face-smaller-left me-4" alt="Eric Molitor face">
-                </div>
+    /* Navigation buttons */
+    .testimonial-carousel__button {
+        position: absolute;
+        top: 43%;
+        transform: translateY(-50%);
+        background: rgba(0, 0, 0, 0.5);
+        color: white;
+        border: none;
+        padding: .5rem 1rem .7rem 1rem;
+        cursor: pointer;
+        border-radius: 0.3125rem; /* 5px */
+        transition: background 0.3s;
+    }
 
-                <blockquote class="blockquote company-quote me-4">
-                    <p>
-                        "Tomas' deep expertise and tools-driven approach allowed us to modernize a significantly large legacy PHP codebase while teaching us best practices.
-                    </p>
-                    <p>
-                        Rector team <strong>worked around our schedule to ensure minimal disruption</strong>.
-                    </p>
-                    <p>
-                        I highly recommend Tomas and his team for legacy PHP code modernization!"
-                    </p>
-                    <footer class="blockquote-footer mt-1">
-                        Eric Molitor, CTO at Curve
-                    </footer>
-                </blockquote>
-            </div>
-        </div>
-    </div>
+    .company-quote-card-body {
+        display: flex;
+        padding: 1.5em 1em 0 2em;
+    }
 
-    <div class="row mb-5 ps-2 pe-2">
-        <div class="card shadow mt-3 pb-2">
-            <div class="card-body company-quote-card-body" style="display: flex">
-                <div>
-                    <img src="/assets/images/faces/milan_mimra.jpg"
-                         class="rounded-circle img-face-smaller-left me-4" alt="Milan Mimra face">
-                </div>
+    .testimonial-carousel__button:hover,
+    .testimonial-carousel__button:focus {
+        background: rgba(0, 0, 0, 0.8);
+        outline: none;
+    }
 
-                <blockquote class="blockquote company-quote me-4">
-                    <p>
-                        "Thanks to Rector, we were able to quite simply refactor the core of our API, which <strong>saved a lot of work that our developers would otherwise have to do manually</strong>."
+    .testimonial-carousel__button--prev {
+        left: 0.625rem; /* 10px */
+    }
 
-                    </p>
-                    <footer class="blockquote-footer mt-1">
-                        Milan Mimra, CTO at Spaceflow
-                    </footer>
-                </blockquote>
-            </div>
-        </div>
-    </div>
+    .testimonial-carousel__button--next {
+        right: 0.625rem; /* 10px */
+    }
 
-    <div class="row mb-5 ps-2 pe-2">
-        <div class="card shadow mt-3 pb-2">
-            <div class="card-body company-quote-card-body" style="display: flex">
-                <div>
-                    <img src="/assets/images/faces/nathan_page.jpg"
-                         class="rounded-circle img-face-smaller-left me-4" alt="Nathan Page face">
-                </div>
+    /* Responsive adjustments */
+    @media (max-width: 600px) {
+        .testimonial-carousel {
+            padding: 0.625rem; /* 10px */
+        }
+
+        .company-quote-card-body {
+            display: block;
+        }
+    }
+</style>
 
-                <blockquote class="blockquote company-quote me-4">
-                    <p>
-                        "From upgrading our legacy project and <strong>improving team's
-                            productivity, to faster and easier code reviews</strong>,
-                        Rector is in the center of our PHP ecosystem."
-                    </p>
-                    <footer class="blockquote-footer mt-1">
-                        Nathan Page, Technical Lead at EONX
-                    </footer>
-                </blockquote>
+<div id="references" class="testimonial-carousel">
+    <div class="testimonial-carousel__track">
+        @foreach ($references as $reference)
+            <div class="testimonial-carousel__item">
+                <div class="card shadow mt-3 pb-2">
+                    <div class="card-body company-quote-card-body">
+                        <div>
+                            <img
+                                src="{{ $reference['picture'] }}"
+                                class="rounded-circle img-face-smaller-left me-4 mb-3 mb-sm-0"
+                                alt="{{ $reference['name'] }}"
+                            >
+                        </div>
+                        <blockquote class="blockquote company-quote me-4">
+                            <p>
+                                "{!! $reference['testimonial'] !!}"
+                            </p>
+
+                            <footer class="blockquote-footer mt-1">
+                                {{ $reference['name'] }}, {{ $reference['position'] }}
+                            </footer>
+                        </blockquote>
+                    </div>
+                </div>
             </div>
-        </div>
+        @endforeach
     </div>
+
+    <button class="testimonial-carousel__button testimonial-carousel__button--prev" onclick="moveSlide(-1)">←</button>
+    <button class="testimonial-carousel__button testimonial-carousel__button--next" onclick="moveSlide(1)">→</button>
 </div>
+
+
+<script type="text/javascript">
+    let currentIndex = 0;
+    const items = document.querySelectorAll('.testimonial-carousel__item');
+    const totalItems = items.length;
+
+    function moveSlide(direction) {
+        currentIndex += direction;
+        if (currentIndex < 0) {
+            currentIndex = 0;
+        } else if (currentIndex >= totalItems) {
+            currentIndex = totalItems - 1;
+        }
+        const offset = -currentIndex * 100;
+        document.querySelector('.testimonial-carousel__track').style.transform = `translateX(${offset}%)`;
+    }
+
+    document.addEventListener('keydown', (event) => {
+        if (event.key === 'ArrowLeft') {
+            moveSlide(-1);
+        } else if (event.key === 'ArrowRight') {
+            moveSlide(1);
+        }
+    });
+</script>

resources/views/homepage/rule_detail.blade.php

@@ -22,8 +22,13 @@
 @section('main')
     <div id="filter">
         <div style="float: right" class="mt-0">
-            <a href="{{ url()->previous() }}">Back to rule search</a>
+            @if (url()->previous() && str_contains(url()->previous(), 'find-rule'))
+                <a href="{{ url()->previous() }}">Back to rule search</a>
+            @else
+                <a href="{{ action(\App\Controller\FindRuleController::class) }}">Find another rule</a>
+            @endif
         </div>
+
         <div class="clearfix"></div>
 
         <div class="mt-3 mb-5">

src/Controller/HomepageController.php

@@ -7,6 +7,8 @@
 use App\Repository\PostRepository;
 use Illuminate\Contracts\View\View;
 use Illuminate\Routing\Controller;
+use Nette\Utils\FileSystem;
+use Nette\Utils\Json;
 
 final class HomepageController extends Controller
 {
@@ -20,9 +22,22 @@ public function __invoke(): View
         return \view('homepage/homepage', [
             'page_title' => "We'll Speed Up Your Development Process by 300%",
             'recentPosts' => $this->postRepository->fetchLast(5),
+
+            'references' => $this->loadReferences(),
+
             // seo
             'metaTitle' => 'Rector: Fast PHP Code Upgrades & Refactoring',
             'metaDescription' => 'Automate PHP code upgrades and refactoring with Rector. Save time, reduce errors, and modernize your codebase instantly. Try it now!',
         ]);
     }
+
+    /**
+     * @return array{string, mixed}
+     */
+    private function loadReferences(): array
+    {
+        $referencesFileContents = FileSystem::read(__DIR__ . '/../../resources/json-database/references.json');
+
+        return Json::decode($referencesFileContents, forceArrays: true);
+    }
 }

tests/SmokeTests/ControllerSmokeTest.php

@@ -17,7 +17,7 @@ public function test(string $url, int $expectedStatusCode): void
     {
         $testResponse = $this->get($url);
 
-        $testResponse->assertStatus($expectedStatusCode);
+        $this->assertSame($expectedStatusCode, $testResponse->getStatusCode(), (string) $testResponse->getContent());
     }
 
     public static function provideData(): Iterator