From 86b43481d84665749effae23a8501ca49afd23ce Mon Sep 17 00:00:00 2001
From: Tom Butcher <thomasbutcher15@gmail.com>
Date: Sat, 25 Jul 2026 22:58:54 +0100
Subject: [PATCH] Improve styling and layout of dashboard components

- Updated line-height in markdown paragraphs for better readability.
- Adjusted margin in NoteItem component for improved spacing.
- Added a class name to Flex component in PropertyChanges for enhanced styling control.
---
 assets/stylesheets/App.css                          | 6 +++++-
 src/components/Dashboard/common/NoteItem.jsx        | 2 +-
 src/components/Dashboard/common/PropertyChanges.jsx | 6 +++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/assets/stylesheets/App.css b/assets/stylesheets/App.css
index e9a535d..6380436 100644
--- a/assets/stylesheets/App.css
+++ b/assets/stylesheets/App.css
@@ -575,7 +575,7 @@ body {
 .markdown p {
   font-size: 14px;
   margin: 10px 0;
-  line-height: 1;
+  line-height: 1.6;
 }
 
 .markdown h1 {
@@ -598,6 +598,10 @@ body {
   width: 100%;
 }
 
+.property-changes .markdown {
+  width: unset;
+}
+
 .markdown ul,
 .markdown ol {
   padding-left: 20px;
diff --git a/src/components/Dashboard/common/NoteItem.jsx b/src/components/Dashboard/common/NoteItem.jsx
index 69f610b..a1aab74 100644
--- a/src/components/Dashboard/common/NoteItem.jsx
+++ b/src/components/Dashboard/common/NoteItem.jsx
@@ -170,7 +170,7 @@ const NoteItem = ({
               <PersonIcon />
               <Text style={{ whiteSpace: 'nowrap' }}>{note.user.name}:</Text>
             </Space>
-            <div style={{ marginTop: '4px' }}>
+            <div style={{ marginTop: '1px' }}>
               <MarkdownDisplay content={note.content} />
             </div>
           </Flex>
diff --git a/src/components/Dashboard/common/PropertyChanges.jsx b/src/components/Dashboard/common/PropertyChanges.jsx
index a786b76..eed74f8 100644
--- a/src/components/Dashboard/common/PropertyChanges.jsx
+++ b/src/components/Dashboard/common/PropertyChanges.jsx
@@ -53,7 +53,11 @@ const PropertyChanges = ({ type, value }) => {
         }
         return (
           <Descriptions.Item key={key} label={changeProperty.label}>
-            <Flex gap={'small'} style={{ minWidth: 0, width: '100%' }}>
+            <Flex
+              gap={'small'}
+              style={{ minWidth: 0, width: '100%' }}
+              className='property-changes'
+            >
               {value?.old ? (
                 <ObjectProperty
                   {...changeProperty}