##// END OF EJS Templates
Reverse hscrollbar min-height hack on OS X...
Reverse hscrollbar min-height hack on OS X OS X has optional behavior to only draw scrollbars during scroll, which causes problems for CodeMirror's scrollbars. CodeMirror's solution is to set a minimum size for their scrollbars, which is always present. The trade is that the container overlays most of the last line, swallowing click events when there is scrolling to do, even when no scrollbar is visible. This reverses the trade, recovering the click events at the expense of never showing the horizontal scrollbar on OS X when this option is enabled.

File last commit:

r20124:e554eb6a
r20298:2907e856
Show More
cell.less
102 lines | 2.5 KiB | text/x-less | LessCssLexer
div.cell {
border: 1px solid transparent;
.vbox();
.corner-all();
.border-box-sizing();
border-width: thin;
border-style: solid;
&.selected {
border-color: @border_color;
/* Don't border the cells when printing */
@media print {
border-color: transparent;
}
}
.edit_mode &.selected {
border-color: green;
/* Don't border the cells when printing */
@media print {
border-color: transparent;
}
}
width: 100%;
padding: 5px;
/* This acts as a spacer between cells, that is outside the border */
margin: 0px;
outline: none;
}
.prompt {
/* This needs to be wide enough for 3 digit prompt numbers: In[100]: */
min-width: 14ex;
/* This padding is tuned to match the padding on the CodeMirror editor. */
padding: @code_padding;
margin: 0px;
font-family: @font-family-monospace;
text-align: right;
/* This has to match that of the the CodeMirror class line-height below */
line-height: @code_line_height;
}
@media (max-width: @screen-xs-min) {
// prompts are in the main column on small screens,
// so text should be left-aligned
.prompt {
text-align: left;
}
}
div.inner_cell {
.vbox();
.box-flex1();
}
/* input_area and input_prompt must match in top border and margin for alignment */
div.input_area {
border: 1px solid @light_border_color;
.corner-all;
background: @cell_background;
line-height: @code_line_height;
}
/* This is needed so that empty prompt areas can collapse to zero height when there
is no content in the output_subarea and the prompt. The main purpose of this is
to make sure that empty JavaScript output_subareas have no height. */
div.prompt:empty {
padding-top: 0;
padding-bottom: 0;
}
div.unrecognized_cell {
// from text_cell
padding: 5px 5px 5px 0px;
.hbox();
.inner_cell {
.border-radius(@border-radius-base);
padding: 5px;
font-weight: bold;
color: red;
border: 1px solid @light_border_color;
background: darken(@cell_background, 5%);
// remove decoration from link
a {
color: inherit;
text-decoration: none;
&:hover {
color: inherit;
text-decoration: none;
}
}
}
}
@media (max-width: @screen-xs-min) {
// remove prompt indentation on small screens
div.unrecognized_cell > div.prompt {
display: none;
}
}