[collapsible_headings] indent heading collapse controls by level

Author: jcb91

src/jupyter_contrib_nbextensions/nbextensions/collapsible_headings/collapsible_headings.yaml

@@ -6,86 +6,107 @@ Description: "Allows notebook to have collapsible sections, separated by heading
 Link: readme.md
 Icon: icon.png
 Parameters:
+
 - name: collapsible_headings.add_button
   description: Add a toolbar button to collapse the closest header cell
   input_type: checkbox
   default: false
+
 - name: collapsible_headings.add_all_cells_button
   description: Add a toolbar button to collapse/uncollapse all header cells
   input_type: checkbox
   default: false
+
 - name: collapsible_headings.add_insert_header_buttons
   description: Add toolbar buttons to insert heading cells above/below the selected cell
   input_type: checkbox
   default: false
+
 - name: collapsible_headings.use_toggle_controls
   description: Add a control in each heading cell's input prompt to collapse/uncollapse it
   input_type: checkbox
   default: true
+
 - name: collapsible_headings.toggle_color
   description: Color for the toggle control icon
   input_type: color
   default: '#aaaaaa'
+
 - name: collapsible_headings.toggle_closed_icon
   description: font-awesome class for the toggle control icon on collapsed headings
   default: fa-caret-right
+
 - name: collapsible_headings.toggle_open_icon
   description: font-awesome class for the toggle control icon on uncollapsed (expanded) headings
   default: fa-caret-down
+
 - name: collapsible_headings.make_toggle_controls_buttons
   description: "Make the toggle control into a button (if false, it's just an icon)"
   input_type: checkbox
   default: false
+
 - name: collapsible_headings.size_toggle_controls_by_level
   description: Adjust the size of the toggle controls to match their heading levels
   input_type: checkbox
   default: true
+
 - name: collapsible_headings.show_section_brackets
   description: show Mathematica-style brackets around each collapsible section
   input_type: checkbox
   default: false
+
 - name: collapsible_headings.section_bracket_width
   description: 'Width, in pixels, of the Mathematica-style brackets around sections'
   input_type: number
   min: 2
   max: 100
   default: 10
+
 - name: collapsible_headings.show_ellipsis
   description: show a gray bracketed ellipsis at the end of collapsed heading cells
   input_type: checkbox
   default: true
+
 - name: collapsible_headings.use_shortcuts
   description: Add command-mode keyboard shortcuts to collapse/uncollapse the selected heading cell
   input_type: checkbox
   default: true
+
 - name: collapsible_headings.shortcuts.collapse
   description: Command-mode shortcut to collapse the selected heading cell
   input_type: hotkey
   default: left
+
 - name: collapsible_headings.shortcuts.uncollapse
   description: Command-mode shortcut to uncollapse (expand) the selected heading cell
   input_type: hotkey
   default: right
+
 - name: collapsible_headings.shortcuts.collapse_all
   description: Command-mode shortcut to collapse all heading cells
   input_type: hotkey
   default: ctrl-shift-left
+
 - name: collapsible_headings.shortcuts.uncollapse_all
   description: Command-mode shortcut to uncollapse (expand) all heading cells
   input_type: hotkey
   default: ctrl-shift-right
+
 - name: collapsible_headings.shortcuts.select
   description: Command-mode shortcut to select all cells in the selected heading cell's section
   input_type: hotkey
   default: shift-right
+
 - name: collapsible_headings.shortcuts.insert_above
   description: Command-mode shortcut to insert a heading cell above the selected cell
   input_type: hotkey
   default: shift-a
+
 - name: collapsible_headings.shortcuts.insert_below
   description: Command-mode shortcut to insert a heading cell below the selected cell's section
   input_type: hotkey
   default: shift-b
+
 - name: collapsible_headings.select_reveals
   description: "By default, selecting a whole section also expands the section to reveal its last cell. Set this option to false to disable the expansion."
   input_type: checkbox
@@ -98,3 +119,11 @@ Parameters:
     behaviour, see ToC2's configuration
   input_type: checkbox
   default: false
+
+- name: collapsible_headings.indent_px
+  description: |
+    Shift the collapsible heading controls left by this many pixels per level,
+    such that more significant headings (lower levels) appear further to the
+    left
+  input_type: number
+  default: 8

src/jupyter_contrib_nbextensions/nbextensions/collapsible_headings/main.js

@@ -43,6 +43,7 @@
 		show_ellipsis : true,
 		select_reveals : true,
 		collapse_to_match_toc: false,
+		indent_px: 8,
 	};
 
 	// ------------------------------------------------------------------------
@@ -861,6 +862,19 @@
 		$.extend(true, params, options);
 		// bind/unbind toc-collapse handler
 		events[params.collapse_to_match_toc ? 'on' : 'off']('collapse.Toc uncollapse.Toc', callback_toc_collapse);
+		// add css for indents
+		if (params.indent_px !== 0) {
+			var lines = [];
+			for (var hh = 1; hh <= 6; hh++) {
+				lines.push(
+					'.collapsible_headings_toggle .h' + hh +
+					' { margin-right: ' + ((6 - hh) * params.indent_px) + 'px; }'
+				);
+			}
+			$('<style id="collapsible_headings_indent_css"/>')
+				.html(lines.join('\n'))
+				.appendTo('head');
+		}
 		return params;
 	}
 

src/jupyter_contrib_nbextensions/nbextensions/collapsible_headings/readme.md

@@ -42,6 +42,7 @@ the nbextensions config page:
   cell (disabled by default)
 * Collapse/uncollapse sections when ToC2 sections are collapsed/uncollapsed
 * A toolbar button to collapse/uncollapse all headings (disabled by default)
+* Shift more-significant headings' collapse controls further to the left
 
 
 css
@@ -121,4 +122,4 @@ associated `inliner.tpl` template, provided as part of the
 To convert to html embedding collapsible headings functionality, use `html_ch`
 exporter, with a command like
 
-    jupyter nbconvert --to html_ch FILE.ipynb 
+    jupyter nbconvert --to html_ch FILE.ipynb