Proper Styling to TOC

kiwix · Nov 7, 2024 · 9413bc7 · 9413bc7
1 parent d4b3a13
commit 9413bc7
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 0 deletions.
diff --git 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
@@ -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>