fix(layout): correct ticket layout/css issues

ref: #54 #64
nofusscomputing · Jan 26, 2025 · 4770820 · 4770820
1 parent 422cf15
commit 4770820
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 7 deletions.
diff --git a/src/components/page/ticket/LinkedItems.jsx b/src/components/page/ticket/LinkedItems.jsx
@@ -40,7 +40,15 @@ const LinkedItems = ({
                 flexWrap: 'row wrap',
             }}
             titleBar={(
-                <h3 className="linked-items">Linked Items</h3>
+                <h3
+                    className="linked-items"
+                    style={{
+                        fontSize: 'var(--font-size)',
+                        margin: '0',
+                    }}
+                >
+                    Linked Items
+                </h3>
             )}
         >
             <div

diff --git a/src/components/page/ticket/RelatedTickets.jsx b/src/components/page/ticket/RelatedTickets.jsx
@@ -37,7 +37,15 @@ const RelatedTickets = ({
             className="related-tickets"
             id={'section-related-tickets'}
             titleBar={(
-                <h3 className="related-tickets">Related Tickets</h3>
+                <h3
+                    className="related-tickets"
+                    style={{
+                        fontSize: 'var(--font-size)',
+                        margin: '0',
+                    }}
+                >
+                    Related Tickets
+                </h3>
             )}
         >
 

diff --git a/src/index.css b/src/index.css
@@ -1692,6 +1692,11 @@ span.badge.badge-icon.ticket-status-icon-testing svg {
 
 
 
+.section fieldset.textarea div.full-width div.markdown {
+  display: flex;
+  margin: 0px auto;
+  width: 90%;
+}
 
 
 

diff --git a/src/layout/Ticket.jsx b/src/layout/Ticket.jsx
@@ -145,7 +145,14 @@ const Ticket = () => {
                     className="description"
                     titleBar={(
                         ! editing_description && (
-                        <h3 className={"description ticket-type-" + ticket_type}>
+                        <h3
+                            className={"description ticket-type-" + ticket_type}
+                            style={{
+                                fontSize: 'var(--font-size)',
+                                fontWeight: 'normal',
+                                margin: '0',
+                            }}
+                        >
                             <span>
                                 <span className="sub-script">opened by&nbsp;</span>
                                 <FieldData

diff --git a/src/styles/ticket.css b/src/styles/ticket.css
@@ -28,22 +28,22 @@ div.ticket section.sidebar h3.ticket-type-change {
 }
 
 div.ticket h3.description.ticket-type-incident,
-div.ticket section.sidebar h3.metadata.ticket-type-incident {
+div.ticket section.sidebar h3.ticket-type-incident {
   background-color: var(--background-colour-ticket-type-incident);
 }
 
 div.ticket h3.description.ticket-type-issue,
-div.ticket section.sidebar h3.metadata.ticket-type-issue {
+div.ticket section.sidebar h3.ticket-type-issue {
   background-color: var(--background-colour-ticket-type-issue);
 }
 
 div.ticket h3.description.ticket-type-problem,
-div.ticket section.sidebar h3.metadata.ticket-type-problem {
+div.ticket section.sidebar h3.ticket-type-problem {
   background-color: var(--background-colour-ticket-type-problem);
 }
 
 div.ticket h3.description.ticket-type-project-task,
-div.ticket section.sidebar h3.metadata.ticket-type-project-task {
+div.ticket section.sidebar h3.ticket-type-project-task {
   background-color: var(--background-colour-ticket-type-project-task);
 }
 
@@ -164,6 +164,7 @@ div.ticket div.comments ul.replies li {
 .ticket .discussion .replies h3 {
   display: flex;
   flex-direction: row;
+  /* padding: 0; */
   padding-left: .5rem;
 }
 .ticket .discussion .replies h3 svg {
@@ -187,6 +188,7 @@ div.ticket section.comment {
   flex-direction: row;
   font-size: var(--font-size);
   font-weight: normal;
+  margin: 0;
   padding-left: .5rem;
 }