Added basic tab support

src/main.rs

@@ -669,16 +669,132 @@ fn handle_relative_connection(
             unreachable!();
         };
 
-        let lines = BufReader::new(pk_file).lines();
+        #[derive(Default)]
+        struct Section {
+            title: Box<str>,
+            lines: Vec<String>,
+        }
 
-        convert_extended(
-            lines.map(Result::unwrap_or_default),
-            &mut stream,
-            Settings::default()
-                .with_handler(entry_handler(path, relative_path, censored))
-                .with_start_level(start_level)
-                .with_use_textboxes(true),
+        let mut sections = Vec::new();
+
+        let mut current_section = Section::default();
+
+        for line in BufReader::new(pk_file).lines() {
+            let Ok(line) = line else {
+                continue;
+            };
+            if let Some(title) = line.strip_prefix("# ") {
+                if !current_section.title.is_empty() {
+                    sections.push(current_section);
+                }
+                current_section = Section {
+                    title: title.into(),
+                    lines: vec![line],
+                };
+
+                continue;
+            }
+
+            current_section.lines.push(line);
+        }
+
+        sections.push(current_section);
+
+        let count = sections.len();
+
+        let _ = write!(stream, "<style>");
+
+        let general_style = r"
+  .tab-system {
+    margin: 20px;
+  }
+
+  .tab-radio {
+    display: none;
+  }
+
+  .tab-nav {
+    display: flex;
+    gap: 5px;
+    margin-bottom: -1px;
+  }
+
+  .tab-button {
+    padding: 8px 15px;
+    background: #f0f0f0;
+    border: 1px solid #ddd;
+    border-bottom: 1px solid transparent;
+    cursor: pointer;
+    border-radius: 4px 4px 0 0;
+    position: relative;
+  }
+
+  .tab-button:hover {
+    background: #e0e0e0;
+  }
+
+  .tab-radio:checked + .tab-button {
+    background: white;
+    border-color: #ddd;
+    border-bottom-color: white;
+    z-index: 1;
+  }
+
+  .tab-content {
+    display: none;
+    padding: 15px;
+    border: 1px solid #ddd;
+  }";
+
+        let _ = write!(stream, "{general_style}");
+        for i in 1..count {
+            let _ = write!(stream, "#tab-{i}:checked ~ #content-{i},");
+        }
+        let _ = write!(
+            stream,
+            "#tab-{count}:checked ~ #content-{count} {{ display: block; }}"
         );
+
+        let _ = write!(stream, "</style>");
+
+        let _ = write!(stream, r#"<div class="tab-system">"#);
+
+        let _ = write!(
+            stream,
+            r#"<input type="radio" id="tab-1" name="tab-group" class="tab-radio" checked>"#
+        );
+        for i in 2..=count {
+            let _ = write!(
+                stream,
+                r#"<input type="radio" id="tab-{i}" name="tab-group" class="tab-radio">"#
+            );
+        }
+
+        let _ = write!(stream, r#"<div class="tab-nav">"#);
+        for (i, Section { title, .. }) in sections.iter().enumerate() {
+            let index = i + 1;
+            let _ = write!(
+                stream,
+                r#"<label for="tab-{index}" class="tab-button">{title}</label>"#
+            );
+        }
+        let _ = write!(stream, "</div>");
+
+        for (i, Section { lines, .. }) in sections.iter().enumerate() {
+            let index = i + 1;
+            let _ = write!(stream, r#"<div class="tab-content" id="content-{index}">"#);
+            convert_extended(
+                lines,
+                &mut stream,
+                Settings::default()
+                    .with_handler(entry_handler(path, relative_path, censored))
+                    .with_start_level(start_level)
+                    .with_use_textboxes(true),
+            );
+            let _ = write!(stream, "</div>");
+        }
+
+        let _ = write!(stream, "</div>");
     }
 
     section(&mut stream);