[css] improve blog post font

resources/blog/posts/2025/2025-03-03-how-to-strangle-your-project-with-strangle-anti-pattern.md

@@ -22,7 +22,7 @@ Let's say we have an old CakePHP, CodeIgniter, Yii, or plain PHP project and you
 In practice, it can look something like:
 
 <div class="text-center mb-5">
-    <img src="https://accesto.com/blog/static/d20bbd2696d22557b2048fb00c8fc598/3c492/code-refactoring.png" style="max-width: 30em" class="img-thumbnail">
+    <img src="/assets/images/blog/2025/code-refactoring.png" class="img-thumbnail">
     <br>
     <small class="text-secondary">
         From <a href="https://accesto.com/blog/monolith-to-microservices/">Monolith to Microservices</a>

resources/css/app.scss

@@ -294,6 +294,44 @@ h4 {
     .text-body {
         font-size: 1.1em;
     }
+
+    .perex {
+        margin-top: 1em;
+        margin-bottom: 1em;
+        font-size: 1.4em;
+        padding: .7em 0;
+    }
+
+    .text-body {
+        font-size: 1.2em;
+    }
+
+    @media (max-width: 750px) {
+        h1 {
+            font-size: 1.5em;
+            line-height: 1.5em;
+        }
+
+        h2 {
+            font-size: 1.2em;
+            line-height: 1.4em;
+        }
+
+        .perex {
+            font-size: 1.1em;
+        }
+
+        .text-body {
+            font-size: 1.1em;
+        }
+    }
+}
+
+#blog {
+    h2 {
+        font-size: 1.4em;
+    }
+
 }
 
 #homepage {
@@ -451,17 +489,6 @@ label.required:before {
     h2 {
         margin-top: 1em;
     }
-
-    .perex {
-        margin-top: 1em;
-        margin-bottom: 1em;
-        font-size: 1.4em;
-        padding: .7em 0;
-    }
-
-    .text-body {
-        font-size: 1.2em;
-    }
 }
 
 #documentation {

resources/views/blog/blog.blade.php

@@ -2,13 +2,13 @@
 
 @section('main')
     <div id="blog">
-        <h1>{{ $page_title }}</h1>
+        <h1 style="text-wrap: balance">{{ $page_title }}</h1>
 
         @php /** @var \App\Entity\Post[] $posts */ @endphp
 
         @foreach ($posts as $post)
             <div class="mb-4">
-                <h2 style="font-size: 1.4em" class="mb-0">
+                <h2 class="mb-0">
                     <a href="{{ action(\App\Controller\Blog\PostController::class, [
                         'postSlug' => $post->getSlug(),
                     ]) }}">

src/Controller/Blog/BlogController.php

@@ -10,16 +10,11 @@
 
 final class BlogController extends Controller
 {
-    public function __construct(
-        private readonly PostRepository $postRepository,
-    ) {
-    }
-
-    public function __invoke(): View
+    public function __invoke(PostRepository $postRepository): View
     {
         return \view('blog/blog', [
             'page_title' => 'Learn about Rector, Upgrades and Planning',
-            'posts' => $this->postRepository->getPosts(),
+            'posts' => $postRepository->getPosts(),
         ]);
     }
 }

src/Controller/Blog/PostController.php

@@ -12,14 +12,9 @@
 
 final class PostController extends Controller
 {
-    public function __construct(
-        private readonly PostRepository $postRepository,
-    ) {
-    }
-
-    public function __invoke(string $postSlug): View
+    public function __invoke(string $postSlug, PostRepository $postRepository): View
     {
-        $post = $this->postRepository->findBySlug($postSlug);
+        $post = $postRepository->findBySlug($postSlug);
         if (! $post instanceof Post) {
             $message = sprintf("Post with slug '%s' not found", $postSlug);
             throw new NotFoundHttpException($message);