From 35c35424e199038ba65d12222d1dcd4444085b6d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Katri=20Lotam=C3=B5is?= <katrilotamois@outlook.com>
Date: Thu, 25 Jun 2026 13:16:40 +0300
Subject: [PATCH] improve readability

---
 src/app/[locale]/kodukord/page.tsx | 14 +++++++-------
 src/components/RuleNav.tsx         |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/app/[locale]/kodukord/page.tsx b/src/app/[locale]/kodukord/page.tsx
index 96a6b5c..b7b9015 100644
--- a/src/app/[locale]/kodukord/page.tsx
+++ b/src/app/[locale]/kodukord/page.tsx
@@ -32,7 +32,7 @@ export default async function Page({
   return (
     <div className="bg-[#0E0F19] min-h-screen pt-16 md:pt-20">
       <div className="max-w-480 mx-auto px-4 sm:px-6 md:px-12 lg:px-64 py-10 md:py-20">
-        <div className="grid grid-cols-1 lg:grid-cols-[1fr_300px] gap-8 lg:gap-16">
+        <div className="grid grid-cols-1 lg:grid-cols-[1fr_300px] lg:gap-20">
           {/* Main content */}
           <div>
             {/* Page title */}
@@ -46,7 +46,7 @@ export default async function Page({
               ruleType="kodukord"
             />
 
-            <div className="rules-markdown">
+            <div className="rules-markdown text-justify">
               <ReactMarkdown
                 components={
                   {
@@ -65,28 +65,28 @@ export default async function Page({
                     },
                     h2: (props) => (
                       <h2
-                        className={`${vipnagorgialla.className} font-bold italic text-xl text-white uppercase mb-2 mt-6`}
+                        className={`${vipnagorgialla.className} font-bold italic text-white uppercase`}
                       >
                         {props.children}
                       </h2>
                     ),
                     ol: (props) => (
-                      <ol className="text-white mb-4 leading-[19px]">
+                      <ol className="text-white mb-6">
                         {props.children}
                       </ol>
                     ),
                     ul: (props) => (
-                      <ul className="list-disc list-inside text-white mb-4 leading-[19px]">
+                      <ul className="list-disc list-inside text-white">
                         {props.children}
                       </ul>
                     ),
                     p: (props) => (
-                      <p className="text-white mb-4 leading-[19px]">
+                      <p className="text-white text-xl">
                         {props.children}
                       </p>
                     ),
                     li: (props) => (
-                      <li className="text-white mb-2 leading-[19px]">
+                      <li className="text-white text-xl mb-5">
                         {props.children}
                       </li>
                     ),
diff --git a/src/components/RuleNav.tsx b/src/components/RuleNav.tsx
index f78e2ca..605f31a 100644
--- a/src/components/RuleNav.tsx
+++ b/src/components/RuleNav.tsx
@@ -62,7 +62,7 @@ export default function RuleNav({ sections }: RuleNavProps) {
   return (
     <aside className="hidden lg:block">
       <nav className="sticky top-24">
-        <ul className="flex flex-col">
+        <ul className="flex flex-col text-center">
           {sections.map((section) => (
             <li
               key={section.id}