Small design fixes (#209)

piotrpdev · web-flow · commit d8e1250ccd40 · 2025-12-03T12:50:21.000Z
* Fix overflow / remove horizontal scrollbar Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Add shadow to blog title card Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Move blog post title to header Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Fix card title vertical centering Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Add missing full stops Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Remove invalid markdown references Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * correct footnote Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> * Revert "Add missing full stops" This reverts commit 19cc903. Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com> --------- Signed-off-by: Piotr Płaczek <piotrpdev@gmail.com>
diff --git a/_layouts/blog.html b/_layouts/blog.html
@@ -3,7 +3,7 @@
 ---
 <div class="row align-items-start justify-content-center my-5">
     <div class="col-lg-3 mb-5" role="complementary" aria-labelledby="page-title">
-        <div class="card px-2 mx-2">
+        <div class="card shadow px-2 mx-2">
             <div class="card-body">
                 <h1 class="fs-3" class="card-title" id="page-title">{{ page.title }}</h1>
                 <div class="container g-0 mt-4">
@@ -34,12 +34,14 @@ <h1 class="fs-3" class="card-title" id="page-title">{{ page.title }}</h1>
                         {% else %}
                             <div class="col-md align-self-center">
                         {% endif %}
-                            <div class="card-body mx-3 my-2">
+                            <div class="card-header">
                                 <h2 class="card-title fs-4">
-                                    <a class="page-link" href="{{ post.url | absolute_url }}">
+                                    <a href="{{ post.url | absolute_url }}">
                                         {{ post.title | escape }}
                                     </a>
                                 </h2>
+                            </div>
+                            <div class="card-body mx-3 my-2">
                                 <p class="card-text">{{ post.excerpt | markdownify }}</p>
                                 <p class="card-text text-end"><small class="text-secondary">{{ post.date | date: date_format }}</small></p>
                             </div>
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -15,7 +15,7 @@
     {% seo %}
     {% feed_meta %}
 </head>
-<body class="d-flex flex-column min-vh-100" data-bs-theme="light">
+<body class="d-flex flex-column min-vh-100 default-layout" data-bs-theme="light">
 {% if jekyll.environment == "development" %}
    <div class="dev-watermark">Development Mode</div>
 {% endif %}
diff --git a/_sass/kroxylicious.scss b/_sass/kroxylicious.scss
@@ -343,4 +343,14 @@ b.conum * {
   background-size:contain;
   border: none;
   opacity: 0;
-}
+}
+
+.default-layout > .container-fluid.px-0 > .row {
+  margin-left: 0;
+  margin-right: 0;
+}
+
+.card-title {
+  margin-top: calc(var(--#{$prefix}card-title-spacer-y) / 2);
+  margin-bottom: calc(var(--#{$prefix}card-title-spacer-y) / 2);
+}
diff --git a/_use_cases/schema_validation_and_enforecement.markdown b/_use_cases/schema_validation_and_enforecement.markdown
@@ -68,7 +68,7 @@ even if producing applications are misconfigured.
 
 The filter currently supports two modes of operation:
 
-1. Schema validation[^3] validates the content of the record against a schema. Use this for topics which have an entry in
+1. Schema validation[^1] validates the content of the record against a schema. Use this for topics which have an entry in
    the Schema Registry.
 2. SyntacticallyCorrectJson validation ensures the producer is producing messages that contain syntactically valid JSON.
    Use for topics which do not have registered schemas.
