From 9413bc7a4e8cf24912ad348a1c6fd84255f9ecba Mon Sep 17 00:00:00 2001
From: ShaopengLin <shaopeng.lin@mail.utoronto.ca>
Date: Thu, 7 Nov 2024 02:34:29 -0500
Subject: [PATCH] Proper Styling to TOC

---
 resources/css/style.css  | 64 ++++++++++++++++++++++++++++++++++++++++
 src/tableofcontentbar.ui |  9 ++++++
 2 files changed, 73 insertions(+)

diff --git a/resources/css/style.css b/resources/css/style.css
index 1e56d27e..284d8a7f 100644
--- a/resources/css/style.css
+++ b/resources/css/style.css
@@ -401,6 +401,70 @@ ContentTypeFilter {
     height: 0;
 }
 
+#tableofcontentbar {
+    background-color: white;
+}
+
+#tableofcontentbar QTreeWidget,
+#tableofcontentbar QLabel,
+#tableofcontentbar QFrame {
+    background-color: white;
+}
+
+#tableofcontentbar QTreeWidget {
+    outline: none;
+}
+
 #tableofcontentbar QTreeWidget::item {
     height: 26px;
+    padding: 0px 10px;
+    outline: none;
+    border-top: 1px solid transparent;
+    border-bottom: 1px solid transparent;
+}
+
+#tableofcontentbar QTreeWidget::item:selected,
+#tableofcontentbar QTreeWidget::item:hover {
+    outline: none;
+    border-top: 1px solid #3366CC;
+    border-bottom: 1px solid #3366CC;
+    background-color: #D9E9FF;
+    color: black;
+}
+
+#tableofcontentbar QTreeWidget::branch:selected,
+#tableofcontentbar QTreeWidget::branch:hover {
+    outline: none;
+    border-top: 1px solid #3366CC;
+    border-bottom: 1px solid #3366CC;
+    background-color: #D9E9FF;
+}
+
+#tableofcontentbar QTreeWidget::branch:has-children:closed {
+    padding: 5px;  /* Can only change icon size with padding. */
+    image: url(:/icons/caret-up-solid.svg);
+}
+
+#tableofcontentbar QTreeWidget::branch:has-children {
+    padding: 5px; /* Can only change icon size with padding. */
+    image: url(:/icons/caret-down-solid.svg);
+}
+
+#tableofcontentbar #titleLabel {
+    padding: 0px;
+    margin: 10px 10px;
+}
+
+#tableofcontentbar #hideLabel {
+    margin: 13px 10px 10px 10px; /* 3px to match bottom with titleLabel */ 
+}
+
+#tableofcontentbar QScrollBar {
+    width: 5px;
+    border: none;
+    outline: none;
+}
+
+#tableofcontentbar QScrollBar::handle {
+    background-color: grey;
 }
diff --git a/src/tableofcontentbar.ui b/src/tableofcontentbar.ui
index 2669cd04..3cf56494 100644
--- a/src/tableofcontentbar.ui
+++ b/src/tableofcontentbar.ui
@@ -14,6 +14,9 @@
    <string>Form</string>
   </property>
   <layout class="QVBoxLayout" name="verticalLayout">
+   <property name="spacing">
+    <number>0</number>
+   </property>
    <property name="leftMargin">
     <number>0</number>
    </property>
@@ -38,6 +41,9 @@
        <property name="text">
         <string/>
        </property>
+       <property name="indent">
+        <number>0</number>
+       </property>
       </widget>
      </item>
      <item>
@@ -58,6 +64,9 @@
        <property name="text">
         <string/>
        </property>
+       <property name="indent">
+        <number>0</number>
+       </property>
       </widget>
      </item>
     </layout>