Merge pull request #344 from spatie/blog-review-updates

Rename insights to blog & mobile tweaks

app/Http/Controllers/InsightsController.php → app/Http/Controllers/BlogController.php

@@ -12,35 +12,35 @@
 use Spatie\ContentApi\Data\Post;
 use Spatie\Feed\FeedItem;
 
-class InsightsController
+class BlogController
 {
     public function index(): View
     {
-        $insights = self::getPosts(5);
-        $highlight = $insights->first();
-        unset($insights[0]);
+        $posts = self::getPosts(5);
+        $highlight = $posts->first();
+        unset($posts[0]);
 
         $externalFeedItems = ExternalFeedItem::query()
             ->orderBy('created_at', 'desc')
             ->paginate(7);
 
         return view('front.pages.insights.index', [
-            'insights' => $insights,
+            'posts' => $posts,
             'highlight' => $highlight ?? null,
             'externalFeedItems' => $externalFeedItems,
         ]);
     }
 
     public function all(): View
     {
-        $insights = self::getPosts();
+        $posts = self::getPosts();
 
-        $highlight = $insights->first();
+        $highlight = $posts->first();
 
-        unset($insights[0]);
+        unset($posts[0]);
 
         return view('front.pages.insights.index', [
-            'insights' => $insights,
+            'posts' => $posts,
             'highlight' => $highlight ?? null,
         ]);
     }
@@ -124,7 +124,7 @@ private function replaceComponents(string $content): string
     private function renderBanner(?string $type): string
     {
         $props = [
-            'ref' => 'insights',
+            'ref' => 'posts',
             'class' => 'my-6',
             'thin' => true,
         ];
@@ -148,7 +148,7 @@ private function renderLink(?string $slug): string
             return '';
         }
 
-        return Blade::render("components.insights.list-item", [
+        return Blade::render("components.posts.list-item", [
             'insight' => $post,
             'border' => true,
         ]);

config/feed.php

@@ -4,9 +4,9 @@
     'feeds' => [
         'main' => [
             'items' => [\App\Models\ExternalFeedItem::class, 'getFeedItems'],
-            'url' => '/feed',
-            'title' => 'Spatie: From our team & products',
-            'description' => 'Blog posts from Spatie team members & products.',
+            'url' => '/feeds/team-members-products',
+            'title' => 'Spatie: Team members & products',
+            'description' => 'Blog posts from Spatie team members & product sites.',
             'language' => 'en-US',
             'image' => '',
             'format' => 'atom',
@@ -15,10 +15,10 @@
             'contentType' => '',
         ],
         'insights' => [
-            'items' => [\App\Http\Controllers\InsightsController::class, 'getFeedItems'],
-            'url' => '/feed-insights',
-            'title' => 'Spatie: Insights',
-            'description' => 'Insights from the Spatie team.',
+            'items' => [\App\Http\Controllers\BlogController::class, 'getFeedItems'],
+            'url' => '/feeds/blog',
+            'title' => 'Spatie: Blog',
+            'description' => 'News & insights from the Spatie team.',
             'language' => 'en-US',
             'image' => '',
             'format' => 'atom',

resources/views/components/insights/list-item.blade.php

@@ -4,7 +4,7 @@
     <figure>
         <a wire:navigate href="{{ route('insights.show', $insight->slug) }}" class="text-oss-royal-blue no-underline block w-[120px] h-[120px] bg-oss-green-pale rounded-8">
             @if ($insight->header_image)
-                <img class="w-full h-full object-cover" src="{{ $insight->header_image }}" alt="">
+                <img class="w-full h-full object-cover rounded-8" src="{{ $insight->header_image }}" alt="">
             @endif
         </a>
     </figure>

resources/views/front/pages/insights/index.blade.php

@@ -4,25 +4,25 @@
     body-class="bg-oss-gray"
     main-class="font-pt text-oss-royal-blue font-medium text-18 leading-140 antialiased"
 >
-    <header class="wrapper-lg mt-8 sm:mt-20 md:mt-28">
+    <header class="wrapper-lg sm:mt-20 md:mt-28">
         <x-headers.h1 class="text-right text-white">
-            Insights
+            Blog
         </x-headers.h1>
     </header>
 
     @if($highlight)
-        <article class="wrapper-lg flex flex-col-reverse sm:flex-row sm:gap-16 mt-8">
+        <article class="wrapper-lg flex flex-col sm:flex-row gap-8 sm:gap-16 mt-8">
             <figure>
-                <div class="sm:w-[440px] sm:h-[440px] bg-oss-green-pale rounded-8 shadow-big">
+                <div class="w-[220px] h-[220px] sm:w-[440px] sm:h-[440px] bg-oss-green-pale rounded-8 shadow-big">
                     @if ($highlight->header_image)
-                        <img class="w-full h-full object-cover rounded-8" src="{{ $highlight->header_image }}" alt="">
+                        <img class="w-full h-full object-cover rounded-8" src="{{ $highlight->header_image }}" alt="{{ $highlight->title }}">
                     @endif
                 </div>
             </figure>
             <div class="sm:pt-24 flex flex-col gap-6 sm:gap-9">
                 <p class="flex items-center gap-3 text-sm">
                     <a href="{{ route('insights.show', $highlight->slug) }}" class="bg-oss-green-pale font-semibold rounded-8 px-2 py-1.5">
-                        Latest article
+                        Latest post
                     </a>
                     <a href="{{ route('insights.show', $highlight->slug) }}">
                         <time datetime="{{ $highlight->date->format('Y-m-d') }}">
@@ -43,18 +43,18 @@
         <hr class="sm:hidden mx-3 my-16 h-px bg-oss-gray-medium">
     @endif
 
-    @if($insights->isNotEmpty())
+    @if($posts->isNotEmpty())
         <div class="wrapper-lg mt-12 sm:mt-20">
             <div class="grid sm:grid-cols-[1fr,2fr] gap-8">
-                <h2 class="hidden sm:block text-24 font-bold">More insights</h2>
+                <h2 class="hidden sm:block text-24 font-bold">More posts</h2>
                 <div class="grid gap-16">
-                    @foreach($insights as $insight)
-                        <x-insights.list-item :insight="$insight" />
+                    @foreach($posts as $post)
+                        <x-insights.list-item :insight="$post" />
                         @if(!$loop->last)
                             <hr class="sm:hidden h-px bg-oss-gray-medium">
                         @endif
                     @endforeach
-                    @if ($insights->hasMorePages())
+                    @if ($posts->hasMorePages())
                         <a href="{{ route('insights.all') }}" wire:navigate.hover class="flex w-full items-center justify-center py-6 text-blue bg-link-card-light border border-gray/25 rounded">
                             View more
                         </a>

resources/views/front/pages/insights/show.blade.php

@@ -5,8 +5,8 @@
     main-class="font-pt text-oss-royal-blue font-medium antialiased"
 >
     <article>
-        <header class="wrapper-inset-lg mt-6 sm:mt-12 -mb-12 relative z-10">
-            <div class="flex flex-col sm:flex-row sm:gap-8 sm:gap-20">
+        <header class="wrapper-lg sm:wrapper-inset-lg mt-6 sm:mt-12 -mb-12 relative z-10">
+            <div class="pr-12 flex flex-col sm:flex-row sm:gap-8 gap-20">
                 <div class="flex-1 sm:pb-28">
                     <time datetime="{{ $post->date?->format('Y-m-d') }}" class="text-oss-royal-blue">
                         {{ $post->date?->format('F d, Y') ?? 'Preview' }}
@@ -20,7 +20,7 @@
                         @endforeach
                     </div>
                 </div>
-                <div class="w-3/5 sm:w-2/5 ml-auto mt-auto flex-shrink-0 aspect-square bg-oss-green-pale rounded-8 shadow-big">
+                <div class="w-3/5 sm:w-2/5 ml-auto sm:mr-0 mt-auto flex-shrink-0 aspect-square bg-oss-green-pale rounded-8 shadow-big">
                     @if($post->header_image)
                         <img class="w-full rounded-8" alt="" src="{{ $post->header_image }}"/>
                     @endif
@@ -29,7 +29,7 @@
         </header>
 
         <section class="wrapper-lg">
-            <div class="pt-6 md:pt-12 pb-16 md:pb-20 bg-white rounded-2xl">
+            <div class="pt-12 md:pt-12 pb-16 md:pb-20 bg-white rounded-2xl">
                 <div class="wrapper-sm px-9">
                     <aside class="mb-10 flex items-center gap-6">
                         @foreach ($post->authors as $author)

routes/redirects.php

@@ -41,3 +41,5 @@
 
 Route::permanentRedirect('jef', '/about-us#jef');
 Route::permanentRedirect('laravel', '/open-source')->name('laravel');
+
+Route::permanentRedirect('feed', '/feeds/team-members-products');

routes/web.php

@@ -14,7 +14,7 @@
 use App\Http\Controllers\DownloadPurchasableController;
 use App\Http\Controllers\DownloadRayController;
 use App\Http\Controllers\ExternalFeedItemsController;
-use App\Http\Controllers\InsightsController;
+use App\Http\Controllers\BlogController;
 use App\Http\Controllers\MusicController;
 use App\Http\Controllers\RegenerateLicenseKeyController;
 use App\Http\Controllers\ShowReleaseNotesController;
@@ -53,9 +53,9 @@
 
 Route::feeds();
 
-Route::get('insights', [InsightsController::class, 'index'])->name('insights');
-Route::get('insights/all', [InsightsController::class, 'all'])->name('insights.all');
-Route::get('insights/{slug}', [InsightsController::class, 'detail'])->name('insights.show');
+Route::get('insights', [BlogController::class, 'index'])->name('insights');
+Route::get('insights/all', [BlogController::class, 'all'])->name('insights.all');
+Route::get('insights/{slug}', [BlogController::class, 'detail'])->name('insights.show');
 Route::get('team-products', ExternalFeedItemsController::class)->name('external-feed-items');
 
 Route::redirect('/docs/products/ray', '/docs/ray');