feat: 增加ipynb渲染
This commit is contained in:
237
.vitepress/theme/css/jupyterlab/cells/widget.css
Normal file
237
.vitepress/theme/css/jupyterlab/cells/widget.css
Normal file
@@ -0,0 +1,237 @@
|
||||
/* stylelint-disable no-descending-specificity */
|
||||
|
||||
/* 源码地址:https://github.com/jupyterlab/jupyterlab/blob/master/packages/cells/style/widget.css */
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Copyright (c) Jupyter Development Team.
|
||||
| Distributed under the terms of the Modified BSD License.
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Private CSS variables
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--jp-private-cell-scrolling-output-offset: 5px;
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Cell
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
.jp-Cell {
|
||||
padding: var(--jp-cell-padding);
|
||||
margin: 0;
|
||||
border: none;
|
||||
outline: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Common input/output
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
.jp-Cell-inputWrapper,
|
||||
.jp-Cell-outputWrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
/* Added to reveal the box-shadow on the input and output collapsers. */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/* Only input/output areas inside cells */
|
||||
.jp-Cell-inputArea,
|
||||
.jp-Cell-outputArea {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Collapser
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
/* Make the output collapser disappear when there is not output, but do so
|
||||
* in a manner that leaves it in the layout and preserves its width.
|
||||
*/
|
||||
.jp-Cell.jp-mod-noOutputs .jp-Cell-outputCollapser {
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.jp-Cell:not(.jp-mod-noOutputs) .jp-Cell-outputCollapser {
|
||||
min-height: var(--jp-cell-collapser-min-height);
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Output
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
/* Put a space between input and output when there IS output */
|
||||
.jp-Cell:not(.jp-mod-noOutputs) .jp-Cell-outputWrapper {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea {
|
||||
overflow-y: auto;
|
||||
max-height: 24em;
|
||||
margin-left: var(--jp-private-cell-scrolling-output-offset);
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea[style*='height'] {
|
||||
max-height: unset;
|
||||
}
|
||||
|
||||
.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea::after {
|
||||
content: ' ';
|
||||
box-shadow: inset 0 0 6px 2px rgb(0 0 0 / 30%);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
margin-top: -50%;
|
||||
float: left;
|
||||
display: block;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.jp-CodeCell.jp-mod-outputsScrolled .jp-OutputArea-child {
|
||||
padding-top: 6px;
|
||||
}
|
||||
|
||||
.jp-CodeCell.jp-mod-outputsScrolled .jp-OutputArea-prompt {
|
||||
width:
|
||||
calc(
|
||||
var(--jp-cell-prompt-width) - var(--jp-private-cell-scrolling-output-offset)
|
||||
);
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| CodeCell
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| MarkdownCell
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
.jp-MarkdownOutput {
|
||||
display: table-cell;
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding-left: var(--jp-code-padding);
|
||||
}
|
||||
|
||||
.jp-MarkdownOutput.jp-RenderedHTMLCommon {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* collapseHeadingButton (show always if hiddenCellsButton is _not_ shown) */
|
||||
.jp-collapseHeadingButton {
|
||||
display: flex;
|
||||
min-height: var(--jp-cell-collapser-min-height);
|
||||
font-size: var(--jp-code-font-size);
|
||||
position: absolute;
|
||||
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);
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.jp-collapseHeadingButton.jp-mod-collapsed {
|
||||
background-image: var(--jp-icon-caret-right);
|
||||
}
|
||||
|
||||
/*
|
||||
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-mod-rendered .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-mod-rendered .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-mod-rendered .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-mod-rendered .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-mod-rendered .jp-collapseHeadingButton[data-heading-level='5'] {
|
||||
font-size: var(--jp-content-font-size1);
|
||||
background-position-y: top;
|
||||
}
|
||||
|
||||
.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='6'] {
|
||||
font-size: var(--jp-content-font-size0);
|
||||
background-position-y: top;
|
||||
}
|
||||
|
||||
/* collapseHeadingButton (show only on (hover,active) if hiddenCellsButton is shown) */
|
||||
.jp-Notebook.jp-mod-showHiddenCellsButton .jp-collapseHeadingButton {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.jp-Notebook.jp-mod-showHiddenCellsButton :is(.jp-MarkdownCell:hover, .jp-mod-active) .jp-collapseHeadingButton {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* showHiddenCellsButton (only show if jp-mod-showHiddenCellsButton is set, which
|
||||
is a consequence of the showHiddenCellsButton option in Notebook Settings) */
|
||||
.jp-Notebook.jp-mod-showHiddenCellsButton .jp-showHiddenCellsButton {
|
||||
margin-left: calc(var(--jp-cell-prompt-width) + 2 * var(--jp-code-padding));
|
||||
margin-top: var(--jp-code-padding);
|
||||
border: 1px solid var(--jp-border-color2);
|
||||
background-color: var(--jp-border-color3) !important;
|
||||
color: var(--jp-content-font-color0) !important;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.jp-Notebook.jp-mod-showHiddenCellsButton .jp-showHiddenCellsButton:hover {
|
||||
background-color: var(--jp-border-color2) !important;
|
||||
}
|
||||
|
||||
.jp-showHiddenCellsButton {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
| Printing
|
||||
|---------------------------------------------------------------------------- */
|
||||
|
||||
/*
|
||||
Using block instead of flex to allow the use of the break-inside CSS property for
|
||||
cell outputs.
|
||||
*/
|
||||
|
||||
@media print {
|
||||
.jp-Cell-inputWrapper,
|
||||
.jp-Cell-outputWrapper {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user