@jupyterlab/nbconvert-css 3.3.3 → 3.3.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupyterlab/nbconvert-css",
-  "version": "3.3.3",
+  "version": "3.3.4",
   "description": "CSS bundle for the JupyterLab nbconvert template",
   "homepage": "https://github.com/jupyterlab/jupyterlab",
   "bugs": {
@@ -31,13 +31,13 @@
     "watch": "webpack --watch"
   },
   "dependencies": {
-    "@jupyterlab/application": "^3.3.3",
-    "@jupyterlab/apputils": "^3.3.3",
-    "@jupyterlab/cells": "^3.3.3",
-    "@jupyterlab/codemirror": "^3.3.3",
-    "@jupyterlab/notebook": "^3.3.3",
-    "@jupyterlab/outputarea": "^3.3.3",
-    "@jupyterlab/rendermime": "^3.3.3"
+    "@jupyterlab/application": "^3.3.4",
+    "@jupyterlab/apputils": "^3.3.4",
+    "@jupyterlab/cells": "^3.3.4",
+    "@jupyterlab/codemirror": "^3.3.4",
+    "@jupyterlab/notebook": "^3.3.4",
+    "@jupyterlab/outputarea": "^3.3.4",
+    "@jupyterlab/rendermime": "^3.3.4"
   },
   "devDependencies": {
     "css-loader": "^5.0.1",

package/style/index.css

@@ -13690,6 +13690,78 @@ body[data-format='mobile'] .jp-InputPrompt {
   overflow: auto;
 }
 
+/* collapseHeadingButton (show always if hiddenCellsButton is _not_ shown) */
+.jp-collapseHeadingButton {
+  display: none;
+  min-height: var(--jp-cell-collapser-min-height);
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background-color: transparent;
+  background-size: 25px;
+  background-repeat: no-repeat;
+  background-position-x: center;
+  background-position-y: top;
+  background-image: var(--jp-icon-caret-down);
+  border: none;
+  cursor: pointer;
+}
+
+.jp-collapseHeadingButton:hover {
+  background-color: var(--jp-layout-color2);
+}
+
+.jp-collapseHeadingButton.jp-mod-collapsed {
+  background-image: var(--jp-icon-caret-right);
+}
+
+:is(.jp-MarkdownCell:hover, .jp-mod-active) .jp-collapseHeadingButton {
+  display: flex;
+}
+
+/*
+ set the container font size to match that of content
+ so that the nested collapse buttons have the right size
+*/
+.jp-MarkdownCell .jp-InputPrompt {
+  font-size: var(--jp-content-font-size1);
+}
+
+/*
+  Align collapseHeadingButton with cell top header
+  The font sizes are identical to the ones in packages/rendermime/style/base.css
+*/
+.jp-collapseHeadingButton[data-heading-level='1'] {
+  font-size: var(--jp-content-font-size5);
+  background-position-y: calc(0.3 * var(--jp-content-font-size5));
+}
+
+.jp-collapseHeadingButton[data-heading-level='2'] {
+  font-size: var(--jp-content-font-size4);
+  background-position-y: calc(0.3 * var(--jp-content-font-size4));
+}
+
+.jp-collapseHeadingButton[data-heading-level='3'] {
+  font-size: var(--jp-content-font-size3);
+  background-position-y: calc(0.3 * var(--jp-content-font-size3));
+}
+
+.jp-collapseHeadingButton[data-heading-level='4'] {
+  font-size: var(--jp-content-font-size2);
+  background-position-y: calc(0.3 * var(--jp-content-font-size2));
+}
+
+.jp-collapseHeadingButton[data-heading-level='5'] {
+  font-size: var(--jp-content-font-size1);
+  background-position-y: top;
+}
+
+.jp-collapseHeadingButton[data-heading-level='6'] {
+  font-size: var(--jp-content-font-size0);
+  background-position-y: top;
+}
+
 .jp-showHiddenCellsButton {
   margin-left: calc(var(--jp-cell-prompt-width) + 2 * var(--jp-code-padding));
   margin-top: var(--jp-code-padding);
@@ -13702,19 +13774,6 @@ body[data-format='mobile'] .jp-InputPrompt {
   background-color: var(--jp-border-color2) !important;
 }
 
-.jp-collapseHeadingButton {
-  display: none;
-}
-
-.jp-MarkdownCell:hover .jp-collapseHeadingButton {
-  display: flex;
-  min-height: var(--jp-cell-collapser-min-height);
-  position: absolute;
-  right: 0;
-  top: 0;
-  bottom: 0;
-}
-
 /*-----------------------------------------------------------------------------
 | Copyright (c) Jupyter Development Team.
 | Distributed under the terms of the Modified BSD License.